:root {
    --clr-primary-dark: #222222;
    --clr-primary-white: #ffffff;
    --clr-primary-light: #F2F2F2;

    --fc-primary: #2C2C2C;
    --fc-dark: #000000;
    --fc-white: #ffffff;
    --fc-black: #000000;
    --fc-grey: grey;
    --clr-comments-text: #333333;

    --ff-primary: 'Raleway', sans-serif;
    --ff-body: var(--ff-primary);
    --ff-heading: var(--ff-primary);

    --fw-regular: 400;
    --fw-bold: 700;

    --fs-300: 0.8125rem;
    --fs-400: 0.875rem;
    --fs-500: 0.9375rem;
    --fs-600: 1rem;
    --fs-700: 25px;
    --fs-800: 1.9rem;
    --fs-850: 2.3125rem;
    --fs-900: 3rem;

    --fs-body: var(--fs-400);
    --fs-primary-heading: var(--fs-850);
    --fs-secondary-heading: var(--fs-700);
    --fs-nav: var(--fs-500);
    --fs-button: var(--fs-300);

    --fs-news-title: 20px;

    --br-primary: 15px;
    --br-button: 8px;

    --shadow: 0px 0px 14px rgb(0 0 0 / 15%);

    --height-header: 60px;
    --p-button: 10px 15px;
    --clr-border: #339933;

    --bg-header: #00121d;
    --bg-footer: #002732;
    --bg-corporate: #00181f;

    --overlay-dark: rgba(0, 0, 0, 0.65);
    --overlay-mid: rgba(0, 0, 0, 0.45);
    --overlay-light: rgba(0, 0, 0, 0.15);

    --clr-accent: #339933;

    --p-news-left: 22px;
    --p-news-right: 56px;
    --p-news-bottom: 24px;

    --space-title-text: 20px;
    --space-title-text-first: 12px;

    --size-arrow: 22px;
    --space-arrow-right: 20px;
    --space-arrow-bottom: 32px;

    --size-title-line-width: 80px;
    --size-title-line-height: 4px;
    --space-title-line-top: 25px;
    --space-title-line-bottom: 35px;

    --br-video: 12px;
    --br-keyfact: 10px;
    --clr-keyfact-border: rgba(255, 255, 255, 0.8);
    --fs-keyfact-number: 32px;
    --fs-keyfact-text: 18px;

    /* ============================= */
    /* banner additions 
      */
    /* ============================= */

    --banner-max-width: 1380px;
    --banner-min-height: 620px;

    --banner-padding-top: 109px;
    --banner-padding-x: 20px;
    --banner-padding-bottom: 90px;

    --banner-keyfact-gap: 12px;
    --banner-keyfact-offset-top: -20px;
    --banner-keyfact-padding: 16px 18px;

    --banner-clip-path: polygon(
        0 18%,
        100% 4%,
        100% 88%,
        0 100%
    );

    /* ===== ADDITIONAL COLORS ===== */
    --fc-body-light: rgba(44, 44, 44, 0.75);
    --fc-body-lighter: rgba(44, 44, 44, 0.72);
    --fc-body-dark: #4a4a4a;
    --footer-text: #333333;
    --overlay-mid-alt: rgba(0, 0, 0, 0.35);

    /* ===== ADDITIONAL TYPOGRAPHY ===== */
    --fw-semi-bold: 600;
    --fw-medium: 500;

    --fs-hero-title: 37px;
    --fs-section-title: 20px;
    --fs-body-large: 18px;
    --fs-body-small: 14px;
    --fs-xs: 13px;
    --fs-keyfact-number-alt: 24px;

    /* ===== ADDITIONAL SPACING ===== */
    --sp-xxs: 2px;
    --sp-xs: 3px;
    --sp-sm: 6px;
    --sp-md: 10px;
    --sp-lg: 12px;
    --sp-xl: 14px;
    --sp-xxl: 16px;
    --sp-xxxl: 18px;
    --sp-4xl: 20px;
    --sp-5xl: 22px;
    --sp-6xl: 24px;
    --sp-7xl: 26px;
    --sp-8xl: 28px;
    --sp-9xl: 32px;
    --sp-10xl: 40px;
    --sp-11xl: 48px;
    --sp-12xl: 56px;
    --sp-13xl: 60px;
    --sp-14xl: 65px;
    --sp-15xl: 70px;

    /* ===== ADDITIONAL MARGINS/PADDINGS ===== */
    --p-news-left-alt: 18px;
    --p-news-right-alt: 18px;
    --p-news-bottom-alt: 0;

    /* ===== ADDITIONAL SIZING ===== */
    --size-arrow-alt: 8px;
    --space-title-line-top-alt: 12px;
    --space-title-line-bottom-alt: 0px;
    --space-title-text-alt: 12px;
    --space-title-text-first-alt: 16px;
    --space-arrow-right-alt: 18px;
    --space-arrow-bottom-alt: 18px;

    /* ===== LINES ===== */
    --line-thin: 1px;
    --line-medium: 2px;
    --line-thick: 3px;
    --line-thick-4: 4px;

    /* ===== BORDER RADIUS ===== */
    --br-pill: 999px;
    --br-rounded: 2px;

    /* ===== FOOTER STYLES ===== */
    --footer-bg: #F2F2F2;
    --footer-link: var(--footer-text);
    --footer-link-hover: var(--footer-text);
    --footer-divider-height: 290px;
    --footer-divider-width: 1px;
    --footer-locations-title-mb: 20px;
    --footer-location-col-mb: 20px;
    --footer-location-col-pr: 30px;
    --footer-location-line-height: 1.6;
    --footer-seo-footer2-pl: 0px;
    --footer-footer1-basis: 25%;
    --footer-footer2-basis: 60%;
    --footer-footer3-basis: 15%;
    --footer-social-icon-mt: 15px;

    /* ===== SLIDER STYLES ===== */
    --slider-height: 375px;
    --slider-title-size: 37px;
    --slider-text-size: 18px;
    --slider-title-line-height: 1.15;
    --slider-text-line-height: 1.45;
    --slider-text-max-width: 900px;
    --slider-padding-x: 20px;

    /* ===== COMPONENT GLOBAL ===== */
    --cmp-border: 1px solid var(--footer-text, #333333);
    --cmp-shadow: 0 0 12px rgba(0,0,0,.16);
    --cmp-pad-x: 14px;
    --cmp-pad-cell-x: 18px;
    --cmp-speed-h: 420ms;
    --cmp-speed: 260ms;

    /* ===== COMMONLY USED COLORS (High Repetition) ===== */
    --clr-light-bg: #f5f7fb;
    --clr-secondary-light: #bac;
    --overlay-10: rgba(0, 0, 0, 0.10);
    --overlay-08: rgba(0, 0, 0, 0.08);
    --overlay-12: rgba(0, 0, 0, 0.12);

    /* ===== COMMONLY USED FONT SIZES ===== */
    --fs-14: 14px;
    --fs-15: 15px;
    --fs-16: 16px;
    --fs-18: 18px;
    --fs-20: 20px;
    --fs-26: 26px;
    --fs-28: 28px;

    /* ===== COMMONLY USED LINE HEIGHTS ===== */
    --lh-1: 1;
    --lh-1-2: 1.2;
    --lh-1-25: 1.25;
    --lh-1-3: 1.3;
    --lh-1-4: 1.4;
    --lh-1-45: 1.45;
    --lh-1-5: 1.5;
    --lh-1-55: 1.55;
    --lh-1-6: 1.6;

    /* ===== COMMONLY USED Z-INDEX ===== */
    --z-base: 0;
    --z-1: 1;
    --z-2: 2;
    --z-3: 3;
    --z-4: 4;
    --z-5: 5;
    --z-max: 999;

    /* ===== COMMONLY USED TRANSITIONS ===== */
    --trans-fast: 150ms ease;
    --trans-normal: 250ms ease;
    --trans-medium: 300ms ease;
    --trans-slow: 500ms ease;

    /* ===== SHADOW VARIANTS ===== */
    --shadow-sm: 0 6px 14px rgba(0,0,0,.10);
    --shadow-md: 0 0 12px rgba(0,0,0,.12);
    --shadow-lg: 0 6px 18px rgba(0,0,0,.08);
    --shadow-none: none;
}

