@font-face {
	font-family: 'SansMateo2-Regular';
	src: url('../fonts/SansMateo/SansMateo2-Regular.woff2') format('woff2'),
		 url('../fonts/SansMateo/SansMateo2-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SansMateo2-SemiBold';
	src: url('../fonts/SansMateo/SansMateo2-SemiBold.woff2') format('woff2'),
		 url('../fonts/SansMateo/SansMateo2-SemiBold.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SansMateo2-Bold';
	src: url('../fonts/SansMateo/SansMateo2-Bold.woff2') format('woff2'),
		 url('../fonts/SansMateo/SansMateo2-Bold.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SansMateo2-Italic';
	src: url('../fonts/SansMateo/SansMateo2-Italic.woff2') format('woff2'),
		 url('../fonts/SansMateo/SansMateo2-Italic.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

html {
  	scroll-behavior: smooth;
}

body {
    font-family: 'SansMateo2-Regular', sans-serif;
    min-height: 100vh;
    background: linear-gradient(135deg, #111827 0%, #300000 100%);
    color: #f3f4f6; /* Light text on dark background */
    scroll-behavior: smooth;
}


/* Glassmorphism Effect for Cards */
.glass-card {
    background-color: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

/* Custom scrollbar for better aesthetics */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-thumb {
    background: rgba(128, 0, 0, 0.6);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(128, 0, 0, 0.8);
}

/* CSS for Continuous Logo Marquee */
@keyframes scroll-logos {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); } /* Scroll half the content width */
}
.marquee-container {
    overflow: hidden;
    width: 100%;
}
.marquee-content {
    display: flex;
    width: 200%; /* Double width for seamless loop */
    animation: scroll-logos 30s linear infinite;
}
.logo-item {
    flex-shrink: 0;
    width: 12.5%; /* Assuming 8 visible logos at a time for 100% width */
}