/* ===== CSS VARIABLES ===== */
:root {
    /* Color Variables */
    --iyeg-active-green: #00ff88;
    --iyeg-hover-green: #00cc6a;
    --iyeg-dark-text: #070606;
    --iyeg-util-bg: #161616;
    --iyeg-header-bg: #000000;
    --iyeg-spec-bg: #0a0a0a;
    --iyeg-text-gray: #9fa6b2;
    --iyeg-overlay-bg: rgba(25, 25, 25, 0.9);



    --iyeg-primary-black: #000000;
            --iyeg-icon-green: #12B662;
            --iyeg-field-bg: #202020;
            --iyeg-placeholder-gray: #B2B2B2;
            --iyeg-text-gray-1: #A4A4A4;
            --iyeg-overlay-dark: rgba(0, 0, 0, 0.7);
            --iyeg-footer-bg: #191919;
            --iyeg-text-gray-1: #a4a4a4;
            --iyeg-overlay-dark: rgba(0, 0, 0, 0.7);
            --iyeg-overlay-green: rgba(0, 255, 136, 0.45);

/* cta inner : before */
/* #034124ba */
  
    /* Spacing Variables */
    --iyeg-space-xs: 0.5rem;
    --iyeg-space-sm: 1rem;
    --iyeg-space-md: 2rem;
    --iyeg-space-lg: 4rem;
    --iyeg-space-xl: 6rem;


    /* Spacing Variables */
    /* --iyeg-space-xs: 0.5rem; */
    /* --iyeg-space-sm: 1rem; */
    /* --iyeg-space-md: 2rem; */
    --iyeg-space-lg-1: 3rem;
    --iyeg-space-xl-1: 5rem;



    /* --iyeg-space-xs: 0.5rem; */
    /* --iyeg-space-sm: 1rem; */
    /* --iyeg-space-md: 2rem; */
    /* --iyeg-space-lg-1: 3rem; */
    /* --iyeg-space-xl-1: 5rem; */
    --iyeg-space-xxl: 7rem;

  
    /* Typography Variables */
    --iyeg-font-size-xs: 0.75rem; /* 12px */
    --iyeg-font-size-sm: 0.875rem; /* 14px */
    --iyeg-font-size-base: 1rem; /* 16px */
    /*add variable for 18px*/
    --iyeg-font-size-md: 1.25rem; /* 20px */
    --iyeg-font-size-lg: 1.5rem; /* 24px */
    --iyeg-font-size-xl: 2rem; /* 32px */
    /*1.875rem*/
    --iyeg-font-size-xxl: 3rem; /* 48px */
    --iyeg-font-size-xxl-1: 2.5rem; /*not used in contact*/
    --iyeg-font-size-hero: clamp(3rem, 10vw, 6rem);
    --iyeg-font-size-hero-1: clamp(2rem, 6vw, 3.75rem); /*not used in contact*/
    --iyeg-font-size-hero-2: clamp(2.5rem, 8vw, 3.75rem);
    --iyeg-font-size-hero-3: clamp(2rem, 6vw, 3rem);


  
    /* Breakpoints */
    --iyeg-breakpoint-xs: 360px;
    --iyeg-breakpoint-mobile: 480px;
    --iyeg-breakpoint-tablet: 768px;
    --iyeg-breakpoint-desktop: 1024px;
    --iyeg-breakpoint-wide: 1400px;
  
    /* Transitions */
    --iyeg-transition-fast: 0.2s ease;
    --iyeg-transition-base: 0.3s ease;
    --iyeg-transition-slow: 0.5s ease;
  
    



    /* Layout */
    --iyeg-container-padding: 8%;
    --iyeg-mobile-padding: 1rem;
    
    /* Special Variables */
    --iyeg-header-height: 7.5rem; /* Default Desktop */
    
    /* The distance from the edge of the container to the button */
    --iyeg-carousel-offset: 2.5rem;
    --iyeg-carousel-offset-xl: 4.5rem;
    --iyeg-carousel-offset-sm: 0.5rem;
  
  /* You can also tokenize the size if you want all carousel buttons to match */
    --iyeg-carousel-btn-size: 3.125rem;
    
    --iyeg-carousel-icon-size: 1rem; /* icon font size*/


  }