/* CSS Variables for Colors */
:root {
    --primary: #027a33;
    --brand-red: #d60606;
    --brand-gold-1: #f7e889;
    --brand-gold-2: #e6b863;
    --brand-gold-3: #8f5d22;
    --background-light: #f5f8f7;
    --background-dark: #0f2317;
    --text-light: #0c1c13;
    --text-dark: #e6f4ec;
    --red-accent: #d60606;
    --gold-1: #f7e889;
    --gold-2: #e6b863;
    --gold-3: #8f5d22;
}

/* Blob Styles */
.blob1 {
    position: absolute;
    top: -15%;
    left: -15%;
    width: 50%;
    height: 60%;
    background: radial-gradient(
        circle,
        rgba(2, 122, 51, 0.08) 0%,
        rgba(2, 122, 51, 0) 70%
    );
    z-index: 0;
}

.blob2 {
    position: absolute;
    bottom: -15%;
    right: -15%;
    width: 50%;
    height: 60%;
    background: radial-gradient(
        circle,
        rgba(214, 6, 6, 0.05) 0%,
        rgba(214, 6, 6, 0) 70%
    );
    z-index: 0;
}

/* Background styles */
.bg-brand-gold-3\/80 {
    background-color: rgb(230 184 99 / 0.8);
}
.bg-brand-gold-1\/20 {
    background-color: rgb(247 232 137 / 0.2);
}
.bg-brand-red\/10 {
    background-color: rgb(214 6 6 / 0.1);
}
.bg-background-dark {
    --tw-bg-opacity: 1;
    background-color: rgb(15 35 23 / var(--tw-bg-opacity, 1));
}
.bg-gold-2\/50 {
    background-color: rgb(230 184 99 / 0.5);
}
.bg-primary\/5 {
    background-color: rgb(2 120 61 / 0.05);
}
.bg-primary\/10 {
    background-color: rgb(2 121 51 / 0.1);
}
.bg-primary\/20 {
    background-color: rgb(2 120 55 / 0.2);
}
.bg-primary\/90 {
    background-color: rgb(2 122 51 / 0.9);
}

/* Border Styles */
.border-primary\/20 {
    border-color: rgb(2 120 61 / 0.2);
}

/* Timeline Styles */
.timeline-item::before {
    content: "";
    position: absolute;
    top: 10px;
    left: -32.5px;
    width: 25px;
    height: 25px;
    border-radius: 9999px;
    background-color: #e6b863; /* gold-2 */
    border: 4px solid #f5f8f7; /* background-light */
}
.dark .timeline-item::before {
    border-color: #0f2317; /* background-dark */
}
.timeline-item:hover::before {
    background-color: #027933; /* primary */
}

/* Text styles */
.text-red-accent {
    --tw-text-opacity: 1;
    color: rgb(214 6 6 / var(--tw-text-opacity, 1));
}
.text-text-light\/70 {
    color: rgb(31 41 55 / 0.7);
}
