/* RefractorySource Common CSS */
/* Updated: December 2025 */
/* Color Palette: #F8EDED #FF8225 #B43F3F #173B45 */

:root {
    /* ========================================
       PRIMARY BRAND COLOR - Flame Orange #FF8225
       Represents fire, heat, energy - perfect for refractory industry
       Use for: CTAs, links, primary actions, brand elements
       ======================================== */
    --orange-50: #FFF8F2;            /* Ultra-light tint - subtle backgrounds */
    --orange-100: #FFEDD9;           /* Very light - hover backgrounds */
    --orange-200: #FFD9B3;           /* Light - soft accents, borders */
    --orange-300: #FFC080;           /* Medium-light - secondary elements */
    --orange-400: #FFA14D;           /* Medium - interactive elements */
    --orange-500: #FF8225;           /* BASE - Primary brand color */
    --orange-600: #E06A10;           /* Medium-dark - hover states */
    --orange-700: #B85410;           /* Dark - active states, emphasis */
    --orange-800: #8F4010;           /* Darker - strong contrast text */
    --orange-900: #6B3010;           /* Darkest - maximum emphasis */

    /* ========================================
       ACCENT COLOR - Crimson #B43F3F
       Represents molten metal, intensity, strength
       Use for: Secondary CTAs, highlights, badges, emphasis
       ======================================== */
    --crimson-50: #FCF3F3;           /* Ultra-light tint */
    --crimson-100: #F8E0E0;          /* Very light */
    --crimson-200: #EFC2C2;          /* Light */
    --crimson-300: #DE9393;          /* Medium-light */
    --crimson-400: #C96969;          /* Medium */
    --crimson-500: #B43F3F;          /* BASE - Accent color */
    --crimson-600: #9A3030;          /* Medium-dark - hover */
    --crimson-700: #7D2525;          /* Dark - active */
    --crimson-800: #611C1C;          /* Darker */
    --crimson-900: #451414;          /* Darkest */

    /* ========================================
       PROFESSIONAL DARK - Deep Teal #173B45
       Industrial, trustworthy, sophisticated
       Use for: Navigation, headings, footer, professional elements
       ======================================== */
    --teal-50: #F2F6F7;              /* Ultra-light tint - subtle backgrounds */
    --teal-100: #E0E8EB;             /* Very light - borders, dividers */
    --teal-200: #B8CCD3;             /* Light - inactive states */
    --teal-300: #8AACB8;             /* Medium-light - secondary borders */
    --teal-400: #5C8A9A;             /* Medium - tertiary text */
    --teal-500: #3A6070;             /* Medium - secondary text */
    --teal-600: #264D5A;             /* Medium-dark */
    --teal-700: #173B45;             /* BASE - Primary dark */
    --teal-800: #122E36;             /* Darker - navigation, footer */
    --teal-900: #0C1F24;             /* Darkest - maximum contrast */

    /* ========================================
       WARM BACKGROUND - Rose Cream #F8EDED
       Soft, warm, sophisticated - reduces eye strain
       Use for: Backgrounds, cards, alternating sections
       ======================================== */
    --rose-50: #FEFBFB;              /* Brightest - near white */
    --rose-100: #FBF4F4;             /* Very light - subtle variation */
    --rose-200: #F8EDED;             /* BASE - Primary background */
    --rose-300: #F0E0E0;             /* Medium-light - borders */
    --rose-400: #E5D0D0;             /* Medium - dividers */
    --rose-500: #D4BABA;             /* Medium-dark - inactive elements */
    --rose-600: #B89A9A;             /* Dark - subtle text */
    --rose-700: #8A7070;             /* Darker - secondary elements */
    --rose-800: #5C4A4A;             /* Very dark - strong elements */
    --rose-900: #3A2E2E;             /* Darkest - near black */

    /* ========================================
       SEMANTIC COLOR MAPPINGS
       Apply new palette to common use cases
       ======================================== */

    /* Primary Brand Colors - Flame Orange */
    --primary-color: #FF8225;        /* Main brand orange - CTAs, links, primary actions */
    --primary-light: #FFA14D;        /* Light variant - hover states, soft accents */
    --primary-dark: #E06A10;         /* Dark variant - active states, pressed */
    --primary-subtle: #FFF8F2;       /* Ultra-subtle tint - highlighted backgrounds */
    --primary-vivid: #B85410;        /* High-energy variant - strong CTAs */

    /* Accent Colors - Crimson (for emphasis, badges, alerts) */
    --accent-color: #B43F3F;         /* Crimson accent - secondary actions, highlights */
    --accent-light: #C96969;         /* Light variant */
    --accent-dark: #9A3030;          /* Dark variant */
    --accent-subtle: #FCF3F3;        /* Ultra-subtle tint */

    /* Secondary Professional Colors - Deep Teal */
    --secondary-color: #173B45;      /* Professional teal - navigation, headers */
    --secondary-light: #3A6070;      /* Light variant - hover states */
    --secondary-dark: #122E36;       /* Dark variant - active states, footer */

    /* Neutral/Background Colors - Rose Cream */
    --neutral-50: #FEFBFB;           /* Brightest - pure white alternative */
    --neutral-100: #FBF4F4;          /* Very light - subtle backgrounds */
    --neutral-200: #F8EDED;          /* Light rose - card backgrounds, alternating sections */
    --neutral-300: #F0E0E0;          /* Medium-light - borders, dividers */
    --neutral-400: #E5D0D0;          /* Medium - inactive elements */
    --neutral-500: #D4BABA;          /* Mid neutral - placeholder text */
    --neutral-600: #B89A9A;          /* Dark neutral - secondary borders */
    --neutral-700: #8A7070;          /* Darker - tertiary text on light */
    --neutral-800: #5C4A4A;          /* Very dark - headings on rose */
    --neutral-900: #3A2E2E;          /* Darkest neutral - strong text */

    /* Text Color Hierarchy - Optimized for Readability */
    --text-primary: #173B45;         /* Deep teal - headings, important content */
    --text-secondary: #3A6070;       /* Medium teal - body text */
    --text-tertiary: #5C8A9A;        /* Light teal - captions, metadata */
    --text-muted: #5C6C75;           /* Muted gray - secondary text, descriptions */
    --text-light: #8A9BA3;           /* Light gray - placeholders, disabled */
    --text-white: #FFFFFF;           /* Pure white - text on dark backgrounds */
    --text-on-primary: #FFFFFF;      /* White text on orange backgrounds */
    --text-on-secondary: #FFFFFF;    /* White text on teal backgrounds */
    --text-on-accent: #FFFFFF;       /* White text on crimson backgrounds */

    /* Background System - Warm & Professional */
    --bg-primary: #FFFFFF;           /* Pure white - main content areas */
    --bg-secondary: #F8EDED;         /* Rose cream - alternating sections */
    --bg-tertiary: #FBF4F4;          /* Very light rose - cards, panels */
    --bg-accent: #FFF8F2;            /* Orange tint - highlighted sections */
    --bg-accent-alt: #FCF3F3;        /* Crimson tint - special highlights */
    --bg-dark: #173B45;              /* Deep teal - navigation, footer, headers */
    --bg-dark-secondary: #122E36;    /* Darker teal - overlays, modals */
    --bg-overlay: rgba(23, 59, 69, 0.9);  /* Teal overlay - modals, drawers */

    /* ========================================
       SEMANTIC COLORS - Status & Feedback
       ======================================== */
    --success-50: #F0FDF4;
    --success-500: #10B981;          /* Success green */
    --success-700: #047857;

    --warning-50: #FFF8F2;
    --warning-500: #FF8225;          /* Warning uses brand orange */
    --warning-700: #B85410;

    --error-50: #FCF3F3;
    --error-500: #B43F3F;            /* Error uses crimson accent */
    --error-700: #7D2525;

    --info-50: #F2F6F7;
    --info-500: #3A6070;             /* Info uses teal */
    --info-700: #173B45;

    /* System Semantic Mappings */
    --success-color: var(--success-500);
    --warning-color: var(--warning-500);
    --error-color: var(--error-500);
    --danger-color: var(--crimson-500);
    --info-color: var(--teal-500);

    /* ========================================
       LEGACY COMPATIBILITY MAPPINGS
       Maintain backward compatibility
       ======================================== */
    --light-color: var(--bg-secondary);
    --dark-color: var(--teal-700);

    /* Blue-gray mapped to teal (for backward compatibility) */
    --blue-gray-50: var(--teal-50);
    --blue-gray-100: var(--teal-100);
    --blue-gray-200: var(--teal-200);
    --blue-gray-300: var(--teal-300);
    --blue-gray-400: var(--teal-400);
    --blue-gray-500: var(--teal-500);
    --blue-gray-600: var(--teal-700);
    --blue-gray-700: var(--teal-800);
    --blue-gray-800: var(--teal-800);
    --blue-gray-900: var(--teal-900);

    /* Warm colors mapped to rose (for backward compatibility) */
    --warm-50: var(--rose-50);
    --warm-100: var(--rose-100);
    --warm-200: var(--rose-200);
    --warm-300: var(--rose-300);
    --warm-400: var(--rose-400);
    --warm-500: var(--rose-500);
    --warm-600: var(--rose-600);
    --warm-700: var(--rose-700);
    --warm-800: var(--rose-800);
    --warm-900: var(--rose-900);

    /* Gray scale mapped to neutral */
    --gray-50: var(--neutral-50);
    --gray-100: var(--neutral-100);
    --gray-200: var(--neutral-200);
    --gray-300: var(--neutral-300);
    --gray-400: var(--neutral-400);
    --gray-500: var(--neutral-500);
    --gray-600: var(--neutral-600);
    --gray-700: var(--neutral-700);
    --gray-800: var(--neutral-800);
    --gray-900: var(--neutral-900);

    /* RefractorySource (rs-) prefixed variables for consistency */
    --rs-primary: var(--primary-color);       /* #FF8225 - Flame Orange */
    --rs-accent: var(--accent-color);         /* #B43F3F - Crimson */
    --rs-orange-50: var(--orange-50);
    --rs-orange-100: var(--orange-100);
    --rs-orange-200: var(--orange-200);
    --rs-orange-300: var(--orange-300);
    --rs-orange-400: var(--orange-400);
    --rs-orange-500: var(--orange-500);
    --rs-orange-600: var(--orange-600);
    --rs-orange-700: var(--orange-700);
    --rs-orange-800: var(--orange-800);
    --rs-orange-900: var(--orange-900);
    --rs-crimson: var(--crimson-500);         /* #B43F3F */
    --rs-teal: var(--teal-700);               /* #173B45 */
    --rs-rose: var(--rose-200);               /* #F8EDED */
    /* Legacy compatibility */
    --rs-blue-gray: var(--teal-700);          /* Maps to new teal */
    --rs-cream: var(--rose-200);              /* Maps to new rose */

    /* ========================================
       TYPOGRAPHY SYSTEM - Outfit Font Family
       Clean, Modern, Professional for B2B
       ======================================== */

    /* Font Families - Outfit for clean B2B design */
    --font-primary: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-heading: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-body: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', 'Monaco', 'Cascadia Code', 'Courier New', monospace;

    /* Font Weights - Outfit Variable (100-900) */
    --font-weight-thin: 100;        /* Ultra thin - decorative only */
    --font-weight-extralight: 200;  /* Extra light - large display */
    --font-weight-light: 300;       /* Light - secondary text, captions */
    --font-weight-normal: 400;      /* Regular - body text default */
    --font-weight-medium: 500;      /* Medium - emphasized body, buttons */
    --font-weight-semibold: 600;    /* Semibold - subheadings, labels */
    --font-weight-bold: 700;        /* Bold - headings, CTAs */
    --font-weight-extrabold: 800;   /* Extra bold - hero headlines */
    --font-weight-black: 900;       /* Black - maximum impact */

    /* ========================================
       TYPE SCALE - Major Third (1.25)
       Clean progression for industrial B2B
       Base: 16px (1rem)
       ======================================== */
    --font-size-2xs: 0.625rem;      /* 10px - badges, fine print */
    --font-size-xs: 0.75rem;        /* 12px - labels, metadata */
    --font-size-sm: 0.875rem;       /* 14px - captions, small body */
    --font-size-base: 1rem;         /* 16px - body text default */
    --font-size-md: 1.125rem;       /* 18px - lead paragraphs */
    --font-size-lg: 1.25rem;        /* 20px - intro text, h6 */
    --font-size-xl: 1.5rem;         /* 24px - h5, card titles */
    --font-size-2xl: 1.875rem;      /* 30px - h4, section leads */
    --font-size-3xl: 2.25rem;       /* 36px - h3, feature titles */
    --font-size-4xl: 3rem;          /* 48px - h2, section titles */
    --font-size-5xl: 3.5rem;        /* 56px - h1, page titles */
    --font-size-6xl: 4rem;          /* 64px - hero headlines */
    --font-size-7xl: 5rem;          /* 80px - giant display */

    /* ========================================
       LINE HEIGHTS - Optimized for Outfit
       Tighter for headings, relaxed for body
       ======================================== */
    --line-height-none: 1;          /* Display text, single line */
    --line-height-tight: 1.15;      /* Large headings (h1, h2) */
    --line-height-snug: 1.25;       /* Medium headings (h3, h4) */
    --line-height-normal: 1.4;      /* Small headings, UI elements */
    --line-height-relaxed: 1.6;     /* Body text - optimal reading */
    --line-height-loose: 1.75;      /* Long-form content, articles */
    --line-height-spacious: 2;      /* Legal text, terms */

    /* ========================================
       LETTER SPACING - Clean & Professional
       Tighter for headings, open for small text
       ======================================== */
    --letter-spacing-tighter: -0.04em;  /* Large display text */
    --letter-spacing-tight: -0.02em;    /* Headings */
    --letter-spacing-normal: 0;         /* Body text */
    --letter-spacing-wide: 0.02em;      /* Small caps, labels */
    --letter-spacing-wider: 0.04em;     /* Uppercase text */
    --letter-spacing-widest: 0.08em;    /* Micro text, all caps */

    /* ========================================
       PARAGRAPH & CONTENT SPACING
       ======================================== */
    --paragraph-spacing: 1.5rem;        /* Space between paragraphs */
    --content-spacing-sm: 0.75rem;      /* Tight content blocks */
    --content-spacing-md: 1.25rem;      /* Default content blocks */
    --content-spacing-lg: 2rem;         /* Loose content blocks */

    /* ========================================
       TEXT WIDTH - Optimal Reading
       ======================================== */
    --text-width-narrow: 45ch;          /* Short paragraphs, cards */
    --text-width-optimal: 65ch;         /* Ideal reading width */
    --text-width-wide: 80ch;            /* Wide content areas */
    
    /* Design System - Modern & Clean */
    --border-radius: 8px;
    --border-radius-sm: 6px;
    --border-radius-lg: 12px;
    --border-radius-xl: 20px;
    --border-radius-full: 9999px;

    /* Modern Shadow System - Soft & Natural (using deep teal #173B45) */
    --shadow-xs: 0 1px 2px 0 rgba(23, 59, 69, 0.05);
    --shadow-sm: 0 1px 3px 0 rgba(23, 59, 69, 0.08), 0 1px 2px -1px rgba(23, 59, 69, 0.08);
    --shadow-md: 0 4px 6px -1px rgba(23, 59, 69, 0.1), 0 2px 4px -2px rgba(23, 59, 69, 0.08);
    --shadow-lg: 0 10px 15px -3px rgba(23, 59, 69, 0.1), 0 4px 6px -4px rgba(23, 59, 69, 0.08);
    --shadow-xl: 0 20px 25px -5px rgba(23, 59, 69, 0.1), 0 8px 10px -6px rgba(23, 59, 69, 0.08);
    --shadow-2xl: 0 25px 50px -12px rgba(23, 59, 69, 0.25);

    /* Colored Shadows - Flame Orange #FF8225 */
    --shadow-primary-sm: 0 4px 12px 0 rgba(255, 130, 37, 0.25);
    --shadow-primary-md: 0 8px 20px 0 rgba(255, 130, 37, 0.3);
    --shadow-primary-lg: 0 12px 28px 0 rgba(255, 130, 37, 0.35);

    /* Colored Shadows - Crimson #B43F3F */
    --shadow-accent-sm: 0 4px 12px 0 rgba(180, 63, 63, 0.25);
    --shadow-accent-md: 0 8px 20px 0 rgba(180, 63, 63, 0.3);
    --shadow-accent-lg: 0 12px 28px 0 rgba(180, 63, 63, 0.35);

    /* Border System - Clean & Subtle */
    --border-width: 1px;
    --border-width-thick: 2px;
    --border-color: var(--neutral-200);
    --border-color-light: var(--neutral-100);
    --border-color-medium: var(--neutral-300);
    --border-color-dark: var(--neutral-400);
    --border-color-primary: var(--orange-300);
    
    /* Transitions - Smooth & Professional */
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-fast: all 0.15s ease;
    --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* Legacy Mappings */
    --box-shadow: var(--shadow-md);
    --box-shadow-sm: var(--shadow-sm);
    --box-shadow-lg: var(--shadow-lg);

    /* ========================================
       BOOTSTRAP 5 COLOR OVERRIDES
       Override Bootstrap's default colors to match new palette
       #F8EDED #FF8225 #B43F3F #173B45
       ======================================== */

    /* Primary = Flame Orange #FF8225 */
    --bs-primary: #FF8225;
    --bs-primary-rgb: 255, 130, 37;
    --bs-primary-bg-subtle: #FFF8F2;
    --bs-primary-text-emphasis: #B85410;
    --bs-primary-border-subtle: #FFD9B3;

    /* Info = Deep Teal #173B45 */
    --bs-info: #3A6070;
    --bs-info-rgb: 58, 96, 112;
    --bs-info-bg-subtle: #F2F6F7;
    --bs-info-text-emphasis: #173B45;
    --bs-info-border-subtle: #B8CCD3;

    /* Secondary = Deep Teal #173B45 */
    --bs-secondary: #173B45;
    --bs-secondary-rgb: 23, 59, 69;
    --bs-secondary-bg-subtle: #F2F6F7;
    --bs-secondary-text-emphasis: #122E36;
    --bs-secondary-border-subtle: #B8CCD3;

    /* Success = Green (keep Bootstrap's semantic meaning) */
    --bs-success: #10B981;
    --bs-success-rgb: 16, 185, 129;
    --bs-success-bg-subtle: #F0FDF4;
    --bs-success-text-emphasis: #047857;
    --bs-success-border-subtle: #86EFAC;

    /* Warning = Flame Orange #FF8225 */
    --bs-warning: #FF8225;
    --bs-warning-rgb: 255, 130, 37;
    --bs-warning-bg-subtle: #FFF8F2;
    --bs-warning-text-emphasis: #B85410;
    --bs-warning-border-subtle: #FFD9B3;

    /* Danger = Crimson #B43F3F */
    --bs-danger: #B43F3F;
    --bs-danger-rgb: 180, 63, 63;
    --bs-danger-bg-subtle: #FCF3F3;
    --bs-danger-text-emphasis: #7D2525;
    --bs-danger-border-subtle: #EFC2C2;

    /* Body text color = Deep Teal */
    --bs-body-color: #173B45;
    --bs-body-color-rgb: 23, 59, 69;

    /* Light background = Rose Cream #F8EDED */
    --bs-light: #F8EDED;
    --bs-light-rgb: 248, 237, 237;
    --bs-light-bg-subtle: #FEFBFB;
    --bs-light-text-emphasis: #5C4A4A;
    --bs-light-border-subtle: #F0E0E0;

    /* Dark = Deep Teal #173B45 */
    --bs-dark: #173B45;
    --bs-dark-rgb: 23, 59, 69;
    --bs-dark-bg-subtle: #E0E8EB;
    --bs-dark-text-emphasis: #0C1F24;
    --bs-dark-border-subtle: #8AACB8;

    /* Link color = Flame Orange */
    --bs-link-color: #FF8225;
    --bs-link-hover-color: #E06A10;
    --bs-link-color-rgb: 255, 130, 37;
    --bs-link-hover-color-rgb: 224, 106, 16;
}

