@import "https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap";
.carousel-container{background-color:#000;width:100%;height:100vh;font-family:Poppins,sans-serif;position:relative;overflow:hidden}.slide{opacity:0;z-index:0;width:100%;height:100%;transition:opacity .5s ease-in-out;position:absolute;top:0;left:0}.slide.active{opacity:1;z-index:1}.media{object-fit:cover;width:100%;height:100%}.overlay{background:linear-gradient(#0000004d 0%,#0009 100%);width:100%;height:100%;position:absolute;top:0;left:0}.arrow{cursor:pointer;z-index:10;background-color:#00000080;border:none;border-radius:50%;justify-content:center;align-items:center;width:clamp(40px,5vw,50px);height:clamp(40px,5vw,50px);transition:all .3s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.left-arrow{left:clamp(15px,2vw,30px)}.right-arrow{right:clamp(15px,2vw,30px)}.carousel-content{z-index:10;max-width:1000px;position:absolute;top:65%;left:9%;transform:translateY(-50%)}.carousel-title{color:#fff;text-transform:uppercase;text-shadow:2px 2px 10px #00000080;margin-bottom:20px;font-size:50px;font-weight:900;line-height:1.1}.carousel-subtitle{color:#fff;text-transform:lowercase;margin-bottom:30px;font-size:clamp(15px,2vw,20px);font-weight:bolder}.bottom-bar{z-index:10;border-radius:10px;width:90%;max-width:900px;padding:25px 40px;position:absolute;bottom:80px;left:50%;transform:translate(-50%)}.progress-container{flex-wrap:nowrap;justify-content:center;align-items:flex-end;gap:20px;display:flex}.progress-wrapper{cursor:pointer;flex:1}.progress-label{text-transform:uppercase;letter-spacing:1px;color:#fff9;margin-bottom:10px;font-size:14px;font-weight:700;transition:color .3s}.progress-label.active{color:#fff}.progress-bar-bg{background-color:#ffffff4d;border-radius:2px;width:100%;height:4px;overflow:hidden}.progress-bar-fill{background-color:#fff;border-radius:2px;width:0%;height:100%;transition:width .3s}.progress-bar-fill.active{width:100%}@media (max-width:768px){.bottom-bar{display:none}.carousel-title{font-size:clamp(24px,8vw,48px)}.carousel-subtitle{font-size:clamp(14px,4vw,18px)}.arrow{width:clamp(30px,10vw,40px);height:clamp(30px,10vw,40px)}}
.car-showcase{background:#fff;flex-direction:column;align-items:center;width:100%;height:180vh;padding-top:40px;font-family:Lato,sans-serif;display:flex}.car-grid{grid-template-columns:repeat(auto-fit,minmax(500px,1fr));justify-items:center;gap:40px;width:80%;display:grid}.car-card{text-align:center;cursor:pointer;background-color:#f9f9f9;width:600px;height:600px;transition:transform .4s;position:relative;overflow:hidden}.car-card:hover{transform:scale(1.02)}.car-image{object-fit:cover;filter:brightness(90%);width:100%;height:100%;transition:filter .3s}.car-image:hover{filter:brightness(80%)}.car-name{color:#fff;text-shadow:0 2px 6px #0009;font-size:28px;font-weight:700;position:absolute;top:30px;left:50%;transform:translate(-50%)}.car-tagline{color:#fff;text-shadow:0 2px 6px #0009;font-size:16px;font-weight:500;position:absolute;top:70px;left:50%;transform:translate(-50%)}.discover-btn{color:#000;cursor:pointer;background-color:#fff;border:none;border-radius:4px;padding:10px 25px;font-size:16px;font-weight:600;transition:all .3s;position:absolute;top:120px;left:50%;transform:translate(-50%)}.discover-btn:hover{color:#fff;background-color:#000}.car-details{background-color:#f7f7f7;border-radius:20px;align-items:center;gap:40px;width:90%;margin-top:60px;padding:40px;animation:.8s fadeIn;display:flex}.details-image{object-fit:cover;border-radius:20px;width:50%}.details-text{width:50%}.details-text h2{margin-bottom:15px;font-size:32px;font-weight:700}.details-text p{color:#333;font-size:18px;line-height:1.6}@keyframes fadeIn{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.8s fadeIn}@media (max-width:768px){.car-grid{grid-template-columns:1fr}.car-card{width:90%;height:400px}.car-details{flex-direction:column}.details-image,.details-text{width:100%}}
.car-options-container{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;width:80%;margin:80px auto 60px;padding:0 20px;font-family:Poppins,sans-serif;display:flex}.car-option{color:#000;text-transform:lowercase;align-items:center;gap:8px;font-size:28px;font-weight:600;text-decoration:none;transition:color .3s;display:flex;position:relative}.car-option:hover{color:gray}.arrow-icon{stroke-width:1px;margin-left:6px;font-size:42px;transition:transform .3s,color .3s;position:relative;top:3px}.car-option:hover .arrow-icon{color:gray;transform:translate(5px)}.two-line{flex-direction:column;line-height:1.1;display:flex}.bottom-line{align-items:center;gap:6px;display:flex}.inline{font-size:46px;top:2px}@media (max-width:768px){.car-options-container{flex-direction:column;align-items:flex-start;gap:15px}.car-option{font-size:22px}.arrow-icon{font-size:34px}}
.renault-grid{flex-direction:column;align-items:center;gap:20px;margin:40px auto;font-family:Poppins,sans-serif;display:flex}.row{justify-content:center;gap:20px;display:flex}.renault-card{color:#fff;background-position:50%;background-size:cover;transition:transform .3s;position:relative;overflow:hidden}.renault-card.large{width:800px;height:500px}.renault-card.small{width:500px;height:500px}.renault-card:after{content:"";background:linear-gradient(#0000,#0009);width:100%;height:50%;position:absolute;bottom:0;left:0}.card-title{position:absolute;top:20px;left:20px;right:20px}.card-title h3{text-transform:lowercase;color:#fff;margin:0;font-size:42px;font-weight:600;line-height:1.3}.card-icon{position:absolute;bottom:25px;right:25px}.arrow-icon{stroke-width:1px;font-size:34px;transition:transform .3s}@media (max-width:1000px){.row{flex-direction:column}.renault-card.large,.renault-card.small{width:90%;height:400px}.card-title h3{font-size:18px}}
.human-first-container{text-align:center;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;width:100%;height:140vh;padding:20px;display:flex}.human-first-image{width:90%;height:auto;margin-bottom:20px;display:block}.human-first-text{color:#000;text-align:left;max-width:80%;margin-bottom:20px;font-family:Poppins;font-size:30px;font-weight:bolder;line-height:1}.learn-more-btn{color:#fff;background-color:#000;padding:10px 25px;font-family:Poppins;font-size:18px;font-weight:600;text-decoration:none;transition:all .3s}.learn-more-btn:hover{background-color:#333;transform:scale(1.05)}
