/* WHAT WE DO */ .swipecontainer .section-title { text-align: center; margin: 10px 0px; } .swipecontainer .section-title h2 { margin: 0px 0px; } .swipecontainer .section-title p { font-size: 1.1rem; margin-top: 10px; margin-bottom: 50px; } .swipecontainer { width: 100%; overflow: hidden; background-color: #f8f9fa; margin: 50px 0px; padding: 40px 0px; } .swiper { display: flex; justify-content: center; } .swiper-wrapper { width: 100%; transition-timing-function: linear !important; } .swiper-slide { position: relative; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: grab; max-width: 300px; height: 300px; user-select: none; } .swiper-slide:hover { border-radius: 20px; transform: scale(1.05); box-shadow: 0 6px 15px rgba(0, 0, 0, 0.5); } .swiper-slide img { border-radius: 20px; width: 300px; height: 300px; object-fit: cover; pointer-events: none; border-radius: 12px; } .caption { position: absolute; left: 0; bottom: -2px; max-width: 100%; height: 60px; background-color: rgba(0, 0, 0, 0.7); color: #fff; font-weight: bold; display: flex; justify-content: space-between; align-items: center; padding: 10px; transform: translateY(100%); transition: transform 0.5s ease; } .swiper-slide:hover .caption { transform: translateY(0); } .caption h1 { font-size: 1rem; letter-spacing: 0.5px; margin: auto; } .caption p { font-size: 0.9rem; margin: 0; color: #ccc; } @keyframes pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } } @media (max-width: 768px) { .swipecontainer .section-title h2 { font-size: 2.5rem; } } /* FEATURED PROJECTS */ .featured-projects-container { display: flex; justify-content: space-between; align-items: center; padding: 20px; max-width: 100%; } .image-slider { width: 60%; } .image-slider .slick-slide { background-size: cover; background-position: center; width: 100%; display: flex; justify-content: center; gap: 30px; } .image-slider img { width: 300px; height: 300px; object-fit: cover; } .content-slider { width: 35%; padding: 10px; background-color: white; border-radius: 8px; height: 300px; overflow: hidden; } .content-slider .slick-content { max-width: 100%; display: flex; justify-content: center; } .content-slider .slide { height: 100%; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; } .content-slider .slide h2 { font-size: 2rem; color: #000; margin-bottom: 10px; } .slide { max-width: 100%; } .content-slider .slide p { font-size: 17px; color: #333; } .content-slider .slick-slide { display: none; opacity: 0; transition: opacity 0.3s ease-in-out; } .content-slider .slick-active { opacity: 1; } /* featured projects section title */ .project-section-title { text-align: center; font-family: "Poppins", serif; margin: 10px 0px; } .project-section-title h2 { margin: 0px 0px; font-size: 3rem; } .project-section-title span { color: #f75d2f; } .project-section-title p { font-size: 1.1rem; margin-top: 10px; margin-bottom: 50px; } .slick-images img { display: flex; justify-content: center; align-items: center; } @media (min-width: 769px) and (max-width: 1400px) { .slick-images img { width: 200px; height: 300px; gap: 80px; } } @media (max-width: 768px) { .featured-projects-container { display: none; } }