/* Bootstrap Utility Class Overrides */
.bg-info {
    background-color: var(--orange-500) !important;
    color: white !important;
}

.text-info {
    color: var(--orange-500) !important;
}

.badge.bg-info {
    background-color: var(--orange-500) !important;
    color: white !important;
}

.btn-info {
    --bs-btn-bg: var(--orange-500);
    --bs-btn-border-color: var(--orange-500);
    --bs-btn-hover-bg: var(--orange-600);
    --bs-btn-hover-border-color: var(--orange-600);
    --bs-btn-active-bg: var(--orange-700);
    --bs-btn-active-border-color: var(--orange-700);
    --bs-btn-color: white;
}

.alert-info {
    --bs-alert-bg: var(--orange-50);
    --bs-alert-color: var(--orange-700);
    --bs-alert-border-color: var(--orange-300);
}

.border-info {
    border-color: var(--orange-500) !important;
}

/* Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    color: var(--text-secondary);
    background-color: var(--bg-primary);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
}

/* Page load animation */
body {
    animation: fadeIn 0.6s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* ========================================
   HEADING HIERARCHY - Clean & Flat Design
   Outfit font with tight leading for headings
   ======================================== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    color: var(--text-primary);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-snug);
    margin-top: 0;
    margin-bottom: 0.75em;
    letter-spacing: var(--letter-spacing-tight);
}

/* H1 - Page Titles, Hero Headlines */
h1 {
    font-size: var(--font-size-5xl);      /* 56px */
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tighter);
    margin-bottom: 1rem;
}

/* H2 - Section Titles */
h2 {
    font-size: var(--font-size-4xl);      /* 48px */
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tight);
    margin-bottom: 0.875rem;
}

/* H3 - Subsection Titles, Feature Titles */
h3 {
    font-size: var(--font-size-3xl);      /* 36px */
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-snug);
    letter-spacing: var(--letter-spacing-tight);
    margin-bottom: 0.75rem;
}

/* H4 - Card Titles, Group Headers */
h4 {
    font-size: var(--font-size-2xl);      /* 30px */
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-snug);
    margin-bottom: 0.625rem;
}

/* H5 - Small Section Titles, Widget Headers */
h5 {
    font-size: var(--font-size-xl);       /* 24px */
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    margin-bottom: 0.5rem;
}

/* H6 - Labels, Meta Titles */
h6 {
    font-size: var(--font-size-lg);       /* 20px */
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    margin-bottom: 0.5rem;
    letter-spacing: var(--letter-spacing-normal);
}

/* ========================================
   PARAGRAPH & BODY TEXT - Optimal Readability
   ======================================== */
p {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    color: var(--text-secondary);
    margin-top: 0;
    margin-bottom: var(--paragraph-spacing);
    max-width: var(--text-width-optimal);
}

p:last-child {
    margin-bottom: 0;
}

