@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

*{
    margin:0;
    padding:0;
}

body{
    font-family: 'Inter', sans-serif;
}

.slider {
  width: 100%;
  height: clamp(400px, 70vh, 800px);
  position: relative;
  background: black;
}

.slider-background{
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(30%);
}

.slider-content{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

h1{
    color: white;
    font-size: 5rem;
}

h2{
    font-size: 3rem;
    margin-bottom: 50px;
}

p{
    font-size: 1.5rem;
    line-height: 1.5em;
}

.slider-content p{
    color: white;
    font-size: 2rem;
    font-weight: 300;
}

.section{
    padding: 100px 0;
}

.boxed{
    max-width: 1280px;
    margin-inline: auto;
}

.flex{
    display: flex;
    flex-wrap: nowrap;
}

.dark{
    background:black ;
    color: #fff;
}

.w30{
    width: 30%;
}

.w32{
    width: 32%;
}

.w40{
    width: 40%;
}

.w50{
    width: 50%;
}

.w60{
    width: 60%;
}

.space-between{
    justify-content: space-between;
}

.gap50{
    gap: 50px;
}


.text-center{
    text-align: center;
}

.skill{
    background: #fff;
    border-radius: 15px;
    padding: 20px;
    box-sizing: border-box;
}

.skill img{
    width: 250px;
    height: 250px;
    object-fit: cover;
    border-radius: 15px;
}

.skill h3{
    color: #000;
    margin-top: 20px;
    font-size: 1.2rem;
}

.realisation{
    height: auto;
    aspect-ratio: 1/1;
}

.realisation a{
    display: block;
    width: 100%;
    height: 100%;
}

.realisation img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.icon{
    display: block;
    font-size: 40px !important;
}

.label{
    display: block;
    font-weight: 700;
    text-transform: uppercase;
    margin: 10px 0;
    font-size: 1.5rem;
}

.value{
    display: block;
    font-size: 1.2rem;
}

.contact{
    border: 2px dashed black;
    border-radius: 15px;
    padding: 15px;
    box-sizing: border-box;
}