:root {
  /* ===== Font ===== */
  --zt-font-sans: "Satoshi", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                  "Helvetica Neue", Arial, sans-serif;

  /* Brand book */
  /* Blue */
  --zt-blue-900: #071B3A;
  --zt-blue-800: #0B2A5C;
  --zt-blue-700: #003FB2;
  --zt-blue-600: #0056C7;
  --zt-blue-500: #0074E1;
  --zt-blue-400: #00ACF1;
  --zt-blue-100: #EAF3FF;

  /* Green & Cyan */
  --zt-green-700: #009E56;
  --zt-green-600: #00C46A;
  --zt-green-500: #00D479;
  --zt-green-400: #00DA98;
  --zt-cyan-600:  #0E8F9A;
  --zt-cyan-200:  #00D6D3;

  /* Neutrals */
  --zt-grey-900: #0E1922;
  --zt-grey-500: #646670;
  --zt-grey-400: #979AA6;
  --zt-grey-300: #BABDC7;
  --zt-grey-200: #D9DAE5;
  --zt-white:    #FFFFFF;

  /* RGB parovi - za Bootstrap utility klase (bg-*text-*border-* s opacity) i box-shadow */
  --zt-blue-900-rgb: 7, 27, 58;
  --zt-blue-800-rgb: 11, 42, 92;
  --zt-blue-700-rgb: 0, 63, 178;
  --zt-blue-600-rgb: 0, 86, 199;
  --zt-blue-500-rgb: 0, 116, 225;
  --zt-blue-400-rgb: 0, 172, 241;
  --zt-green-700-rgb: 0, 158, 86;
  --zt-green-600-rgb: 0, 196, 106;
  --zt-cyan-200-rgb: 0, 214, 211;
  --zt-grey-900-rgb: 14, 25, 34;
  --zt-grey-500-rgb: 100, 102, 112;


  /* Surfaces / backgrounds */
  --color-bg:              var(--zt-white);
  --color-surface:         var(--zt-white);
  --color-surface-muted:   var(--zt-grey-200);
  --color-surface-tint:    var(--zt-blue-100);
  --color-nav:             var(--zt-blue-900);
  --color-nav-alt:         var(--zt-blue-800);

  /* Text */
  --color-heading:         var(--zt-blue-900);
  --color-heading-section: var(--zt-blue-800);
  --color-text:            var(--zt-grey-900);
  --color-text-secondary:  var(--zt-grey-500);
  --color-text-on-dark:    var(--zt-white);

  /* Interaktivno */
  --color-link:            var(--zt-blue-700);
  --color-primary:         var(--zt-blue-700);
  --color-primary-hover:   var(--zt-blue-800);
  --color-focus-ring:      var(--zt-blue-500);

  /* Akcenti (selektivno) */
  --color-accent:          var(--zt-green-600);
  --color-success:         var(--zt-green-600);
  --color-accent-cyan:     var(--zt-cyan-200);

  /* Linije */
  --color-border:          var(--zt-grey-300);
  --color-divider:         var(--zt-grey-300);

  /* ===== Gradijenti  ===== */
  --zt-gradient-brand: linear-gradient(135deg,
    var(--zt-blue-700) 0%,
    var(--zt-blue-400) 55%,
    var(--zt-green-600) 100%);

  --zt-gradient-brand-conic: conic-gradient(from 180deg,
    #003FB2, #00ACF1, #00C46A, #003FB2);
}