/* Lead Paragraph - Intro text, descriptions */
p.lead,
.lead {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    color: var(--text-secondary);
    margin-bottom: 1.75rem;
    max-width: var(--text-width-wide);
}

/* Large Lead - Hero descriptions */
.lead-lg {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-light);
    line-height: var(--line-height-relaxed);
    color: var(--text-secondary);
    margin-bottom: 2rem;
}

/* Small Text - Captions, footnotes */
small,
.small {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-normal);
}

/* Extra Small Text - Labels, metadata */
.text-xs,
.text-2xs {
    font-size: var(--font-size-xs);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-wide);
}

/* Micro Text - Fine print, badges */
.text-micro {
    font-size: var(--font-size-2xs);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-wider);
    text-transform: uppercase;
}

a {
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    color: var(--primary-color);
}

a:hover {
    color: var(--orange-600);
}

a:focus {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
    border-radius: 2px;
}

img {
    max-width: 100%;
    height: auto;
}

.section-padding {
    padding: 5rem 0;
}

.bg-light {
    background-color: var(--bg-secondary) !important;
}

.bg-accent {
    background-color: var(--bg-accent) !important;
}

.bg-tertiary {
    background-color: var(--bg-tertiary) !important;
}

.text-muted {
    color: var(--text-muted) !important;
}

/* ========================================
   TYPOGRAPHY UTILITY CLASSES
   ======================================== */

/* Font Sizes */
.text-2xs { font-size: var(--font-size-2xs) !important; }
.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-md { font-size: var(--font-size-md) !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; }
.text-7xl { font-size: var(--font-size-7xl) !important; }

/* Font Weights */
.font-thin { font-weight: var(--font-weight-thin) !important; }
.font-extralight { font-weight: var(--font-weight-extralight) !important; }
.font-light { font-weight: var(--font-weight-light) !important; }
.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-extrabold { font-weight: var(--font-weight-extrabold) !important; }
.font-black { font-weight: var(--font-weight-black) !important; }

/* Line Heights */
.leading-none { line-height: var(--line-height-none) !important; }
.leading-tight { line-height: var(--line-height-tight) !important; }
.leading-snug { line-height: var(--line-height-snug) !important; }
.leading-normal { line-height: var(--line-height-normal) !important; }
.leading-relaxed { line-height: var(--line-height-relaxed) !important; }
.leading-loose { line-height: var(--line-height-loose) !important; }
.leading-spacious { line-height: var(--line-height-spacious) !important; }

/* Letter Spacing */
.tracking-tighter { letter-spacing: var(--letter-spacing-tighter) !important; }
.tracking-tight { letter-spacing: var(--letter-spacing-tight) !important; }
.tracking-normal { letter-spacing: var(--letter-spacing-normal) !important; }
.tracking-wide { letter-spacing: var(--letter-spacing-wide) !important; }
.tracking-wider { letter-spacing: var(--letter-spacing-wider) !important; }
.tracking-widest { letter-spacing: var(--letter-spacing-widest) !important; }

/* ========================================
   DISPLAY TEXT - Large Headlines
   Clean, flat typography for impact
   ======================================== */

/* Display Headlines - For hero sections, landing pages */
.display-1 {
    font-size: var(--font-size-7xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tighter);
    color: var(--text-primary);
}

.display-2 {
    font-size: var(--font-size-6xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tighter);
    color: var(--text-primary);
}

.display-3 {
    font-size: var(--font-size-5xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tight);
    color: var(--text-primary);
}

.display-4 {
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-snug);
    letter-spacing: var(--letter-spacing-tight);
    color: var(--text-primary);
}

/* Section Title - Standardized section headers */
.section-heading {
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tight);
    color: var(--text-primary);
    margin-bottom: 1rem;
}

.section-subheading {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    color: var(--text-tertiary);
    max-width: var(--text-width-optimal);
}

/* Card Titles - Consistent card headers */
.card-title-lg {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-snug);
    color: var(--text-primary);
    margin-bottom: 0.5rem;
}

.card-title {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-snug);
    color: var(--text-primary);
    margin-bottom: 0.5rem;
}

.card-title-sm {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    color: var(--text-primary);
    margin-bottom: 0.375rem;
}

/* Label Styles - Form labels, meta text */
.label {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-wide);
    color: var(--text-secondary);
    text-transform: uppercase;
}

.label-sm {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-wider);
    color: var(--text-tertiary);
    text-transform: uppercase;
}

/* Overline - Category labels above headings */
.overline {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-widest);
    color: var(--primary-color);
    text-transform: uppercase;
    margin-bottom: 0.5rem;
    display: block;
}

/* Eyebrow - Smaller category text */
.eyebrow {
    font-size: var(--font-size-2xs);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-widest);
    color: var(--text-muted);
    text-transform: uppercase;
    margin-bottom: 0.25rem;
    display: block;
}

/* Quote Styles */
.blockquote,
blockquote {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-light);
    line-height: var(--line-height-relaxed);
    font-style: italic;
    color: var(--text-secondary);
    border-left: 3px solid var(--primary-color);
    padding-left: 1.5rem;
    margin: 1.5rem 0;
}

.blockquote-footer,
blockquote footer {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    font-style: normal;
    color: var(--text-tertiary);
    margin-top: 0.75rem;
}

/* Text Width Utilities */
.text-narrow { max-width: var(--text-width-narrow); }
.text-optimal { max-width: var(--text-width-optimal); }
.text-wide { max-width: var(--text-width-wide); }
.text-full { max-width: 100%; }

/* Text Colors */
.text-primary-color {
    color: var(--text-primary) !important;
}

.text-secondary-color {
    color: var(--text-secondary) !important;
}

.text-tertiary-color {
    color: var(--text-tertiary) !important;
}

.text-white {
    color: var(--text-white) !important;
}

/* Brand Colors */
.text-primary {
    color: var(--primary-color) !important;
}

.text-brand {
    color: var(--primary-color) !important;
}

.text-orange {
    color: var(--orange-500) !important;
}

/* Semantic Colors */
.text-success {
    color: var(--success-500) !important;
}

.text-warning {
    color: var(--warning-500) !important;
}

.text-error {
    color: var(--error-500) !important;
}

.text-info {
    color: var(--info-500) !important;
}

/* Text Transform */
.uppercase { text-transform: uppercase !important; }
.lowercase { text-transform: lowercase !important; }
.capitalize { text-transform: capitalize !important; }
.normal-case { text-transform: none !important; }

/* Professional Card Enhancements */
.card {
    border: none;
    box-shadow: var(--shadow-sm);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    transition: var(--transition);
    background: var(--bg-primary);
    position: relative;
}

.card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, transparent 0%, rgba(255, 130, 37, 0.02) 100%);
    opacity: 0;
    transition: var(--transition);
    pointer-events: none;
}

.card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
}

.card:hover::before {
    opacity: 1;
}

/* Enhanced Visual Elements */
.border-primary {
    border-color: var(--primary-color) !important;
}

.border-secondary {
    border-color: var(--secondary-color) !important;
}

.bg-primary-subtle {
    background-color: var(--primary-subtle) !important;
}

.bg-secondary-subtle {
    background-color: var(--secondary-subtle) !important;
}

.shadow-sm {
    box-shadow: var(--shadow-sm) !important;
}

.shadow-md {
    box-shadow: var(--shadow-md) !important;
}

.shadow-lg {
    box-shadow: var(--shadow-lg) !important;
}

/* Section Title Styling - Based on Reference */
.section-title {
    position: relative;
    margin-bottom: 3rem;
    text-align: center;
}

.section-title::after {
    content: '';
    position: absolute;
    width: 70px;
    height: 3px;
    background-color: var(--primary-color);
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
}

.section-title h2 {
    color: var(--text-primary);
    font-weight: var(--font-weight-semibold);
    margin-bottom: 1rem;
}

.section-title .text-muted {
    font-size: var(--font-size-md);
    max-width: 600px;
    margin: 0 auto;
}

/* Utility Classes */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s ease;
}

.fade-in.active {
    opacity: 1;
    transform: translateY(0);
}

/* Navigation Styles */
.navbar {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    background-color: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 1rem 0;
    border-bottom: 1px solid transparent;
}

.navbar-scrolled {
    padding: 0.5rem 0;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    background-color: rgba(255, 255, 255, 0.98);
    border-bottom-color: var(--gray-200);
}

.navbar-brand {
    font-family: var(--font-heading);
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    color: var(--text-primary) !important;
    letter-spacing: var(--letter-spacing-tight);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    text-decoration: none;
}

.navbar-brand:hover {
    transform: scale(1.05);
    color: var(--primary-color) !important;
    text-decoration: none;
}

.navbar-brand i,
.navbar-brand i.fas,
.navbar-brand i.fa,
.navbar .navbar-brand i {
    font-size: var(--font-size-xl) !important;
    color: var(--primary-color) !important;
    margin-right: 0.5rem !important;
    transition: all 0.3s ease !important;
}

.navbar-brand:hover i,
.navbar-brand:hover i.fas,
.navbar-brand:hover i.fa,
.navbar .navbar-brand:hover i {
    transform: rotate(5deg) scale(1.1) !important;
    color: var(--primary-color) !important;
}

.navbar-nav .nav-link {
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    color: var(--text-primary);
    letter-spacing: var(--letter-spacing-normal);
    padding: 0.75rem 1.25rem;
    position: relative;
    transition: all 0.3s ease;
    display: block;
    border-radius: 6px;
    margin: 0 0.25rem;
}

.navbar-nav .nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 50%;
    width: 0;
    height: 2px;
    background-color: var(--orange-500);
    transition: all 0.3s ease;
    transform: translateX(-50%);
    border-radius: 1px;
}

.navbar-nav .nav-link:hover::after,
.navbar-nav .nav-link.active::after {
    width: 80%;
}

/* Enable underline animation for dropdown toggles like other menu items */
.navbar-nav .nav-link.dropdown-toggle::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 50%;
    width: 12%;  /* Reduced width - smaller underline by default */
    height: 4px;  /* Thicker underline */
    background-color: var(--orange-500);
    transition: all 0.3s ease;
    transform: translateX(-50%);
    border-radius: 2px;
    display: block !important;
}

.navbar-nav .nav-link.dropdown-toggle:hover::after,
.navbar-nav .nav-link.dropdown-toggle.show::after {
    width: 80% !important;  /* Full width underline on hover like other items */
    height: 4px !important;  /* Maintain thick underline on hover */
    display: block !important;
}

.navbar-nav .nav-link:hover {
    color: var(--orange-500);
    background-color: rgba(255, 130, 37, 0.08);
    transform: translateY(-1px);
}

.navbar-nav .nav-link.active {
    color: var(--orange-500);
    background-color: rgba(255, 130, 37, 0.12);
    font-weight: var(--font-weight-semibold);
}

.navbar-nav .nav-link.dropdown-toggle:hover {
    color: var(--orange-500);
    background-color: rgba(255, 130, 37, 0.08);
    transform: translateY(-1px);
}

.navbar-nav .nav-link.dropdown-toggle.show {
    color: var(--orange-500);
    background-color: rgba(255, 130, 37, 0.12);
}

.dropdown-menu {
    border: none;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    border-radius: var(--border-radius-lg);
    background-color: white;
    border: 1px solid var(--gray-200);
    padding: 1rem 0;
    margin-top: 0;
    min-width: 250px;
    z-index: 1050;
    position: absolute;
    top: 100%;
    left: 0;
    display: none;
    opacity: 0;
    transform: translateY(0);
    transition: opacity 0.2s ease-in-out;
}

