/* =========================================================
   GLOBAL VARIABLES & RESETS
   ========================================================= */

:root {
    /* Global Colors */
    --color-white: #ffffff;
    --color-black: #333333;
    --ast-global-color-0: #9C0002;
    --ast-global-color-1: #D00000;
    
    /* =============================================
       SITE LAYOUT — Single source of truth for width
       Change this one value to resize the entire site
       ============================================= */
    --site-max-width: 1400px;

    /* Animation Specific Variables */
    --border-thk: clamp(15px, 2vw, 35px);
    --Offcet: clamp(10px, 8%, 30px);
    --ColorBack: rgba(156, 0, 2, 0.1);
    --ColorBorder: rgba(156, 0, 2, 0.15);
    --MainMargin: 10% 0;

    /* Fonts */
    --font-heading-tech2: 'Rajdhani', sans-serif;
    --font-body: 'Noto Serif', serif;
    
    /* Icon Button Variables */
    --icon-btn-bg: rgba(156, 0, 2, 0.04);
    --icon-btn-border: transparent;
    --icon-btn-border-width: 0px;
    --icon-btn-icon-color: #9C0002;
    --icon-btn-text-color: #111;
}

/* Base resets to prevent blurriness and visual artifacts */
.elementor-page * {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Ensure sticky elements aren't broken by parent overflow */
.html-con {
    overflow: visible !important;
}