/* Global CSS Variables */
:root {
    /* Colors (existing variables) */
    --white: #fff;
    --off-white: #f7f7f7;
    --off-black: #131313;
    --sky-blue: #0456b4;
    --medium-blue: #0569af;
    --dark-blue: #043b7a;
    --light-grey: #bfbfbf;
    --medium-grey: #666;
    --dark-grey: #878b92;
    
    /* Typography */
    --primary-font: 'Roboto', sans-serif;
    --icon-font: 'Material Icons';
    
    /* Responsive font size calculation */
    --responsive: calc((var(--min-font) * 1px) + (var(--max-font) - var(--min-font)) * ((100vw - 420px) / (1200 - 420)));
}