/* Desktop hover dropdown behavior */
@media (min-width: 992px) {
    /* Add invisible bridge to prevent gap issues */
    .navbar-nav .dropdown {
        position: relative;
    }

    .navbar-nav .dropdown::after {
        content: '';
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        height: 15px;
        background: transparent;
    }

    .navbar-nav .dropdown:hover > .dropdown-menu,
    .navbar-nav .dropdown-menu.show {
        display: block;
        opacity: 1;
    }

    /* Disable Bootstrap's default click behavior on desktop */
    .navbar-nav .dropdown-toggle::after {
        display: none;
    }
}

/* Keyframes for smooth dropdown animation */
@keyframes dropdownFadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile dropdown behavior */
@media (max-width: 991.98px) {
    .navbar-collapse {
        background: white;
        padding: 1rem;
        margin-top: 0.5rem;
        border-radius: var(--border-radius-lg);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
        max-height: 80vh;
        overflow-y: auto;
    }

    .navbar-nav .nav-item {
        border-bottom: 1px solid var(--border-color-light);
    }

    .navbar-nav .nav-item:last-child {
        border-bottom: none;
    }

    .navbar-nav .nav-link {
        padding: 0.875rem 0.5rem;
        color: var(--text-primary);
    }

    .navbar-nav .dropdown-toggle::after {
        display: inline-block !important;
        float: right;
        margin-top: 0.5rem;
        margin-left: 0.5rem;
        transition: transform 0.3s ease;
        border-top: 0.3em solid;
        border-right: 0.3em solid transparent;
        border-bottom: 0;
        border-left: 0.3em solid transparent;
    }

    .navbar-nav .dropdown-toggle[aria-expanded="true"]::after {
        transform: rotate(180deg);
    }

    .navbar-nav .dropdown-menu {
        position: static !important;
        float: none;
        width: 100% !important;
        min-width: 100% !important;
        margin: 0 !important;
        padding: 0.5rem 0 !important;
        background-color: var(--gray-50) !important;
        border: none !important;
        border-radius: var(--border-radius-md) !important;
        box-shadow: none !important;
        display: none !important;
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .navbar-nav .dropdown-menu.show {
        display: block !important;
    }

    .navbar-nav .dropdown-menu .dropdown-item {
        padding: 0.75rem 1.25rem;
        font-size: var(--font-size-sm);
        color: var(--text-primary);
        border-bottom: 1px solid var(--border-color-light);
        white-space: normal;
    }

    .navbar-nav .dropdown-menu .dropdown-item:last-child {
        border-bottom: none;
    }

    .navbar-nav .dropdown-menu .dropdown-item:hover,
    .navbar-nav .dropdown-menu .dropdown-item:focus {
        background-color: var(--gray-100);
        color: var(--orange-500);
    }

    .navbar-nav .dropdown-menu::before {
        display: none !important;
    }

    /* Hide 2-column layout on mobile */
    .dropdown-menu-2col .dropdown-content {
        display: block !important;
        grid-template-columns: 1fr !important;
    }

    .dropdown-menu-2col .dropdown-item {
        grid-column: auto !important;
    }

    /* Mobile CTA button */
    .navbar-nav .nav-item .btn {
        width: 100%;
        margin-top: 0.5rem;
    }
}

.dropdown-menu::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 20px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid white;
    z-index: 1001;
}

.dropdown-item {
    color: var(--text-primary);
    font-weight: var(--font-weight-medium);
    padding: 0.875rem 1.5rem;
    transition: all 0.2s ease;
    position: relative;
    border-radius: 0;
    display: flex;
    align-items: center;
}

.dropdown-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--orange-500);
    transform: scaleY(0);
    transition: transform 0.2s ease;
}

.dropdown-item:hover {
    background-color: var(--orange-50);
    color: var(--orange-700);
    transform: translateX(8px);
    padding-left: 2rem;
}

.dropdown-item:hover::before {
    transform: scaleY(1);
}

.dropdown-item:active {
    background-color: var(--orange-100);
}

.dropdown-divider {
    margin: 0.5rem 1rem;
    border-color: var(--gray-200);
}

/* Remove Bootstrap dropdown arrows but allow underline */
.dropdown-toggle::after {
    border: none !important;
    font-family: inherit !important;
    vertical-align: initial !important;
    margin-left: 0 !important;
}

/* Remove any remaining Bootstrap dropdown styling conflicts */
.dropdown-toggle:hover::after,
.dropdown-toggle.show::after {
    border: none !important;
    transform: none !important;
}

/* 2-Column Mega Dropdown for Products */
.dropdown-menu-2col {
    min-width: 520px;
    max-width: 600px;
}

@media (min-width: 992px) {
    .dropdown-menu-2col .dropdown-content {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
        padding: 0.5rem;
    }

    .dropdown-menu-2col .dropdown-item {
        padding: 0.75rem 1rem;
        margin: 0;
    }

    .dropdown-menu-2col .dropdown-divider-fullwidth {
        grid-column: 1 / -1;
        margin: 0.75rem 0.5rem;
    }

    .dropdown-menu-2col .dropdown-item-fullwidth {
        grid-column: 1 / -1;
    }
}

/* Mobile: Single column */
@media (max-width: 991.98px) {
    .dropdown-menu-2col {
        min-width: auto;
    }

    .dropdown-menu-2col .dropdown-content {
        display: block;
    }
}

/* Clean up any remaining dropdown arrow styles */
.dropdown-toggle[aria-expanded="true"]::after {
    border: none !important;
    transform: none !important;
}

/* Allow dropdown toggles to use underline styling */

/* Clean slate for dropdown toggles - no arrow conflicts */

/* Mobile dropdown improvements */
@media (max-width: 991.98px) {
    .dropdown-menu {
        box-shadow: none;
        border: none;
        background-color: var(--gray-50);
        border-radius: 0;
        margin-top: 0.5rem;
        padding: 0.5rem 0;
    }
    
    .dropdown-menu::before {
        display: none;
    }
    
    .dropdown-item {
        padding: 0.75rem 2rem;
    }
    
    .dropdown-item:hover {
        background-color: var(--orange-100);
        transform: none;
        padding-left: 2rem;
    }
}

/* ========================================
   Language Selector Dropdown
   ======================================== */
.rs-language-selector {
    position: relative;
    margin-left: 0.75rem;
}

.rs-language-toggle {
    background: transparent;
    border: 2px solid var(--gray-300);
    border-radius: var(--border-radius-md);
    padding: 0.5rem 0.65rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    color: var(--text-primary);
    font-size: var(--font-size-md);
}

.rs-language-toggle:hover {
    border-color: var(--orange-500);
    color: var(--orange-500);
    background-color: var(--orange-50);
}

.rs-language-toggle:focus {
    outline: none;
    border-color: var(--orange-500);
    box-shadow: 0 0 0 3px rgba(255, 130, 37, 0.15);
}

.rs-language-menu {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 0.5rem;
    background: white;
    border-radius: var(--border-radius-lg);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    border: 1px solid var(--gray-200);
    min-width: 180px;
    padding: 0.5rem 0;
    z-index: 1100;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
}

.rs-language-selector:hover .rs-language-menu,
.rs-language-selector.active .rs-language-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.rs-language-menu::before {
    content: '';
    position: absolute;
    top: -6px;
    right: 12px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid white;
}

.rs-language-menu a {
    display: flex;
    align-items: center;
    padding: 0.4rem 0.85rem;
    color: var(--text-primary);
    text-decoration: none;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    transition: all 0.2s ease;
    line-height: var(--line-height-normal);
}

.rs-language-menu a:hover {
    background-color: var(--orange-50);
    color: var(--orange-600);
    padding-left: 1rem;
}

.rs-language-menu a.active {
    background-color: var(--orange-100);
    color: var(--orange-700);
    font-weight: var(--font-weight-semibold);
}

.rs-language-menu .flag-icon {
    font-size: var(--font-size-base);
    margin-right: 0.5rem;
}

/* Mobile language selector */
@media (max-width: 991.98px) {
    .rs-language-selector {
        margin-left: 0;
        margin-top: 1rem;
        display: flex;
        justify-content: center;
    }

    .rs-language-toggle {
        padding: 0.6rem 0.8rem;
    }

    .rs-language-menu {
        right: auto;
        left: 50%;
        transform: translateX(-50%) translateY(-10px);
    }

    .rs-language-selector:hover .rs-language-menu,
    .rs-language-selector.active .rs-language-menu {
        transform: translateX(-50%) translateY(0);
    }

    .rs-language-menu::before {
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }
}

/* Hero Section */
.hero-section {
    position: relative;
    min-height: 100vh;
    background: linear-gradient(135deg, #B85410 0%, #FF8225 35%, #FFA14D 75%, #E06A10 100%);
    display: flex;
    align-items: center;
    color: white;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

.hero-section::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.12) 0%, transparent 50%),
                radial-gradient(circle at 70% 80%, rgba(255, 255, 255, 0.08) 0%, transparent 50%);
    pointer-events: none;
    z-index: 1;
}

/* Hero section with background image variant */
.hero-section.hero-with-image {
    background-image: var(--hero-bg-image, none);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/* Hero image overlay - dark overlay for text readability, image shows clearly */
.hero-section.hero-with-image::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.5) 100%);
    z-index: 1;
}

/* Specific hero backgrounds */
.rs-hero-industrial {
    --hero-bg-image: url('../images/backgrounds/hero-industrial.jpg');
}

.hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle at 25% 25%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
                      radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
    z-index: 1;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, rgba(23, 59, 69, 0.2) 0%, rgba(0, 0, 0, 0.1) 100%);
    z-index: 2;
}

.hero-section .container {
    position: relative;
    z-index: 3;
}

.hero-title {
    font-family: var(--font-heading);
    font-size: var(--font-size-5xl);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tighter);
    color: var(--text-white);
    margin-bottom: 1.5rem;
}

.hero-subtitle {
    font-family: var(--font-body);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    letter-spacing: var(--letter-spacing-normal);
    color: var(--text-white);
    opacity: 0.96;
    max-width: 650px;
    margin-bottom: 2.5rem;
}

.hero-buttons {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.hero-buttons .btn {
    padding: 1rem 2.5rem;
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-md);
    border-radius: 50px;
    text-transform: none;
    letter-spacing: 0.025em;
    min-width: 180px;
    border-width: 2px;
}

/* Product Cards */
.product-card {
    border-radius: var(--border-radius-lg);
    padding: 1.5rem;
    text-align: center;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.07);
    height: 100%;
    background: var(--bg-primary);
    position: relative;
    border: 1px solid var(--border-color-light);
    display: flex;
    flex-direction: column;
}

/* Product card with image - image flush to edges */
.product-card:has(.product-image) {
    padding: 0;
}

/* Product card image container */
.product-card .product-image {
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    line-height: 0;
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
}

.product-card .product-image img {
    display: block;
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: transform 0.4s ease;
    margin: 0 !important;
    padding: 0 !important;
    border: none;
    border-radius: 0;
}

.product-card:hover .product-image img {
    transform: scale(1.05);
}

/* Product card content area */
.product-card:has(.product-image) h4,
.product-card:has(.product-image) > h4 {
    padding: 1.25rem 1.5rem 0 1.5rem;
    margin: 0 0 0.75rem 0;
    font-size: var(--font-size-md);
}

.product-card:has(.product-image) p {
    padding: 0 1.5rem;
    margin: 0 0 1rem 0;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    text-align: left;
}

.product-card:has(.product-image) .feature-list {
    padding: 0 1.5rem;
    margin: 0 0 1rem 0;
    text-align: left;
}

