:root {

    /* =========================================
       Brand Colors
    ========================================= */

    /* Primary Colors */
    --primary-color:        #00A1F1;
    --primary-color-rgb:    0, 161, 241;
    --primary-color-dark:   #0081c4;
    --primary-color-light:  #33b5f4;
    --primary-color-xlight: #e6f6fe;
    --primary-color-bg:     #F0F7FE;
    --primary-gradient-end: #0A6DCB;

    --primary-dark:         #312B2B;
    --primary-dark-soft:    #4a4242;
    --primary-dark-muted:   #6b6060;

    /* Secondary / Accent Colors */
    --secondary-green:      #7CBB00;
    --secondary-green-dark: #639800;
    --secondary-green-light:#9dd633;

    --secondary-yellow:     #FFBB00;
    --secondary-yellow-dark:#cc9600;
    --secondary-yellow-light:#ffcd40;

    --secondary-red:        #F65314;
    --secondary-red-dark:   #c44210;
    --secondary-red-light:  #f87549;

    /* =========================================
       Neutral / UI Colors
    ========================================= */
    --color-white:          #ffffff;
    --color-black:          #000000;
    --color-body-text:      #6B7280;
    --color-heading:        #312B2B;
    --color-muted:          #6c757d;
    --color-desc:           #6B7280;
    --color-subtle:         #9ca3af;
    --color-border:         #e5e7eb;
    --color-border-light:   #f0f0f0;
    --color-border-button:  #E5E5E5;
    --color-border-card:    #F1F5F9;
    --color-border-light-blue: #e2e8ff;
    --color-input-bg:       #f8f9fa;
    --color-divider:        #dee2e6;
    --color-feature:        #6B7682;
    --color-bg:             #F7F8FC;

    /* =========================================
       Background Colors
    ========================================= */
    --bg-white:             #ffffff;
    --bg-light:             #f7fbff;
    --bg-section:           #f4f8ffba;
    --bg-section-alt:       #fafafa;
    --bg-dark:              #312B2B;
    --bg-dark-deep:         #1a1616;
    --bg-blue-soft:         #e6f6fe;
    --bg-anchor-nav:        #D7F2FF;
    --bg-card-gradient-end: #CAEEFF;
    --bg-overlay:           rgba(0, 161, 241, 0.08);
    --bg-overlay-medium:    rgba(0, 161, 241, 0.15);
    --bg-overlay-red:       rgba(246, 83, 20, 0.08);
    --bg-overlay-green:     rgba(124, 187, 0, 0.08);
    --bg-overlay-yellow:    rgba(255, 187, 0, 0.08);
    --bg-overlay-dark:      rgba(49, 43, 43, 0.85);
    --bg-overlay-cta:       rgba(49, 43, 43, 0.20);

    --bg-card:              #F7F8FC;
    --bg-uc-col-top:        #F8FAFC;
    --bg-card-blue-light:   #EBF7FE;
    --bg-card-green-light:  #F5FAEB;
    --bg-card-peach-light:  #FEF1EC;
    --bg-card-blue:         #00A1F126;
    --bg-card-yellow:       #FFBB0026;
    --bg-card-green:        #7CBB0026;
    --bg-card-red:          #F6531426;
    --bg-tag-blog:          #EAF0FA;
    --color-border-tag:     #DDE2E8;
    --bg-solutions:         #1E2B4A;
    --color-white-alpha-05: rgba(255, 255, 255, 0.05);
    --color-white-alpha-20: rgba(255, 255, 255, 0.20);
    --color-white-alpha-75: rgba(255, 255, 255, 0.75);
    --color-white-alpha-85: rgba(255, 255, 255, 0.85);
    --color-border-dark-25: rgba(0, 0, 0, 0.25);

    --bg-footer-badge:        #F3F3F3;
    --bg-footer-social:       #F8FAFC;
    --color-footer-copyright: #94A3B8;
    --color-footer-social:    #64748B;

    /* Solutions Banner / Partner Card */
    --bg-radial-primary:    radial-gradient(ellipse at center, rgba(0, 161, 241, 0.08) 0%, rgba(0, 161, 241, 0) 70%);
    --color-partner-label:  #989EA6;
    --color-partner-text:   #6A7078;
    --color-border-partner: #E0E4E9;
    --color-separator-line: #EBEFF3;

    /* Navigation pill */
    --bg-nav-default:    rgba(255, 255, 255, 0.01);
    --bg-nav-sticky:     rgba(255, 255, 255, 0.93);
    --border-nav-pill:   rgba(255, 255, 255, 0.40);
    --shadow-nav-pill:   0 4px 24px rgba(0, 0, 0, 0.10);
    --shadow-nav-mega:   0 8px 32px rgba(0, 0, 0, 0.10);
    --color-nav-cta:     #1565FF;
    --color-nav-cta-dark: #1152cc;
    --color-nav-dis: #6B6565;

    /* Section-specific backgrounds (observed in design) */
    --bg-mega-menu:         #0000001A;
    --bg-hero:              #ffffff;
    --hero-subtitle-border: #D1D5DB;
    --bg-ai-section:        #1e2a3a;
    --bg-cta:               linear-gradient(135deg, #00A1F1 0%, #0081c4 100%);
    --bg-cta-page:          linear-gradient(90deg, #00A1F1 0%, #0A6DCB 100%);
    --bg-footer:            #312B2B;

    /* =========================================
       Typography
    ========================================= */
    --font-family-primary:  'Plus Jakarta Sans', sans-serif;
    --font-family-fallback: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
   /* =========================================
      Font Size
   ========================================= */
      
   --font-size-72: 72px;
   --font-size-71: 71px;
   --font-size-70: 70px;
   --font-size-69: 69px;
   --font-size-68: 68px;
   --font-size-67: 67px;
   --font-size-66: 66px;
   --font-size-65: 65px;
   --font-size-64: 64px;
   --font-size-63: 63px;
   --font-size-62: 62px;
   --font-size-61: 61px;
   --font-size-60: 60px;
   --font-size-59: 59px;
   --font-size-58: 58px;
   --font-size-57: 57px;
   --font-size-56: 56px;
   --font-size-55: 55px;
   --font-size-54: 54px;
   --font-size-53: 53px;
   --font-size-52: 52px;
   --font-size-51: 51px;
   --font-size-50: 50px;
   --font-size-49: 49px;
   --font-size-48: 48px;
   --font-size-47: 47px;
   --font-size-46: 46px;
   --font-size-45: 45px;
   --font-size-44: 44px;
   --font-size-43: 43px;
   --font-size-42: 42px;
   --font-size-41: 41px;
   --font-size-40: 40px;
   --font-size-39: 39px;
   --font-size-38: 38px;
   --font-size-37: 37px;
   --font-size-36: 36px;
   --font-size-35: 35px;
   --font-size-34: 34px;
   --font-size-33: 33px;
   --font-size-32: 32px;
   --font-size-31: 31px;
   --font-size-30: 30px;
   --font-size-29: 29px;
   --font-size-28: 28px;
   --font-size-27: 27px;
   --font-size-26: 26px;
   --font-size-25: 25px;
   --font-size-24: 24px;
   --font-size-23: 23px;
   --font-size-22: 22px;
   --font-size-21: 21px;
   --font-size-20: 20px;
   --font-size-19: 19px;
   --font-size-18: 18px;
   --font-size-17: 17px;
   --font-size-16: 16px;
   --font-size-15: 15px;
   --font-size-14: 14px;
   --font-size-13: 13px;
   --font-size-12: 12px;
   --font-size-11: 11px;
   --font-size-10: 10px;


   /* =========================================
      Font Family
   ========================================= */
   --font-light: "PlusJakarta-Sans-Light";
   --font-regular: "PlusJakarta-Sans-Regular";
   --font-medium: "PlusJakarta-Sans-Medium";
   --font-semibold: "PlusJakarta-Sans-SemiBold";
   --font-bold: "PlusJakarta-Sans-Bold";
   --font-extrabold: "PlusJakarta-Sans-ExtraBold";
 

    --font-weight-thin:         100;
    --font-weight-extralight:   200;
    --font-weight-light:        300;
    --font-weight-regular:      400;
    --font-weight-medium:       500;
    --font-weight-semibold:     600;
    --font-weight-bold:         700;
    --font-weight-extrabold:    800;
    --font-weight-black:        900;

    --line-height-tight:    1.25;
    --line-height-snug:     1.375;
    --line-height-normal:   1.5;
    --line-height-relaxed:  1.625;
    --line-height-loose:    2;

    --letter-spacing-tight:  -0.025em;
    --letter-spacing-normal:  0em;
    --letter-spacing-wide:    0.025em;
    --letter-spacing-wider:   0.05em;

    /* =========================================
       Spacing
    ========================================= */
    --spacing-xs:   0.25rem;   /* 4px  */
    --spacing-5:    0.3125rem; /* 5px  */
    --spacing-sm:   0.5rem;    /* 8px  */
    --spacing-10:   0.625rem;  /* 10px */
    --spacing-12:   0.75rem;   /* 12px */
    --spacing-14:   0.875rem;  /* 14px */
    --spacing-15:   0.9375rem; /* 15px */
    --spacing-md:   1rem;      /* 16px */
    --spacing-20:   1.25rem;   /* 20px */
    --spacing-lg:   1.5rem;    /* 24px */
    --spacing-xl:   2rem;      /* 32px */
    --spacing-40:   2.5rem;    /* 40px */
    --spacing-2xl:  3rem;      /* 48px */
    --spacing-3xl:  4rem;      /* 64px */
    --spacing-4xl:  6rem;      /* 96px */
    --spacing-5xl:  7rem;      

    /* Section / Card spacing */
    --spacing-card-p:         1.875rem;  /* 30px — card inner padding   */
    --spacing-card-item-mb:   1.25rem;   /* 20px — card element spacing */
    --spacing-section-title-mb: 3.75rem; /* 60px — section title margin */
    --spacing-menu-bottom: 10px;

    /* =========================================
       Border Radius
    ========================================= */
    --radius-sm:    0.25rem;   /* 4px  */
    --radius-md:    0.5rem;    /* 8px  */
    --radius-lg:    0.75rem;   /* 12px */
    --radius-xl:    1rem;      /* 16px */
    --radius-logo:  1.25rem;   /* 20px */
    --radius-2xl:   1.5rem;    /* 24px */
    --radius-card:  2.5rem;    /* 40px */
    --radius-full:  9999px;

    /* =========================================
       Box Shadows
    ========================================= */
    --shadow-xs:      0 1px 2px  rgba(0, 0, 0, 0.05);
    --shadow-sm:      0 1px 3px  rgba(0, 0, 0, 0.10), 0 1px 2px rgba(0, 0, 0, 0.06);
    --shadow-md:      0 4px 6px  rgba(0, 0, 0, 0.07), 0 2px 4px rgba(0, 0, 0, 0.06);
    --shadow-lg:      0 10px 15px rgba(0, 0, 0, 0.10), 0 4px 6px rgba(0, 0, 0, 0.05);
    --shadow-xl:      0 20px 25px rgba(0, 0, 0, 0.10), 0 10px 10px rgba(0, 0, 0, 0.04);
    --shadow-primary: 0 8px 24px rgba(0, 161, 241, 0.30);
    --shadow-card:        0 4px 20px rgba(0, 0, 0, 0.08);
    --shadow-card-hover:  0 12px 32px rgba(0, 161, 241, 0.15);
    --shadow-card-bottom: rgba(0, 0, 0, 0.04) 0px 3px 5px;;

    /* =========================================
       Transitions
    ========================================= */
    --transition-fast:    150ms ease-in-out;
    --transition-base:    250ms ease-in-out;
    --transition-slow:    400ms ease-in-out;

    /* =========================================
       Z-Index
    ========================================= */
    --z-dropdown:   1000;
    --z-sticky:     1020;
    --z-fixed:      1030;
    --z-modal:      1050;
    --z-tooltip:    1070;
    --z-toast:      1080;
}