:root {
    /*====================================
      Colors
    ====================================*/

    /* --color-primary: #d4af37; */
    --color-primary: #b99253;
    --color-primary-light: #e8c867;
    --color-primary-dark: #a67c00;
    --bg-section: linear-gradient(180deg, #0b0b0b, #111111);

    --color-bg: #090909;
    --color-surface: #111111;
    --color-card: #151515;

    --color-border: rgba(212, 175, 55, 0.18);

    --color-text: #ffffff;
    --color-text-light: #d6d6d6;
    --color-text-muted: #8e8e8e;

    --color-success: #30c67c;
    --color-danger: #f04444;

    /*====================================
      Typography
    ====================================*/

    --font-primary: "Poppins", sans-serif;
    --font-heading: "Playfair Display", serif;

    /* Website default fonts  */
    /* --font-primary: "Jost", sans-serif;
    --font-heading: "Cormorant Garamond", serif; */

    --fs-xs: 12px;
    --fs-sm: 14px;
    --fs-md: 16px;
    --fs-lg: 18px;
    --fs-xl: 22px;
    --fs-2xl: 30px;
    --fs-3xl: 42px;
    --fs-4xl: 56px;

    /*====================================
      Font Weight
    ====================================*/

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

    /*====================================
      Radius
    ====================================*/

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-xl: 28px;

    /*====================================
      Shadows
    ====================================*/

    --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.25);

    --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.35);

    --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.45);

    /*====================================
      Transition
    ====================================*/

    --transition: 0.35s ease;

    /*====================================
      Container
    ====================================*/

    --container-width: 1240px;
}

/*====================================
    Common Section Spacing
====================================*/

.section-padding {
    padding: 80px 0;
}

/* Large Desktop */
@media (min-width: 1400px) {
    .section-padding {
        padding: 100px 0;
    }
}

/* Laptop */
@media (max-width: 1199px) {
    .section-padding {
        padding: 75px 1rem;
    }
}

/* Tablet */
@media (max-width: 991px) {
    .section-padding {
        padding: 65px 1rem;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .section-padding {
        padding: 55px 1rem;
    }
}

/* Small Mobile */
@media (max-width: 575px) {
    .section-padding {
        padding: 45px 1rem;
    }
}