.product-card:has(.product-image) .feature-list li {
    font-size: var(--font-size-sm);
    margin-bottom: 0.35rem;
    color: var(--text-secondary);
}

.product-card:has(.product-image) .btn {
    margin: auto 1.5rem 1.5rem 1.5rem;
    align-self: flex-start;
}

/* Remove pseudo-elements for cards with images */
.product-card:has(.product-image)::before,
.product-card:has(.product-image)::after {
    display: none !important;
}

/* Horizontal product card layout (full-width cards with image on side) */
.product-card .row {
    margin: 0;
}

.product-card .row .col-md-4 {
    padding: 0;
}

.product-card .row .col-md-4 img {
    height: 100%;
    min-height: 250px;
    width: 100%;
    object-fit: cover;
    border-radius: var(--border-radius-lg) 0 0 var(--border-radius-lg);
}

.product-card .row .col-md-8 {
    padding: 1.5rem;
    text-align: left;
}

.product-card .row .col-md-8 h4 {
    margin-bottom: 0.75rem;
}

.product-card .row .col-md-8 p {
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
    margin-bottom: 1rem;
}

.product-card .row .col-md-8 .feature-list {
    margin-bottom: 1rem;
}

.product-card .row .col-md-8 .feature-list li {
    font-size: var(--font-size-sm);
    margin-bottom: 0.35rem;
    color: var(--text-secondary);
}

@media (max-width: 767.98px) {
    .product-card .row .col-md-4 img {
        border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
        min-height: 200px;
    }
}

.product-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12), 0 0 0 1px var(--orange-200);
    border-color: var(--orange-200);
}

.product-icon {
    width: 80px;
    height: 80px;
    background: var(--orange-500);  /* Solid coral in normal state */
    color: white;
    border-radius: var(--border-radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-2xl);
    margin: 0 auto 1.5rem;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    box-shadow: var(--shadow-primary-sm);
    z-index: 1;
}

.product-icon::before {
    content: '';
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    background: linear-gradient(135deg, #FFA14D 0%, #E06A10 100%);
    border-radius: 16px;
    z-index: -1;
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.product-icon::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: var(--border-radius-lg);
    background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.3), transparent 50%);
    opacity: 0;
    transition: opacity 0.4s ease;
}

.product-card:hover .product-icon {
    transform: scale(1.15) rotate(8deg);
    box-shadow: 0 12px 24px rgba(255, 130, 37, 0.35);
    background: linear-gradient(135deg, #FF8225 0%, #FFA14D 100%);  /* Gradient on hover */
}

.product-card:hover .product-icon::before {
    opacity: 1;
    transform: rotate(-8deg);
}

.product-card:hover .product-icon::after {
    opacity: 1;
}

.product-card h4 {
    font-family: var(--font-heading);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-snug);
    letter-spacing: var(--letter-spacing-tight);
    color: var(--text-primary);
    margin-bottom: 1.25rem;
}

.product-card p {
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    color: var(--text-secondary);
    margin-bottom: 1.75rem;
}

/* Industry Cards */
.industry-card {
    background: white;
    border-radius: var(--border-radius-lg);
    padding: 0 !important;
    text-align: center;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    height: 100%;
    border: 1px solid var(--gray-200);
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.07);
    display: flex;
    flex-direction: column;
}

/* Industry card image - flush to top and sides */
.industry-card > .industry-image {
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    line-height: 0;
}

.industry-card > .industry-image img {
    display: block;
    width: 100%;
    height: 180px;
    object-fit: cover;
    transition: transform 0.4s ease;
    margin: 0 !important;
    padding: 0 !important;
}

.industry-card:hover .industry-image img {
    transform: scale(1.05);
}

/* Industry card content - padded */
.industry-card > h4,
.industry-card > p,
.industry-card > .btn {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.industry-card > h4 {
    margin-top: 1.25rem;
    margin-bottom: 0.75rem;
}

.industry-card > p {
    margin-bottom: 1rem;
    flex-grow: 1;
}

.industry-card > .btn {
    margin-bottom: 1.5rem;
    align-self: center;
}

/* Remove pseudo-elements for cards with images */
.industry-card:has(.industry-image)::before,
.industry-card:has(.industry-image)::after {
    display: none !important;
}

/* Industry card without image - keep original styling */
.industry-card:not(:has(.industry-image)) {
    padding: 2.5rem 2rem !important;
}

.industry-card:not(:has(.industry-image))::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, #FF8225 0%, #FFA14D 50%, #E06A10 100%);
    transform: translateY(100%);
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1;
}

.industry-card:not(:has(.industry-image))::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
    transform: translate(-50%, -50%);
    transition: width 0.6s ease, height 0.6s ease;
    z-index: 2;
    pointer-events: none;
}

.industry-card:not(:has(.industry-image)):hover::before {
    transform: translateY(0);
}

.industry-card:hover::after {
    width: 500px;
    height: 500px;
}

.industry-card:hover {
    color: white;
    transform: translateY(-12px);
    box-shadow: 0 20px 40px rgba(255, 130, 37, 0.25);
    border-color: var(--orange-400);
}

.industry-card > * {
    position: relative;
    z-index: 2;
}

.industry-icon {
    width: 80px;
    height: 80px;
    background: white;
    color: var(--orange-500);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-3xl);
    margin: 0 auto 1.75rem;
    transition: var(--transition);
    box-shadow: 0 6px 15px rgba(255, 130, 37, 0.2);
    border: 2px solid var(--orange-200);
    flex-shrink: 0;
}

/* Industry card header - inline icon with title (industries.html) */
.rs-industry-header {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

.rs-industry-header .industry-icon {
    width: 60px;
    height: 60px;
    margin: 0;
    margin-right: 1rem;
    font-size: var(--font-size-2xl);
    border-radius: 16px;
}

.rs-industry-header .rs-industry-title h4 {
    margin-bottom: 0.25rem;
}

.rs-industry-header .rs-industry-title .badge {
    font-size: var(--font-size-xs);
}

.industry-card:hover .industry-icon {
    background: white;
    color: var(--primary-dark);
    transform: scale(1.1) rotate(-5deg);
    box-shadow: 0 8px 20px rgba(255, 255, 255, 0.3);
}

.industry-card h4 {
    font-family: var(--font-heading);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-snug);
    letter-spacing: var(--letter-spacing-tight);
    color: var(--text-primary);
    margin-bottom: 1rem;
}

.industry-card h5 {
    font-family: var(--font-heading);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
    color: var(--text-primary);
    margin-bottom: 1rem;
}

.industry-card p {
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    color: var(--text-secondary);
    opacity: 0.9;
}

.industry-card:hover h5,
.industry-card:hover p {
    color: white !important;
}

.industry-card:hover h4 {
    color: white !important;
}

/* World Map Placeholder */
.world-map-placeholder {
    background: var(--gray-100);
    border-radius: var(--border-radius-lg);
    padding: 3rem;
    text-align: center;
    min-height: 400px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.05);
}

.world-map-placeholder::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(255, 130, 37, 0.05) 0%, transparent 50%);
}

.world-map-placeholder > * {
    position: relative;
    z-index: 2;
}

/* About Page - Image Box */
.about-image-box {
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    height: 100%;
    min-height: 350px;
}

.about-image-box img {
    width: 100%;
    height: 100%;
    min-height: 350px;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.about-image-box:hover img {
    transform: scale(1.03);
}

/* About Page - Info Box (styled placeholder without image) */
.about-info-box {
    background: var(--bg-primary);
    border: 2px solid var(--border-color-light);
    border-radius: var(--border-radius-lg);
    padding: 2.5rem 2rem;
    text-align: center;
    min-height: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
}

.about-info-box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--orange-500), var(--orange-300));
}

.about-info-box:hover {
    border-color: var(--orange-200);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    transform: translateY(-4px);
}

.about-info-box .info-box-icon {
    width: 80px;
    height: 80px;
    background: var(--orange-50);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.about-info-box h4 {
    margin-bottom: 0.5rem;
    color: var(--text-primary);
}

.about-info-box p {
    font-size: var(--font-size-sm);
}

/* CTA Section */
.cta-section {
    background: linear-gradient(135deg, #B85410 0%, #FF8225 35%, #FFA14D 75%, #E06A10 100%);
    color: white;
    position: relative;
    overflow: hidden;
}

.cta-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 25% 25%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.05) 0%, transparent 50%),
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="rgba(255,255,255,0.08)"/><circle cx="75" cy="75" r="1" fill="rgba(255,255,255,0.08)"/><circle cx="50" cy="10" r="0.5" fill="rgba(255,255,255,0.06)"/><circle cx="10" cy="60" r="0.8" fill="rgba(255,255,255,0.07)"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');
    opacity: 0.6;
    z-index: 1;
}

.cta-section::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 0%, transparent 100%);
    z-index: 2;
}

.cta-section .container {
    position: relative;
    z-index: 3;
}

.cta-section h2 {
    font-weight: var(--font-weight-extrabold);
    margin-bottom: 1.5rem;
    color: white;
}

.cta-section .lead {
    opacity: 0.95;
    color: white;
}

/* Footer */
.footer-section {
    background: linear-gradient(180deg, #1A202C 0%, #2D3748 100%);
    color: var(--text-white);
    padding: 4rem 0 1.5rem;
    position: relative;
}

.footer-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #FF8225 0%, #FFA14D 50%, #FFD9B3 100%);
}

.footer-brand {
    font-family: var(--font-heading);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-tight);
    color: white !important;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

.footer-brand i {
    color: var(--primary-color);
    margin-right: 0.5rem;
    font-size: var(--font-size-2xl);
}

.footer-links h5 {
    font-family: var(--font-heading);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
    color: white;
    margin-bottom: 1rem;
}

.footer-links ul {
    list-style: none;
    padding: 0;
}

.footer-links ul li {
    margin-bottom: 0.5rem;
}

.footer-links ul li a {
    color: rgba(255, 255, 255, 0.8);
    transition: all 0.3s ease;
    text-decoration: none;
}

.footer-links ul li a:hover {
    color: var(--primary-color);
    transform: translateX(3px);
}

.social-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    margin-right: 0.5rem;
    transition: all 0.3s ease;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.social-icons a:hover {
    background: var(--primary-color);
    color: white;
    transform: translateY(-2px);
    border-color: var(--primary-color);
}

.footer-bottom {
    margin-top: 3rem;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-bottom .row {
    align-items: center;
}

.footer-bottom p {
    color: rgba(255, 255, 255, 0.8) !important;
    margin-bottom: 0;
}

/* Footer text overrides for better visibility */
.footer-section .text-muted {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* Breadcrumb styling */
.breadcrumb {
    background: transparent;
    margin: 0;
    padding: 0;
}

/* Breadcrumb on light backgrounds (product pages) */
.bg-light .breadcrumb-item {
    color: var(--text-secondary) !important;
    font-size: var(--font-size-sm);
}

.bg-light .breadcrumb-item a {
    color: var(--rs-primary) !important;
    text-decoration: none;
}

.bg-light .breadcrumb-item a:hover {
    color: var(--rs-orange-600) !important;
}

.bg-light .breadcrumb-item.active {
    color: var(--text-secondary) !important;
}

.bg-light .breadcrumb-item + .breadcrumb-item::before {
    color: var(--text-secondary) !important;
    content: ">";
}

/* ========================================
   STANDARDIZED BODY CONTENT STYLES
   ======================================== */

/* Hero Section Standardization */
.hero-section {
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
}

.hero-section .container {
    position: relative;
    z-index: 3;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, rgba(255, 130, 37, 0.05), rgba(255, 160, 80, 0.03));
    z-index: 1;
}

.hero-particles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

.hero-title {
    font-size: var(--font-size-5xl);
    font-weight: var(--font-weight-extrabold);
    color: white;
    margin-bottom: 1.5rem;
    line-height: var(--line-height-tight);
}

.hero-subtitle {
    font-size: var(--font-size-lg);
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 2.5rem;
    line-height: var(--line-height-relaxed);
}

.hero-buttons {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

/* RefractorySource Page Header Standardization */
.rs-page-header {
    min-height: 30vh;
    display: flex;
    align-items: center;
    position: relative;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding: 5rem 0 3rem;
    margin-top: 76px;
    overflow: hidden;
}

.rs-page-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 25% 25%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
    z-index: 1;
    pointer-events: none;
}

.rs-page-header .container {
    position: relative;
    z-index: 2;
}

.rs-page-header h1 {
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-extrabold);
    color: white;
    margin-bottom: 1rem;
}

