/**
 * Sana Partners - Main Stylesheet
 *
 * @package Sana_Partners
 */

/* ===== FONT FACES ===== */
@font-face {
	font-family: 'Maison Neue';
	src: url('../assets/fonts/MaisonNeueThin.otf') format('opentype');
	font-weight: 100;
	font-style: normal;
}
@font-face {
	font-family: 'Maison Neue';
	src: url('../assets/fonts/MaisonNeueLight.otf') format('opentype');
	font-weight: 300;
	font-style: normal;
}
@font-face {
	font-family: 'Maison Neue';
	src: url('../assets/fonts/MaisonNeueBook.otf') format('opentype');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'Maison Neue';
	src: url('../assets/fonts/MaisonNeueMedium.otf') format('opentype');
	font-weight: 500;
	font-style: normal;
}
@font-face {
	font-family: 'Maison Neue';
	src: url('../assets/fonts/MaisonNeueDemi.otf') format('opentype');
	font-weight: 600;
	font-style: normal;
}
@font-face {
	font-family: 'Maison Neue';
	src: url('../assets/fonts/MaisonNeueBold.otf') format('opentype');
	font-weight: 700;
	font-style: normal;
}
@font-face {
	font-family: 'Maison Neue';
	src: url('../assets/fonts/MaisonNeueExtraBold.otf') format('opentype');
	font-weight: 800;
	font-style: normal;
}
@font-face {
	font-family: 'Maison Neue';
	src: url('../assets/fonts/MaisonNeueBlack.otf') format('opentype');
	font-weight: 900;
	font-style: normal;
}

/* ===== BASE STYLES ===== */
body {
	background-color: #1d1d1d;
	color: #ffffff;
	overflow-x: hidden;
}

/* Smooth scroll */
html {
	scroll-behavior: smooth;
}

/* ===== CUSTOM SCROLLBAR ===== */
::-webkit-scrollbar {
	width: 10px;
}
::-webkit-scrollbar-track {
	background: #1d1d1d;
}
::-webkit-scrollbar-thumb {
	background: #414142;
	border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
	background: #23BAAA;
}

/* ===== ANIMATION KEYFRAMES ===== */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes fadeInLeft {
	from {
		opacity: 0;
		transform: translateX(-30px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes fadeInRight {
	from {
		opacity: 0;
		transform: translateX(30px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes slideDown {
	from {
		opacity: 0;
		transform: translateY(-100px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes rotateCircle {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

@keyframes rotateCircleReverse {
	from { transform: rotate(360deg); }
	to { transform: rotate(0deg); }
}

@keyframes pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.2); }
}

@keyframes bounce {
	0%, 100% { transform: translateY(0) translateX(-50%); }
	50% { transform: translateY(10px) translateX(-50%); }
}

/* ===== ANIMATION CLASSES ===== */
.animate-fadeInUp {
	animation: fadeInUp 0.8s ease-out forwards;
}

.animate-fadeIn {
	animation: fadeIn 0.8s ease-out forwards;
}

.animate-fadeInLeft {
	animation: fadeInLeft 0.6s ease-out forwards;
}

.animate-fadeInRight {
	animation: fadeInRight 0.6s ease-out forwards;
}

.animate-slideDown {
	animation: slideDown 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-rotate {
	animation: rotateCircle 30s linear infinite;
}

.animate-rotate-reverse {
	animation: rotateCircleReverse 25s linear infinite;
}

.animate-bounce {
	animation: bounce 2s ease-in-out infinite;
}

/* ===== ANIMATION DELAYS ===== */
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }
.delay-500 { animation-delay: 0.5s; }
.delay-600 { animation-delay: 0.6s; }
.delay-800 { animation-delay: 0.8s; }
.delay-1000 { animation-delay: 1s; }
.delay-1500 { animation-delay: 1.5s; }

/* ===== SCROLL ANIMATIONS ===== */
.animate-on-scroll {
	opacity: 0;
}

.animate-on-scroll.visible {
	opacity: 1;
}

/* ===== UTILITIES ===== */
.line-clamp-3 {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ===== MOBILE MENU ===== */
#mobile-menu {
	transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-20px);
}

#mobile-menu.open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

#mobile-menu .mobile-nav-link {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

#mobile-menu.open .mobile-nav-link {
	opacity: 1;
	transform: translateY(0);
}

#mobile-menu.open .mobile-nav-link:nth-child(1) { transition-delay: 0.1s; }
#mobile-menu.open .mobile-nav-link:nth-child(2) { transition-delay: 0.15s; }
#mobile-menu.open .mobile-nav-link:nth-child(3) { transition-delay: 0.2s; }
#mobile-menu.open .mobile-nav-link:nth-child(4) { transition-delay: 0.25s; }
#mobile-menu.open .mobile-nav-link:nth-child(5) { transition-delay: 0.3s; }

/* ===== TEAM CARDS ===== */
.team-card {
	transition: transform 0.4s ease;
}

.team-card:hover {
	transform: translateY(-8px);
}

.team-card .team-image {
	transition: transform 0.6s ease, filter 0.6s ease;
}

.team-card:hover .team-image {
	transform: scale(1.05);
	filter: grayscale(0);
}

/* ===== MODALS ===== */
.team-modal {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.team-modal.open {
	opacity: 1;
	visibility: visible;
}

.team-modal .modal-content {
	transform: translateY(20px) scale(0.95);
	transition: transform 0.3s ease;
}

.team-modal.open .modal-content {
	transform: translateY(0) scale(1);
}

/* ===== CONTAINER PADDING ===== */
.container-padding {
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

@media (min-width: 768px) {
	.container-padding {
		padding-left: 3rem;
		padding-right: 3rem;
	}
}

@media (min-width: 1024px) {
	.container-padding {
		padding-left: 4rem;
		padding-right: 4rem;
	}
}

/* ===== BUTTONS ===== */
.btn-primary:hover {
	transform: scale(1.02);
}
.btn-primary:active {
	transform: scale(0.98);
}
