/* =========================================================
   GermAc Arees — Design System / Tokens
   Single source of truth for color, surface, radius, shadow,
   motion. Loaded before section stylesheets on Home, About
   and the intermediate pages.
   ========================================================= */

:root {
    /* --- Brand palette (from the existing identity) --- */
    --brand-navy: #243253;
    --brand-navy-2: #1b2740;
    --brand-navy-3: #131d31;
    --brand-orange: #eb5405;
    --brand-orange-soft: #ff7a33;
    --brand-blue: #0047ba;
    --brand-blue-2: #0060f0;
    --brand-blue-soft: #a9d2f6;

    /* Refined institutional teal (replaces the neon #00ffaa) */
    --accent: #34d1b4;
    --accent-2: #12b493;
    --accent-soft: #8ff0dd;

    /* Academic / prestige accent */
    --gold: #e4b976;
    --gold-soft: #f2dcb4;

    /* --- Surfaces & borders (on dark navy) --- */
    --surface: rgba(255, 255, 255, 0.045);
    --surface-2: rgba(255, 255, 255, 0.08);
    --surface-3: rgba(255, 255, 255, 0.13);
    --border: rgba(255, 255, 255, 0.12);
    --border-strong: rgba(169, 210, 246, 0.35);

    /* --- Text --- */
    --text: #eef2f8;
    --muted: #b9c4d6;
    --muted-2: #8ea0b8;

    /* --- Radius --- */
    --radius-sm: 12px;
    --radius-md: 18px;
    --radius-lg: 24px;
    --radius-xl: 32px;
    --radius-pill: 999px;

    /* --- Shadows --- */
    --shadow-soft: 0 10px 30px -18px rgba(0, 0, 0, 0.55);
    --shadow-medium: 0 26px 55px -28px rgba(0, 0, 0, 0.85);
    --shadow-glow: 0 20px 60px -24px rgba(52, 209, 180, 0.35);
    --shadow-blue-glow: 0 18px 45px -16px rgba(0, 71, 186, 0.75);

    /* --- Motion --- */
    --ease-smooth: cubic-bezier(0.22, 0.61, 0.36, 1);
    --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
    --dur-fast: 0.25s;
    --dur-mid: 0.4s;
    --dur-slow: 0.7s;
}