/* ========================================
   UTCB Admitere – CSS Custom Properties
   ======================================== */

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&family=Roboto+Slab:wght@400;500;600;700&display=swap');

:root {
    /* ── Brand Colors ── */
    --color-primary: #84C441;
    --color-primary-strong: #76B63A;
    --color-primary-soft: #EAF6D9;
    --color-primary-glow: rgba(132, 196, 65, 0.15);

    --color-secondary: #41576D;
    --color-secondary-soft: #EAF0F5;
    --color-secondary-light: #5C7184;

    /* ── Surfaces ── */
    --color-bg: #F7FAFC;
    --color-bg-alt: #EFF4F8;
    --color-surface: #FFFFFF;
    --color-surface-glass: rgba(255, 255, 255, 0.65);
    --color-surface-glass-strong: rgba(255, 255, 255, 0.85);

    /* ── Borders ── */
    --color-border: rgba(65, 87, 109, 0.10);
    --color-border-strong: rgba(65, 87, 109, 0.18);

    /* ── Text ── */
    --color-text: #243746;
    --color-text-soft: #5C7184;
    --color-text-inverse: #FFFFFF;
    --color-text-heading: #1A2D3D;

    /* ── Gradients ── */
    --gradient-hero: linear-gradient(165deg, #F7FAFC 0%, #EAF6D9 35%, #EFF4F8 70%, #FFFFFF 100%);
    --gradient-cta: linear-gradient(135deg, #84C441 0%, #76B63A 100%);
    --gradient-card: linear-gradient(180deg, #FFFFFF 0%, #F7FAFC 100%);
    --gradient-section-alt: linear-gradient(180deg, #F7FAFC 0%, #FFFFFF 100%);
    --gradient-footer: linear-gradient(180deg, #41576D 0%, #2D3E4F 100%);

    /* ── Typography ── */
    --font-body: 'Roboto', sans-serif;
    --font-heading: 'Roboto Slab', serif;

    --fs-xs: 0.75rem;
    /* 12px */
    --fs-sm: 0.875rem;
    /* 14px */
    --fs-base: 1rem;
    /* 16px */
    --fs-md: 1.0625rem;
    /* 17px */
    --fs-lg: 1.15rem;
    /* ~18px */
    --fs-xl: 1.35rem;
    /* ~22px */
    --fs-2xl: 1.75rem;
    /* 28px */
    --fs-3xl: 2.2rem;
    /* ~35px */
    --fs-4xl: 2.75rem;
    /* 44px */
    --fs-5xl: 3.15rem;
    /* ~50px */

    /* ── Spacing ── */
    --space-xs: 0.5rem;
    --space-sm: 0.75rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;
    --space-2xl: 2.5rem;
    --space-3xl: 3.5rem;
    --space-4xl: 5rem;
    --space-5xl: 6.5rem;

    /* ── Border Radius ── */
    --radius-sm: 14px;
    --radius-md: 20px;
    --radius-lg: 24px;
    --radius-xl: 28px;
    --radius-full: 999px;

    /* ── Shadows ── */
    --shadow-sm: 0 4px 12px rgba(21, 35, 49, 0.04);
    --shadow-md: 0 8px 24px rgba(21, 35, 49, 0.06);
    --shadow-lg: 0 16px 40px rgba(21, 35, 49, 0.08);
    --shadow-xl: 0 24px 70px rgba(21, 35, 49, 0.12);
    --shadow-glow: 0 0 40px rgba(132, 196, 65, 0.15);

    /* ── Transitions ── */
    --transition-fast: 180ms ease;
    --transition-base: 260ms ease;
    --transition-slow: 420ms ease;
    --transition-spring: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);

    /* ── Layout ── */
    --container-max: 1280px;
    --container-wide: 1480px;
    --header-height: 80px;
    --header-top-height: 40px;
}