.rs-page-header .lead {
    font-size: var(--font-size-lg);
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 0;
    line-height: var(--line-height-relaxed);
}

/* RefractorySource Product Page Header (Light Background Version) */
.rs-product-header {
    margin-top: 76px;
    padding-top: 3rem;
    padding-bottom: 3rem;
    background-color: var(--bg-secondary);
}

/* RefractorySource Breadcrumb Styling */
.rs-page-header .breadcrumb {
    background: none;
    padding: 0;
    margin-bottom: 1.5rem;
}

.rs-page-header .breadcrumb-item {
    color: rgba(255, 255, 255, 0.8);
    font-size: var(--font-size-sm);
}

.rs-page-header .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    transition: color 0.2s ease;
}

.rs-page-header .breadcrumb-item a:hover {
    color: white;
}

.rs-page-header .breadcrumb-item.active {
    color: white;
}

.rs-page-header .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.6);
    content: ">";
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .rs-page-header {
        min-height: 25vh;
        padding: 4rem 0 2rem;
    }

    .rs-page-header h1 {
        font-size: var(--font-size-3xl);
    }

    .rs-page-header .lead {
        font-size: var(--font-size-md);
    }
}

/* Section Headers Standardization */
.section-header {
    text-align: center;
    margin-bottom: 4rem;
    animation: fadeInUp 0.8s ease-out;
}

.section-header .badge {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--letter-spacing-widest);
    text-transform: uppercase;
    padding: 0.5rem 1.25rem;
    border-radius: var(--border-radius-full);
    margin-bottom: 1.25rem;
    display: inline-block;
}

.section-header h2 {
    font-family: var(--font-heading);
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-tight);
    letter-spacing: var(--letter-spacing-tight);
    color: var(--text-primary);
    margin-bottom: 1.25rem;
}

.section-header .lead {
    font-family: var(--font-body);
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-relaxed);
    color: var(--text-secondary);
    max-width: 700px;
    margin: 0 auto;
}

/* Card Systems Standardization */
.product-card, .industry-card, .feature-card {
    background: white;
    border-radius: var(--border-radius-lg);
    padding: 2rem;
    text-align: left;
    height: 100%;
    transition: var(--transition);
    border: 1px solid var(--border-color-light);
    box-shadow: var(--shadow-sm);
}

.product-card:hover, .industry-card:hover, .feature-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
    border-color: var(--primary-color);
}

.product-icon, .industry-icon, .feature-icon {
    width: 80px;
    height: 80px;
    border-radius: var(--border-radius-lg);
    background: var(--primary-color);  /* Solid coral in normal state */
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: white;
    font-size: var(--font-size-2xl);
    transition: all 0.3s ease;
}

.product-card h4, .industry-card h4, .feature-card h4 {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
    margin-bottom: 1rem;
}

.product-card h5, .industry-card h5, .feature-card h5 {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
    margin-bottom: 0.75rem;
}

.product-card p, .industry-card p, .feature-card p {
    color: var(--text-secondary);
    line-height: var(--line-height-relaxed);
    margin-bottom: 1.5rem;
}

/* Feature Card Icon Hover - Gradient effect */
.feature-card:hover .feature-icon {
    background: linear-gradient(135deg, #FF8225 0%, #FFA14D 100%);
    transform: scale(1.1);
}

/* Industry Card Hover Effects - Full card changes */
.industry-card:hover {
    background: var(--primary-color);
    color: white;
}

.industry-card:hover h4,
.industry-card:hover h5 {
    color: white !important;
}

.industry-card:hover p {
    color: rgba(255, 255, 255, 0.9) !important;
}

.industry-card:hover .industry-icon {
    background: rgba(255, 255, 255, 0.2);  /* White overlay when card is coral */
    transform: scale(1.1);
}

/* Card Header with bg-primary - Ensure white text and icons */
.card-header.bg-primary {
    background: linear-gradient(135deg, var(--primary-color), var(--orange-600)) !important;
}

.card-header.bg-primary,
.card-header.bg-primary h5,
.card-header.bg-primary h6,
.card-header.bg-primary .fa,
.card-header.bg-primary .fas,
.card-header.bg-primary .far,
.card-header.bg-primary .fab,
.card-header.bg-primary i {
    color: white !important;
}

/* Content Sections Standardization */
.content-section {
    padding: 5rem 0;
}

.content-section.bg-light {
    background: var(--bg-secondary);
}

.content-section.bg-dark {
    background: var(--bg-dark);
    color: white;
}

.content-section.bg-dark h1,
.content-section.bg-dark h2,
.content-section.bg-dark h3,
.content-section.bg-dark h4,
.content-section.bg-dark h5,
.content-section.bg-dark h6 {
    color: white;
}

.content-section.bg-dark .lead,
.content-section.bg-dark p {
    color: rgba(255, 255, 255, 0.8);
}

/* Stats Section Standardization */
.stats-section {
    padding: 4rem 0;
    background: var(--primary-color);
    color: white;
}

.stat-item {
    text-align: center;
}

.stat-number {
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-extrabold);
    color: white;
    display: block;
    line-height: var(--line-height-none);
}

.stat-label {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-medium);
    color: rgba(255, 255, 255, 0.9);
    margin-top: 0.5rem;
}

/* RefractorySource CTA Section */
.rs-section-cta {
    background: linear-gradient(135deg, #B85410 0%, #FF8225 35%, #FFA14D 75%, #E06A10 100%);
    color: white;
    text-align: center;
    padding: 4rem 0;
    position: relative;
    overflow: hidden;
}

.rs-section-cta::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 25% 25%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
    opacity: 0.6;
    z-index: 1;
    pointer-events: none;
}

.rs-section-cta .container {
    position: relative;
    z-index: 2;
}

.rs-section-cta h2 {
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-bold);
    color: white;
    margin-bottom: 1rem;
}

.rs-section-cta .lead,
.rs-section-cta p.lead {
    font-size: var(--font-size-md);
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 1.5rem;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    line-height: var(--line-height-relaxed);
}

.rs-section-cta .d-flex {
    gap: 1rem;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

/* List Styling Standardization */
.feature-list {
    list-style: none;
    padding: 0;
}

.feature-list li {
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border-color-light);
    display: flex;
    align-items: center;
}

.feature-list li:last-child {
    border-bottom: none;
}

.feature-list li i {
    color: var(--primary-color);
    width: 20px;
    margin-right: 1rem;
    flex-shrink: 0;
}

/* Timeline Standardization */
.timeline-item {
    position: relative;
    padding-left: 3rem;
    margin-bottom: 2rem;
}

.timeline-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--primary-color);
    border: 3px solid white;
    box-shadow: 0 0 0 3px var(--primary-color);
}

.timeline-item::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 20px;
    width: 2px;
    height: calc(100% + 1rem);
    background: var(--border-color);
}

.timeline-item:last-child::after {
    display: none;
}

/* FAQ Accordion Styling */
.accordion-item {
    border: 1px solid var(--border-color-light);
    border-radius: var(--border-radius-sm);
    margin-bottom: 1rem;
    box-shadow: var(--shadow-sm);
}

.accordion-item:last-child {
    margin-bottom: 0;
}

.accordion-header {
    margin-bottom: 0;
}

.accordion-button {
    background-color: white;
    color: var(--text-primary);
    border: none;
    padding: 1.25rem 1.5rem;
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-md);
    border-radius: var(--border-radius-sm);
    transition: var(--transition);
}

.accordion-button:not(.collapsed) {
    background-color: var(--primary-color);
    color: white;
    box-shadow: none;
}

.accordion-button:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.25rem rgba(255, 130, 37, 0.25);
}

.accordion-button:hover {
    background-color: var(--primary-light);
    color: var(--text-primary);
}

.accordion-button:not(.collapsed):hover {
    background-color: var(--primary-dark);
    color: white;
}

.accordion-button::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transform: rotate(180deg);
}

.accordion-body {
    padding: 1.5rem;
    background-color: white;
    color: var(--text-secondary);
    line-height: var(--line-height-relaxed);
    border-top: 1px solid var(--border-color-light);
}

.accordion-collapse {
    border: none;
}

/* Responsive Typography */
@media (max-width: 768px) {
    h1 {
        font-size: var(--font-size-4xl);      /* 48px -> 3rem on mobile */
        line-height: var(--line-height-tight);
    }

    h2 {
        font-size: var(--font-size-3xl);      /* 36px -> 2.25rem on mobile */
    }

    h3 {
        font-size: var(--font-size-2xl);      /* 30px -> 1.875rem on mobile */
    }

    h4 {
        font-size: var(--font-size-xl);       /* 24px -> 1.5rem on mobile */
    }

    h5 {
        font-size: var(--font-size-lg);       /* 20px -> 1.25rem on mobile */
    }

    h6 {
        font-size: var(--font-size-base);     /* 16px -> 1rem on mobile */
    }

    .hero-title {
        font-size: var(--font-size-3xl);
        line-height: var(--line-height-snug);
    }

    .page-header h1,
    .rs-page-header h1 {
        font-size: var(--font-size-3xl);
    }

    .section-header h2 {
        font-size: var(--font-size-3xl);
    }

    .hero-subtitle,
    .section-header .lead,
    .cta-section .lead,
    p.lead,
    .lead {
        font-size: var(--font-size-base);
        line-height: var(--line-height-relaxed);
    }

    .section-padding {
        padding: 3rem 0;
    }

    .content-section {
        padding: 3rem 0;
    }

    .accordion-button {
        padding: 1rem 1.25rem;
        font-size: var(--font-size-base);
    }

    .accordion-body {
        padding: 1.25rem;
    }

    /* Mobile card spacing */
    .product-card,
    .industry-card {
        padding: 2rem 1.5rem;
        margin-bottom: 1.5rem;
    }

    .product-icon,
    .industry-icon {
        width: 70px;
        height: 70px;
        font-size: var(--font-size-2xl);
    }

    /* Mobile navbar */
    .navbar {
        padding: 0.75rem 0;
    }

    .navbar-scrolled {
        padding: 0.5rem 0;
    }

    /* Mobile buttons */
    .btn {
        padding: 0.75rem 1.5rem;
        font-size: var(--font-size-sm);
    }

    .hero-buttons .btn-hero-primary,
    .hero-buttons .btn-hero-outline {
        padding: 0.875rem 2rem;
        font-size: var(--font-size-base);
    }
}

