/* ============================================
   VARIABLES - LP TruScale IaaS
   ============================================
   
   Variáveis CSS extraídas do design do Figma
   Cores, tipografia, espaçamentos
*/

:root {
  /* ========== CORES ========== */
  
  /* Cores Primárias */
  --color-primary: #4d144a;
  --color-primary-dark: #3a0d37;
  --color-primary-light: #d9c1d8;
  
  /* Cores Secundárias */
  --color-red: #e1251b;
  --color-red-hover: #c41f16;
  --color-red-dark: #de241b;
  
  /* Cores de Fundo */
  --color-bg-pink-light: #fff7fb;
  --color-bg-white: #ffffff;
  --color-bg-black: #000000;
  --color-bg-gray-light: #c7c7c7;
  --color-bg-gray-medium: #cecece;
  
  /* Cores de Texto */
  --color-text-primary: #000000;
  --color-text-secondary: #1e1e1e;
  --color-text-dark: #1e0013;
  --color-text-dark-alt: #1d1616;
  --color-text-gray: #333333;
  --color-text-gray-medium: #53606a;
  --color-white: #ffffff;
  
  /* ========== TIPOGRAFIA ========== */
  
  /* Font Families */
  --font-gotham-bold: 'Gotham Bold', 'Gotham-Bold', 'Gotham_Bold:Regular', sans-serif;
  --font-gotham-book: 'Gotham Book', 'Gotham-Book', 'Gotham:Book', sans-serif;
  --font-gotham-ultra: 'Gotham Ultra', 'Gotham:Ultra', sans-serif;
  --font-gotham-light: 'Gotham Light', 'Gotham-Light', sans-serif;
  
  /* Font Sizes */
  --font-size-hero: 48px;
  --font-size-title-large: 40px;
  --font-size-title: 36px;
  --font-size-subtitle: 32px;
  --font-size-section-title: 24px;
  --font-size-large: 20px;
  --font-size-body: 18px;
  --font-size-medium: 17px;
  --font-size-base: 16px;
  --font-size-small: 14px;
  --font-size-tiny: 13px;
  --font-size-mini: 12px;
  
  /* Line Heights */
  --line-height-tight: 1.2;
  --line-height-normal: 1.4;
  --line-height-relaxed: 1.5;
  --line-height-body: 27px;
  --line-height-heading: 49.4px;
  --line-height-title: 44px;
  
  /* Font Weights */
  --font-weight-light: 325;
  --font-weight-normal: 400;
  --font-weight-bold: 700;
  --font-weight-black: 900;
  
  /* ========== ESPAÇAMENTOS ========== */
  
  /* Gaps */
  --gap-xs: 8px;
  --gap-sm: 12px;
  --gap-md: 16px;
  --gap-lg: 24px;
  --gap-xl: 32px;
  --gap-2xl: 40px;
  --gap-3xl: 48px;
  
  /* Padding */
  --padding-xs: 8px;
  --padding-sm: 12px;
  --padding-md: 16px;
  --padding-lg: 20px;
  --padding-xl: 40px;
  --padding-2xl: 60px;
  --padding-3xl: 100px;
  
  /* Margins */
  --margin-xs: 8px;
  --margin-sm: 12px;
  --margin-md: 16px;
  --margin-lg: 24px;
  --margin-xl: 40px;
  --margin-2xl: 60px;
  
  /* ========== CONTAINERS ========== */
  
  /* Max widths */
  --container-max-width: 1920px;
  --content-max-width: 1440px;
  --text-max-width: 593px;
  --form-width: 435.59px;
  --card-width: 288px;
  
  /* ========== BREAKPOINTS ========== */
  /* Usar em @media queries */
  --breakpoint-mobile: 320px;
  --breakpoint-tablet: 768px;
  --breakpoint-desktop: 1024px;
  --breakpoint-wide: 1440px;
  --breakpoint-ultrawide: 1920px;
  
  /* ========== MISC ========== */
  
  /* Border Radius */
  --border-radius-sm: 3px;
  --border-radius-md: 4px;
  --border-radius-lg: 5px;
  --border-radius-xl: 17px;
  
  /* Borders */
  --border-width: 1px;
  --border-width-md: 2px;
  --border-color: #c7c7c7;
  --border-color-light: #cecece;
  
  /* Shadows */
  --shadow-button: 0 -4px 8px rgba(0, 0, 0, 0.2);
  --shadow-form: 0px 8px 16px 0px rgba(0, 0, 0, 0.16);
  --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.1);
  
  /* Transitions */
  --transition-fast: 0.2s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;
  
  /* Opacity */
  --opacity-overlay: 0.28;
  --opacity-hover: 0.8;
  
  /* Z-index */
  --z-index-base: 1;
  --z-index-dropdown: 100;
  --z-index-overlay: 1000;
  --z-index-mobile-button: 9998;
  --z-index-modal: 9999;
  
  /* Gradients */
  --gradient-hero: linear-gradient(207.29deg, rgba(17, 24, 79, 0) 22.582%, rgb(77, 20, 74) 101.05%);
  --gradient-overlay-left: linear-gradient(207.29deg, rgba(17, 24, 79, 0) 22.582%, rgb(77, 20, 74) 101.05%);
  --gradient-overlay-right: linear-gradient(207.69deg, rgba(17, 24, 79, 0) 22.582%, rgba(77, 20, 74, 0.33) 101.05%);
}