/* ==========================================================================
   FIBER GROUP - CSS Design Tokens / Custom Properties
   ========================================================================== */

:root {

  /* ---- Brand Colors ---- */
  /* Kurumsal Gold — revizeler.docx: #e3ae4d */
  --color-accent:        #E3AE4D;
  --color-accent-hover:  #ECC060;
  --color-accent-dark:   #C49030;
  --color-accent-light:  #F2C97A;
  --color-accent-muted:  rgba(227, 174, 77, 0.12);
  --color-accent-soft:   rgba(227, 174, 77, 0.08);

  /* ---- Dark Surfaces ---- */
  /* Gece Mavisi — revizeler.docx: #0c2444 */
  --color-dark:          #0C2444;
  --color-dark-2:        #122D55;
  --color-dark-3:        #1A3A66;
  --color-dark-card:     #0F2A50;
  --color-dark-border:   rgba(255, 255, 255, 0.08);
  --color-dark-border-2: rgba(255, 255, 255, 0.14);

  /* ---- Light Surfaces ---- */
  --color-white:         #FFFFFF;
  --color-surface:       #F5F7FA;
  --color-surface-2:     #EDF1F7;
  --color-border:        #DEE4EC;
  --color-border-light:  #EEF2F7;

  /* ---- Text ---- */
  --color-text:              #0C2444;
  --color-text-secondary:    #3D5A7A;
  --color-text-muted:        #7A96B2;
  --color-text-inverse:      #FFFFFF;
  --color-text-inverse-sec:  rgba(255, 255, 255, 0.68);
  --color-text-inverse-muted: rgba(255, 255, 255, 0.42);

  /* ---- Status Colors ---- */
  --color-success:       #16A34A;
  --color-warning:       #D97706;
  --color-info:          #2563EB;
  --color-error:         #DC2626;

  /* ---- Status Badges ---- */
  --badge-ongoing-bg:    rgba(227, 174, 77, 0.12);
  --badge-ongoing-color: #E3AE4D;
  --badge-ongoing-border: rgba(227, 174, 77, 0.24);
  --badge-done-bg:       rgba(22, 163, 74, 0.10);
  --badge-done-color:    #16A34A;
  --badge-done-border:   rgba(22, 163, 74, 0.20);

  /* ---- Typography ---- */
  --font-heading: 'Plus Jakarta Sans', 'Helvetica Neue', Arial, sans-serif;
  --font-body:    'Inter', 'Helvetica Neue', Arial, sans-serif;

  /* ---- Type Scale ---- */
  --text-xs:   0.75rem;    /* 12px */
  --text-sm:   0.875rem;   /* 14px */
  --text-base: 1rem;       /* 16px */
  --text-md:   1.125rem;   /* 18px */
  --text-lg:   1.25rem;    /* 20px */
  --text-xl:   1.5rem;     /* 24px */
  --text-2xl:  1.875rem;   /* 30px */
  --text-3xl:  2.25rem;    /* 36px */
  --text-4xl:  3rem;       /* 48px */
  --text-5xl:  3.75rem;    /* 60px */
  --text-6xl:  clamp(2.75rem, 6vw, 5rem);

  /* ---- Font Weights ---- */
  --fw-normal:    400;
  --fw-medium:    500;
  --fw-semibold:  600;
  --fw-bold:      700;
  --fw-extrabold: 800;

  /* ---- Line Heights ---- */
  --lh-tight:   1.1;
  --lh-snug:    1.25;
  --lh-normal:  1.5;
  --lh-relaxed: 1.65;

  /* ---- Letter Spacing ---- */
  --ls-tight:   -0.025em;
  --ls-normal:  0;
  --ls-wide:    0.04em;
  --ls-wider:   0.08em;
  --ls-widest:  0.14em;

  /* ---- Spacing (4px base) ---- */
  --sp-1:  0.25rem;   /* 4px  */
  --sp-2:  0.5rem;    /* 8px  */
  --sp-3:  0.75rem;   /* 12px */
  --sp-4:  1rem;      /* 16px */
  --sp-5:  1.25rem;   /* 20px */
  --sp-6:  1.5rem;    /* 24px */
  --sp-8:  2rem;      /* 32px */
  --sp-10: 2.5rem;    /* 40px */
  --sp-12: 3rem;      /* 48px */
  --sp-16: 4rem;      /* 64px */
  --sp-20: 5rem;      /* 80px */
  --sp-24: 6rem;      /* 96px */
  --sp-32: 8rem;      /* 128px */

  /* ---- Border Radius ---- */
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   10px;
  --radius-xl:   12px;
  --radius-2xl:  16px;
  --radius-full: 9999px;

  /* ---- Shadows ---- */
  --shadow-xs:     0 1px 2px rgba(12, 36, 68, 0.04);
  --shadow-sm:     0 1px 4px rgba(12, 36, 68, 0.04), 0 2px 6px rgba(12, 36, 68, 0.03);
  --shadow-md:     0 6px 16px rgba(12, 36, 68, 0.06), 0 2px 8px rgba(12, 36, 68, 0.04);
  --shadow-lg:     0 12px 32px rgba(12, 36, 68, 0.08), 0 4px 12px rgba(12, 36, 68, 0.05);
  --shadow-xl:     0 24px 64px rgba(12, 36, 68, 0.10), 0 8px 24px rgba(12, 36, 68, 0.06);
  --shadow-accent: 0 8px 30px rgba(227, 174, 77, 0.20);
  --shadow-card:   0 4px 12px rgba(12, 36, 68, 0.04), 0 12px 32px rgba(12, 36, 68, 0.04);

  /* ---- Transitions ---- */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast:   200ms;
  --t-base:   350ms;
  --t-slow:   600ms;
  --t-slower: 900ms;

  /* ---- Z-index Stack ---- */
  --z-below:    -1;
  --z-base:      0;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-overlay:  300;
  --z-modal:    400;
  --z-toast:    500;

  /* ---- Layout ---- */
  --container-xs:  540px;
  --container-sm:  768px;
  --container-md:  1024px;
  --container-lg:  1280px;
  --container-xl:  1440px;
  --container-pad: clamp(1.25rem, 5vw, 2.5rem);

  /* ---- Header ---- */
  --topbar-h:         40px;
  --header-h:         80px;
  --header-h-scrolled: 62px;
  --total-header:     120px; /* topbar + header */

  /* ---- Section Spacing ---- */
  --section-y: clamp(4rem, 8vw, 7rem);
}