.footer-legal-links {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.footer-legal-links a {
    color: rgba(255, 255, 255, 0.7);
    padding: 0 0.75rem;
    font-size: var(--font-size-sm);
    text-decoration: none;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
    transition: color 0.3s ease;
}

.footer-legal-links a:last-child {
    border-right: none;
    padding-right: 0;
}

.footer-legal-links a:first-child {
    padding-left: 0;
}

.footer-legal-links a:hover {
    color: var(--primary-color);
}

/* Responsive footer bottom */
@media (max-width: 767px) {
    .footer-bottom {
        text-align: center !important;
    }

    .footer-bottom .col-md-6 {
        margin-bottom: 1rem;
    }

    .footer-bottom .col-md-6:last-child {
        margin-bottom: 0;
    }

    .footer-legal-links {
        justify-content: center;
    }
}

/* Buttons - Consistent Modern Design */
.btn {
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
    padding: 0.875rem 2rem;
    border-radius: 8px !important;
    border: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.btn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

.btn:hover::before {
    width: 300px;
    height: 300px;
}

/* Override any Bootstrap rounded classes for buttons */
.btn.rounded-pill,
.btn.rounded,
.btn.rounded-lg {
    border-radius: 8px !important;
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.btn:active {
    transform: translateY(0);
    box-shadow: var(--shadow-sm);
}

.btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255, 130, 37, 0.25);
}


.btn-primary {
    background: linear-gradient(135deg, var(--primary-color), var(--orange-600)) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-on-primary);
    box-shadow: var(--shadow-primary-sm);
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--orange-600), var(--orange-700)) !important;
    border-color: var(--orange-600) !important;
    box-shadow: var(--shadow-primary-md);
    color: var(--text-on-primary);
}

.btn-primary:active,
.btn-primary:focus {
    background: var(--orange-700) !important;
    border-color: var(--orange-700) !important;
}

.btn-outline-primary {
    color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    background: var(--orange-50) !important;
    border-width: var(--border-width-thick);
}

.btn-outline-primary:hover {
    background: linear-gradient(135deg, var(--primary-color), var(--orange-600)) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-on-primary) !important;
    box-shadow: var(--shadow-primary-sm);
}

.btn-outline-primary:active,
.btn-outline-primary:focus {
    background: var(--orange-700) !important;
    border-color: var(--orange-700) !important;
    color: var(--text-on-primary) !important;
}

.btn-outline-light {
    border-color: white;
    color: white;
    background: transparent;
    border-width: 2px;
}

.btn-outline-light:hover {
    background: var(--light-color);
    border-color: var(--light-color);
    color: var(--dark-color);
}

.btn-light {
    background: var(--bg-primary);
    border: 2px solid var(--border-color);
    color: var(--text-primary);
    font-weight: var(--font-weight-semibold);
}

.btn-light:hover {
    background: var(--bg-subtle);
    border-color: var(--primary-color);
    color: var(--primary-color);
}

/* Custom Hero & CTA Button Styles */
.btn-hero-primary {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
    background: white;
    border: 2px solid white;
    color: var(--primary-color);
    border-radius: 8px;
    padding: 1rem 2.5rem;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 16px rgba(255, 255, 255, 0.2);
}

.btn-hero-primary:hover {
    background: var(--orange-50);
    border-color: var(--orange-50);
    color: var(--orange-700);
    text-decoration: none;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(255, 255, 255, 0.3);
}

.btn-hero-primary:active {
    transform: translateY(-1px);
}

.btn-hero-outline {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.3);
    color: white;
    border-radius: 8px;
    padding: 1rem 2.5rem;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-hero-outline:hover {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.5);
    color: white;
    text-decoration: none;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.btn-hero-outline:active {
    transform: translateY(-1px);
}

/* RefractorySource Custom Buttons */
.rs-btn-primary {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
    background: white;
    border: 2px solid white;
    color: var(--primary-color);
    border-radius: 8px;
    padding: 1rem 2.5rem;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(255, 255, 255, 0.2);
}

.rs-btn-primary:hover {
    background: var(--orange-50);
    border-color: var(--orange-50);
    color: var(--orange-700);
    text-decoration: none;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(255, 255, 255, 0.3);
}

.rs-btn-primary:active {
    transform: translateY(-1px);
}

.rs-btn-outline {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-bold);
    line-height: var(--line-height-normal);
    letter-spacing: var(--letter-spacing-normal);
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 2px solid rgba(255, 255, 255, 0.3);
    color: white;
    border-radius: 8px;
    padding: 1rem 2.5rem;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

.rs-btn-outline:hover {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.5);
    color: white;
    text-decoration: none;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.rs-btn-outline:active {
    transform: translateY(-1px);
}

/* Badges */
.badge {
    font-weight: var(--font-weight-semibold);
    padding: 0.5rem 1.25rem;
    font-size: var(--font-size-xs);
    letter-spacing: 0.5px;
    border-radius: 50px;
    text-transform: uppercase;
    transition: var(--transition);
}

.badge.bg-primary {
    background: linear-gradient(135deg, #FF8225 0%, #FFA14D 100%) !important;
    box-shadow: var(--shadow-primary-sm);
    color: white;
}

.badge.bg-primary:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-primary-md);
}

/* Step Number Badge - For process/workflow steps */
.badge-step-number {
    font-size: var(--font-size-2xl);
    width: 3rem;
    height: 3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    padding: 0;
}

/* Section Label Badge - For section headers */
.badge-section-label {
    font-size: var(--font-size-xs);
    letter-spacing: 1px;
}

/* Large Icon Text - For icons with inline font-size */
.text-icon-lg {
    font-size: var(--font-size-4xl);
}

.text-icon-md {
    font-size: var(--font-size-3xl);
}

.text-icon-sm {
    font-size: var(--font-size-2xl);
}

/* Responsive Design */
@media (max-width: 991.98px) {
    .section-padding {
        padding: 3rem 0;
    }

    .hero-title {
        font-size: var(--font-size-4xl);
    }

    .hero-subtitle {
        font-size: var(--font-size-md);
    }
}

@media (max-width: 767.98px) {
    .hero-section {
        min-height: 100vh;
        padding: 6rem 0 4rem;
        background-attachment: scroll !important; /* iOS Safari fix */
        -webkit-background-size: cover;
        background-size: cover;
    }

    /* Fix for iOS Safari - single clean overlay for text readability */
    .hero-section.hero-with-image::before {
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.5) 100%) !important;
    }

    .hero-section::before {
        display: none !important;
    }

    .hero-section::after {
        display: none !important;
    }

    .hero-overlay {
        display: none !important;
    }

    /* Page header mobile fix */
    .rs-page-header {
        background-attachment: scroll !important;
        -webkit-background-size: cover;
    }

    .rs-page-header::before {
        background: linear-gradient(135deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.45)) !important;
    }

    .hero-title {
        font-size: var(--font-size-3xl);
        line-height: var(--line-height-snug);
        margin-bottom: 1.25rem;
    }

    .hero-subtitle {
        font-size: var(--font-size-base);
        line-height: var(--line-height-relaxed);
        margin-bottom: 2rem;
    }

    .hero-buttons {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        align-items: center;
    }

    .hero-buttons .btn,
    .hero-buttons .btn-hero-primary,
    .hero-buttons .btn-hero-outline {
        width: 100%;
        max-width: 320px;
        margin: 0;
        text-align: center;
    }

    .product-card,
    .industry-card {
        margin-bottom: 1.5rem;
    }

    /* Mobile content section padding */
    .content-section {
        padding: 3rem 0;
    }

    /* Mobile CTA section */
    .rs-section-cta {
        padding: 3rem 0;
    }

    .rs-section-cta h2 {
        font-size: var(--font-size-2xl);
    }

    .rs-section-cta .lead {
        font-size: var(--font-size-base);
    }

    /* Mobile section header */
    .section-header {
        margin-bottom: 2.5rem;
    }

    /* Mobile footer adjustments */
    .footer-section {
        padding: 2.5rem 0 1rem;
    }

    .footer-links h5 {
        margin-top: 1.5rem;
        font-size: var(--font-size-base);
    }

    /* Mobile world map */
    .world-map-placeholder {
        min-height: 300px;
        padding: 2rem;
    }

    /* Mobile back to top button */
    #back-to-top {
        width: 45px;
        height: 45px;
        bottom: 20px;
        right: 20px;
    }

    #back-to-top i {
        font-size: var(--font-size-md);
    }
}

/* Animation Keyframes */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Loading States */
.loading {
    opacity: 0.7;
    pointer-events: none;
}

.spinner {
    border: 3px solid rgba(211, 47, 47, 0.1);
    border-top: 3px solid var(--orange-500);
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 1s linear infinite;
    margin: 0 auto;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* Breadcrumb base styles moved to line 1528 */

/* Form Styles */
.form-control {
    border-radius: var(--border-radius);
    border: 2px solid var(--gray-300);
    padding: 0.875rem 1.125rem;
    transition: var(--transition);
    background-color: var(--bg-primary);
    font-size: var(--font-size-base);
    line-height: var(--line-height-normal);
}

.form-control:hover {
    border-color: var(--gray-400);
}

.form-control:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(255, 130, 37, 0.15);
    background-color: var(--bg-primary);
    outline: none;
}

.form-control::placeholder {
    color: var(--text-light);
    opacity: 0.7;
}

.form-label {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    line-height: var(--line-height-normal);
    color: var(--text-primary);
    margin-bottom: 0.5rem;
}

.form-select {
    border-radius: var(--border-radius);
    border: 2px solid var(--gray-300);
    padding: 0.875rem 1.125rem;
    transition: var(--transition);
    background-color: var(--bg-primary);
}

.form-select:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(255, 130, 37, 0.15);
    outline: none;
}

textarea.form-control {
    min-height: 120px;
    resize: vertical;
}

/* Back to Top Button - Square with Rounded Corners */
#back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    border-radius: var(--border-radius-lg) !important; /* Override Bootstrap */
    background: linear-gradient(135deg, #FF8225 0%, #FFA14D 100%) !important;
    color: white !important;
    border: none !important;
    display: none;
    z-index: 1000;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    box-shadow: var(--shadow-primary-md);
    align-items: center;
    justify-content: center;
    padding: 0 !important;
}

#back-to-top:hover {
    background: linear-gradient(135deg, #E06A10 0%, #FF8225 100%) !important;
    transform: translateY(-5px);
    box-shadow: var(--shadow-primary-lg);
    border-radius: var(--border-radius-lg) !important;
}

#back-to-top:active {
    transform: translateY(-2px);
    box-shadow: var(--shadow-primary-md);
}

#back-to-top i {
    font-size: var(--font-size-lg);
}

/* Bootstrap Override - Force navbar brand icon to stay orange */
.navbar-brand .fas.fa-fire,
.navbar-brand .fa-fire,
.navbar-brand i.fa-fire,
.navbar .navbar-brand .fas,
.navbar .navbar-brand i,
body .navbar-brand i {
    color: var(--orange-500) !important;
}

/* Ensure icon color persists on all states */
.navbar-brand:link i,
.navbar-brand:visited i,
.navbar-brand:active i,
.navbar-brand:focus i {
    color: var(--orange-500) !important;
}

/* ========================================
   TABLE STYLES - Professional & Beautiful
   ColorHunt Palette: #FF8225, #EFEEEA, #273F4F, #000000
   ======================================== */

/* Table Container */
.table-responsive {
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    margin-bottom: 2rem;
}

/* Base Table Styles */
.table {
    margin-bottom: 0;
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
    background-color: white;
}

.table thead {
    background: linear-gradient(135deg, var(--orange-500) 0%, var(--orange-600) 100%);
    color: white;
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    font-size: var(--font-size-xs);
    letter-spacing: 0.5px;
}

