@font-face {
    font-family: "bootstrap-icons";
    src: url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/fonts/bootstrap-icons.woff2") format("woff2"),
         url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/fonts/bootstrap-icons.woff") format("woff");
    font-display: swap;
}

:root {
    --bs-font-sans-serif: 'Inter', sans-serif;
    --bs-heading-font: 'Montserrat', sans-serif;
    --accent-color: #ffc107;
    --accent-hover: #ffca2c;
}

body {
    font-family: var(--bs-font-sans-serif);
}

h1, h2, h3, h4, h5, h6, .navbar-brand {
    font-family: var(--bs-heading-font);
    letter-spacing: -0.5px;
}

.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2) !important;
}

footer a.text-decoration-none {
    transition: color 0.2s;
}

footer a.text-decoration-none:hover {
    color: var(--accent-color) !important;
}

.swiper-pagination-bullet-active {
    background-color: var(--accent-color) !important;
}

.swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    margin: 0 12px !important;
}

.hero-img {
    filter: contrast(1.1);
    height: 75vh;
    max-height: 800px;
    min-height: 500px;
}

@media (max-width: 768px) {
    .hero-img { height: 55vh; min-height: 450px; }
}

.hero-overlay-gradient {
    background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.8) 100%);
}

section {
    scroll-margin-top: 80px;
}

html {
    scroll-behavior: smooth;
}

.navbar-nav .nav-link.active {
    color: var(--bs-primary);
    font-weight: 600;
}

.hero-min-vh-80 {
    min-height: 80vh;
}

.ratio-2x1 {
    --bs-aspect-ratio: 50%;
}

.line-clamp-3, .line-clamp-4, .line-clamp-5 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 { 
    -webkit-line-clamp: 3; 
    line-clamp: 3; 
}
.line-clamp-4 { 
    -webkit-line-clamp: 4; 
    line-clamp: 4; 
}
.line-clamp-5 { 
    -webkit-line-clamp: 5; 
    line-clamp: 5; 
}

.alert-fade-in {
    animation: fadeInError 0.4s ease-out;
}

@keyframes fadeInError {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

.hover-shadow:hover {
    transform: translateY(-3px);
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.transition-all {
    transition: all 0.2s ease-in-out;
}