@import url("fonts.css");

:root {
  /* --- Renkler --- */
  --color-primary: #db0000; /* Kırmızı vurgular */
  --color-primary-hover: #ff1414;
  --color-primary-shadow: rgba(219, 0, 0, 0.8);
  --color-white: #ffffff;
  --color-white-muted: #bbb;
  --color-white-muted-light: #ccc;
  --color-black-overlay-light: rgba(0, 0, 0, 0.1);
  --color-black-overlay-medium: rgba(0, 0, 0, 0.4);
  --color-black-overlay-strong: rgba(0, 0, 0, 0.7);
  --color-black-overlay-stronger: rgba(0, 0, 0, 0.95);
  --color-text-muted: #94a3b8;
  --color-text-muted-light: #ddd;

  /* --- Font Ailesi --- */
  --font-primary: "Rubik", Arial, Helvetica, sans-serif;
  --font-secondary: "Poppins", sans-serif;
  --font-logo: "Toxigenesis", Arial, Helvetica, sans-serif;
  --font-code: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;

  /* --- Font Büyüklükleri --- */
  --font-size-header-large: 2.5rem;
  --font-size-header-medium: 2rem;
  --font-size-header-small: 1.5rem;
  --font-size-body-large: 1.1rem;
  --font-size-body-medium: 0.95rem;
  --font-size-body-small: 0.85rem;
  --font-size-footer-small: 0.9rem;

  /* --- Responsive Font --- */
  --font-size-1100px-h2: 2.2rem;
  --font-size-1100px-p: 1rem;

  --font-size-900px-h1: 1.75rem;
  --font-size-900px-h3: 2rem;
  --font-size-900px-p: 0.85rem;
  --font-size-900px-cta: 0.9rem;
  
  --font-size-768px-h3: 1.75rem;
  --font-size-768px-p: .75rem;
  
  --font-size-480px-logo: 1.5rem;
  --font-size-480px-h1: 1.5rem;
  --font-size-480px-p: 0.85rem;
  
  --font-size-480px-h3: 1.75rem;
  --font-size-480px-p: 0.75rem;
  --font-size-480px-p-2: 0.95rem;
  --font-size-480px-h3-2: 1.25rem;
  --font-size-480px-h2: 1rem;
  
  --font-size-360px-logo: 1.1rem;
  --font-size-360px-nav-a: .85rem;
  --font-size-360px-h1: 1.25rem;
  --font-size-360px-p: 0.7rem;
  --font-size-360px-hero: 0.75rem;
  --font-size-360px-h3: 2rem;


  /* --- Renkli Gradient & Animasyon Ayarları --- */
  --gradient-btn: linear-gradient(45deg, var(--color-primary), #0d0d0d);
  --gradient-whatsapp: linear-gradient(135deg, #25d366, #128c7e);

  /* --- Arka Plan Blur Efektleri --- */
  --backdrop-blur-light: blur(10px);
  --backdrop-blur-medium: blur(20px);
  --backdrop-blur-strong: blur(40px);
  --backdrop-blur-extreme: blur(50px);

  /* --- Box Shadow --- */
  --shadow-soft-red: 0 0 10px var(--color-primary);
  --shadow-strong-red: 0 0 30px rgba(219, 0, 0, 0.65);
  --shadow-black-light: 0 0 10px rgba(0, 0, 0, 0.2);
  --shadow-black-strong: 0 40px 80px rgba(0, 0, 0, 0.4);

  /* --- Border Radius --- */
  --radius-round: 50px;
  --radius-large: 30px;
  --radius-medium: 16px;
  --radius-small: 12px;
  --radius-extra-small: 8px;

  /* --- Z-index --- */
  --z-index-header: 1000;
  --z-index-hamburger: 102;
  --z-index-reference-card-hover: 999;

  /* --- Diğer --- */
  --transition-default: all 0.3s ease;
  --transition-hover: transform 0.3s ease;
  --animation-default: 0.5s ease forwards;
}