.table thead th {
    border: none;
    border-right: 1px solid rgba(255, 255, 255, 0.15);
    padding: 1rem 1.25rem;
    vertical-align: middle;
    font-weight: var(--font-weight-semibold);
    white-space: nowrap;
}

.table thead th:last-child {
    border-right: none;
}

.table tbody {
    background-color: white;
}

.table tbody tr {
    transition: all 0.2s ease;
    border-bottom: 1px solid var(--neutral-200);
}

.table tbody tr:last-child {
    border-bottom: none;
}

.table tbody tr:nth-child(even) {
    background-color: var(--neutral-100);
}

.table tbody tr:hover {
    background-color: var(--bg-accent);
    transform: scale(1.01);
    box-shadow: 0 2px 8px rgba(255, 130, 37, 0.1);
}

.table tbody td {
    padding: 1rem 1.25rem;
    vertical-align: middle;
    border-color: var(--neutral-200);
    color: var(--text-secondary);
}

.table tbody td:first-child {
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
}

.table tbody td strong {
    color: var(--text-primary);
    font-weight: var(--font-weight-semibold);
}

/* Bordered Table Variant */
.table-bordered {
    border: 1px solid var(--neutral-200);
}

.table-bordered thead th {
    border-color: rgba(255, 255, 255, 0.2);
}

.table-bordered tbody td {
    border-color: var(--neutral-200);
}

/* Striped Table Variant */
.table-striped tbody tr:nth-of-type(odd) {
    background-color: white;
}

.table-striped tbody tr:nth-of-type(even) {
    background-color: var(--neutral-100);
}

/* Hover Effect Enhancement */
.table-hover tbody tr:hover {
    background-color: var(--bg-accent);
    cursor: pointer;
}

/* Small Table Variant */
.table-sm thead th,
.table-sm tbody td {
    padding: 0.75rem 1rem;
    font-size: var(--font-size-sm);
}

/* Responsive Table Scrollbar */
.table-responsive::-webkit-scrollbar {
    height: 8px;
}

.table-responsive::-webkit-scrollbar-track {
    background: var(--neutral-200);
    border-radius: var(--border-radius);
}

.table-responsive::-webkit-scrollbar-thumb {
    background: var(--orange-400);
    border-radius: var(--border-radius);
}

.table-responsive::-webkit-scrollbar-thumb:hover {
    background: var(--orange-500);
}

/* Table Caption */
.table caption {
    padding: 1rem 1.25rem;
    color: var(--text-tertiary);
    font-size: var(--font-size-sm);
    text-align: left;
    caption-side: bottom;
    background-color: var(--neutral-100);
    border-top: 1px solid var(--neutral-200);
}

/* Dark Theme Table (for dark backgrounds) */
.table-dark {
    background-color: var(--blue-gray-700);
    color: white;
}

.table-dark thead {
    background: linear-gradient(135deg, var(--blue-gray-800) 0%, var(--blue-gray-900) 100%);
}

.table-dark tbody tr {
    border-bottom-color: var(--blue-gray-600);
}

.table-dark tbody tr:nth-child(even) {
    background-color: var(--blue-gray-800);
}

.table-dark tbody tr:hover {
    background-color: var(--blue-gray-600);
}

/* Mobile Responsive Adjustments */
@media (max-width: 768px) {
    .table {
        font-size: var(--font-size-xs);
    }

    .table thead th,
    .table tbody td {
        padding: 0.75rem 0.5rem;
    }

    .table thead th {
        font-size: var(--font-size-xs);
    }
}

/* ========================================
   RESPONSIVE TYPOGRAPHY
   Fluid scaling for all screen sizes
   Breakpoints: 576px (sm), 768px (md), 992px (lg), 1200px (xl)
   ======================================== */

/* Desktop Large (1200px+) - Default values already set */

/* Desktop Medium (992px - 1199px) */
@media (max-width: 1199.98px) {
    :root {
        --font-size-5xl: 3rem;          /* 48px */
        --font-size-6xl: 3.5rem;        /* 56px */
        --font-size-7xl: 4rem;          /* 64px */
    }

    .display-1 { font-size: var(--font-size-7xl); }
    .display-2 { font-size: var(--font-size-6xl); }
    .display-3 { font-size: var(--font-size-5xl); }
}

/* Tablet (768px - 991px) */
@media (max-width: 991.98px) {
    :root {
        --font-size-4xl: 2.5rem;        /* 40px */
        --font-size-5xl: 2.75rem;       /* 44px */
        --font-size-6xl: 3rem;          /* 48px */
        --font-size-7xl: 3.5rem;        /* 56px */
    }

    h1 { font-size: var(--font-size-5xl); }
    h2 { font-size: var(--font-size-4xl); }
    h3 { font-size: var(--font-size-3xl); }
    h4 { font-size: var(--font-size-xl); }
    h5 { font-size: var(--font-size-lg); }
    h6 { font-size: var(--font-size-md); }

    .display-1 { font-size: var(--font-size-6xl); }
    .display-2 { font-size: var(--font-size-5xl); }
    .display-3 { font-size: var(--font-size-4xl); }
    .display-4 { font-size: var(--font-size-3xl); }

    .section-heading { font-size: var(--font-size-3xl); }

    .lead { font-size: var(--font-size-base); }
    .lead-lg { font-size: var(--font-size-md); }
}

/* Mobile Large (576px - 767px) */
@media (max-width: 767.98px) {
    :root {
        --font-size-3xl: 1.75rem;       /* 28px */
        --font-size-4xl: 2rem;          /* 32px */
        --font-size-5xl: 2.25rem;       /* 36px */
        --font-size-6xl: 2.5rem;        /* 40px */
        --font-size-7xl: 3rem;          /* 48px */
        --paragraph-spacing: 1.25rem;
    }

    body {
        font-size: var(--font-size-sm);  /* 14px - slightly smaller for mobile */
    }

    h1 {
        font-size: var(--font-size-4xl);
        line-height: var(--line-height-snug);
    }
    h2 {
        font-size: var(--font-size-3xl);
        line-height: var(--line-height-snug);
    }
    h3 { font-size: var(--font-size-2xl); }
    h4 { font-size: var(--font-size-xl); }
    h5 { font-size: var(--font-size-lg); }
    h6 { font-size: var(--font-size-md); }

    .display-1 { font-size: var(--font-size-5xl); }
    .display-2 { font-size: var(--font-size-4xl); }
    .display-3 { font-size: var(--font-size-3xl); }
    .display-4 { font-size: var(--font-size-2xl); }

    .section-heading { font-size: var(--font-size-2xl); }
    .section-subheading { font-size: var(--font-size-base); }

    .card-title-lg { font-size: var(--font-size-xl); }
    .card-title { font-size: var(--font-size-lg); }
    .card-title-sm { font-size: var(--font-size-md); }

    p { max-width: 100%; }
    .lead { max-width: 100%; }
}

/* Mobile Small (< 576px) */
@media (max-width: 575.98px) {
    :root {
        --font-size-2xl: 1.5rem;        /* 24px */
        --font-size-3xl: 1.625rem;      /* 26px */
        --font-size-4xl: 1.75rem;       /* 28px */
        --font-size-5xl: 2rem;          /* 32px */
        --font-size-6xl: 2.25rem;       /* 36px */
        --font-size-7xl: 2.5rem;        /* 40px */
        --paragraph-spacing: 1rem;
    }

    body {
        font-size: var(--font-size-sm);  /* 14px */
        line-height: var(--line-height-relaxed);
    }

    h1 {
        font-size: var(--font-size-3xl);
        margin-bottom: 0.75rem;
    }
    h2 {
        font-size: var(--font-size-2xl);
        margin-bottom: 0.625rem;
    }
    h3 { font-size: var(--font-size-xl); }
    h4 { font-size: var(--font-size-lg); }
    h5 { font-size: var(--font-size-md); }
    h6 { font-size: var(--font-size-base); }

    .display-1 { font-size: var(--font-size-4xl); }
    .display-2 { font-size: var(--font-size-3xl); }
    .display-3 { font-size: var(--font-size-2xl); }
    .display-4 { font-size: var(--font-size-xl); }

    .section-heading { font-size: var(--font-size-xl); }
    .section-subheading { font-size: var(--font-size-sm); }

    .card-title-lg { font-size: var(--font-size-lg); }
    .card-title { font-size: var(--font-size-md); }
    .card-title-sm { font-size: var(--font-size-base); }

    .overline,
    .eyebrow {
        font-size: var(--font-size-2xs);
    }

    .label { font-size: var(--font-size-xs); }
    .label-sm { font-size: var(--font-size-2xs); }

    /* Small mobile buttons */
    .btn {
        padding: 0.75rem 1.5rem;
        font-size: var(--font-size-sm);
    }

    .btn-lg {
        padding: 0.875rem 1.75rem;
        font-size: var(--font-size-base);
    }

    /* Small mobile CTA buttons */
    .rs-btn-primary,
    .rs-btn-outline {
        padding: 0.75rem 1.5rem;
        font-size: var(--font-size-sm);
    }

    /* Small mobile page header */
    .rs-page-header {
        padding: 3rem 0 2rem;
    }

    /* Small mobile content section */
    .content-section {
        padding: 2.5rem 0;
    }

    /* Small mobile CTA section */
    .rs-section-cta {
        padding: 2.5rem 0;
    }
}

/* ========================================
   COOKIE NOTICE BANNER
   Simple informational banner (Option B)
   ======================================== */
.rs-cookie-notice {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--teal-700);
    color: white;
    padding: 1rem 1.5rem;
    z-index: 9999;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    transform: translateY(100%);
    transition: transform 0.4s ease-out;
}

.rs-cookie-notice.show {
    transform: translateY(0);
}

.rs-cookie-notice .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.rs-cookie-notice-content {
    flex: 1;
    min-width: 280px;
}

.rs-cookie-notice-content p {
    margin: 0;
    font-size: var(--font-size-sm);
    line-height: var(--line-height-relaxed);
    color: rgba(255, 255, 255, 0.9);
}

.rs-cookie-notice-content a {
    color: var(--orange-300);
    text-decoration: underline;
}

.rs-cookie-notice-content a:hover {
    color: var(--orange-200);
}

.rs-cookie-notice-actions {
    display: flex;
    gap: 0.75rem;
    flex-shrink: 0;
}

.rs-cookie-btn {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    padding: 0.625rem 1.5rem;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.rs-cookie-btn-accept {
    background: var(--orange-500);
    color: white;
}

.rs-cookie-btn-accept:hover {
    background: var(--orange-600);
    transform: translateY(-1px);
}

@media (max-width: 575.98px) {
    .rs-cookie-notice {
        padding: 1rem;
    }

    .rs-cookie-notice .container {
        flex-direction: column;
        text-align: center;
    }

    .rs-cookie-notice-content {
        min-width: 100%;
    }

    .rs-cookie-notice-actions {
        width: 100%;
        justify-content: center;
    }

    .rs-cookie-btn {
        flex: 1;
        max-width: 200px;
    }
}

/* ========================================
   PRINT TYPOGRAPHY
   Optimized for printed output
   ======================================== */
@media print {
    body {
        font-size: 12pt;
        line-height: 1.5;
        color: #000;
        background: #fff;
    }

    h1 { font-size: 24pt; }
    h2 { font-size: 20pt; }
    h3 { font-size: 16pt; }
    h4 { font-size: 14pt; }
    h5, h6 { font-size: 12pt; }

    p {
        orphans: 3;
        widows: 3;
        max-width: none;
    }

    h1, h2, h3, h4, h5, h6 {
        page-break-after: avoid;
        page-break-inside: avoid;
    }
}