.projects-slider-block {
position: relative;
overflow: hidden;
}
.projects-slider-block h2 {
line-height: 1.1;
letter-spacing: -0.02em;
}
.projects-slider-block .projects-slider-container {
position: relative;
}
.projects-slider-block .projects-slider-container .project-slide {
padding: 0 10px;
}
.projects-slider-block .projects-slider-container .project-slide .project-card {
height: 100%;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.projects-slider-block .projects-slider-container .project-slide .project-card .project-image-container {
position: relative;
overflow: hidden;
}
.projects-slider-block .projects-slider-container .project-slide .project-card .project-image-container img {
transition: transform 0.3s ease;
}
.projects-slider-block .projects-slider-container .project-slide .project-card .project-content h3 {
line-height: 1.3;
margin-bottom: 0.75rem;
}
.projects-slider-block .projects-slider-container .project-slide .project-card .project-content p {
line-height: 1.6;
color: #6b7280;
}
.projects-slider-block .projects-slider-container .project-slide .project-card .project-content a {
transition: all 0.2s ease;
}
.projects-slider-block .slick-slider {
position: relative;
}
.projects-slider-block .slick-slider .slick-list {
overflow: visible;
margin: 0 -15px;
}
.projects-slider-block .slick-slider .slick-track {
display: flex;
align-items: stretch;
}
.projects-slider-block .slick-slider .slick-slide {
height: auto;
}
.projects-slider-block .slick-slider .slick-slide > div {
height: 100%;
}
@media (max-width: 1024px) {
.projects-slider-block .projects-slider-container .projects-slider .project-slide {
padding: 0 10px;
}
}
@media (max-width: 768px) {
.projects-slider-block .projects-slider-container .projects-slider .project-slide {
padding: 0 8px;
}
}
.projects-slider-block.animate-in .projects-slider-container {
animation: slideUpFade 0.8s ease-out;
}
.projects-slider-block.slider-loading .projects-slider-container {
opacity: 0.7;
pointer-events: none;
}
@keyframes slideUpFade {
0% {
opacity: 0;
transform: translateY(30px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.slider-loading .projects-slider {
position: relative;
}
.slider-loading .projects-slider::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
animation: shimmer 1.5s infinite;
}
@keyframes shimmer {
0% {
transform: translateX(-100%);
}
100% {
transform: translateX(100%);
}
}