/* Misma Paleta de Colores Natural */
:root {
    --color-forest: #3f4f28;
    --color-moss: #6a7f38;
    --color-sand: #e8dcca;
    --color-light: #f4f4f4;
}

body {
    font-family: 'Montserrat', sans-serif;
    background-color: #ffffff;
    color: #4a4a4a;
}
h1, h2, h3, h4, .serif-font {
    font-family: 'Cormorant Garamond', serif;
    color: var(--color-forest);
}
.text-forest { color: var(--color-forest); }
.text-moss { color: var(--color-moss); }
.bg-forest { background-color: var(--color-forest); }
.bg-moss { background-color: var(--color-moss); }
.bg-sand { background-color: var(--color-sand); }

.hover-text-moss:hover { color: var(--color-moss); }
.hover-bg-moss:hover { background-color: var(--color-moss); }

/* Custom smooth scroll */
html {
    scroll-behavior: smooth;
}

/* Custom Scrollbar hide for horizontal scroll */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Estilo para la Sidebar Sticky */
.sticky-sidebar {
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 120px; /* Ajuste para que no choque con el header */
}

/* Timeline Connector */
.timeline-line::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 19px;
    width: 1px;
    background-color: var(--color-sand);
    z-index: 0;
}