/* ==========================================================
   LATUNIT DESIGN SYSTEM
   Premium Brass Architecture
   Version 1.0
========================================================== */

:root {

    /* =======================================================
       COLORS
       ======================================================= */

    --color-primary: #111111;
    --color-secondary: #1A1A1A;
    --color-background: #F6F4F0;
    --color-surface: #FFFFFF;

    --color-brass: #B38B45;
    --color-brass-light: #D2B06D;
    --color-brass-dark: #8E6A32;

    --color-text: #242424;
    --color-text-light: #6F6F6F;

    --color-border: #E8E4DD;

    --color-white: #FFFFFF;
    --color-black: #000000;

    /* =======================================================
       TYPOGRAPHY
       ======================================================= */

    --font-title: "Cormorant Garamond", serif;
    --font-text: "Manrope", sans-serif;

    /* =======================================================
       FONT SIZE
       ======================================================= */

    --fs-12: 12px;
    --fs-14: 14px;
    --fs-16: 16px;
    --fs-18: 18px;
    --fs-22: 22px;
    --fs-28: 28px;
    --fs-40: 40px;
    --fs-56: 56px;
    --fs-72: 72px;

    /* =======================================================
       FONT WEIGHT
       ======================================================= */

    --fw-light: 300;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;

    /* =======================================================
       CONTAINER
       ======================================================= */

    --container-width: 1400px;
    --container-padding: 20px;

    /* =======================================================
       BORDER
       ======================================================= */

    --radius-small: 8px;
    --radius-medium: 16px;
    --radius-large: 30px;

    /* =======================================================
       SHADOW
       ======================================================= */

    --shadow-small: 0 8px 25px rgba(0,0,0,.06);
    --shadow-medium: 0 20px 50px rgba(0,0,0,.08);
    --shadow-large: 0 30px 80px rgba(0,0,0,.12);

    /* =======================================================
       TRANSITION
       ======================================================= */

    --transition-fast: .2s;
    --transition: .35s;
    --transition-slow: .6s;

}