html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

:root {
    --primary: #e63946;
    --primary-dark: #b71c2a;
    --dark: #0d1117;
    --dark2: #161b22;
    --dark3: #1a1f2b;
    --gold: #f4c542;
    --light: #f8f9fa;
    --gray: #8b949e;
    --primary-red: #e63946;
    --primary-red-dark: #c0392b;
    --primary-red-light: #ff6b6b;
    --white: #ffffff;
    --gray-light: #f8f9fa;
    --gray: #6c757d;
    --gray-border: #dee2e6;
    --shadow: rgba(0, 0, 0, 0.08);
    --shadow-hover: rgba(230, 57, 70, 0.15);

    --white: #ffffff;
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --success: #10b981;
    --warning: #f59e0b;
    --whatsapp: #25D366;
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    --radius: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
}