*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:tahoma;
}

body{

height:100vh;
display:flex;
flex-direction:column;
justify-content:space-between;
align-items:center;

background:url("assets/background.jpg");
background-size:cover;
background-position:center;

color:white;
text-align:center;

overflow:hidden;
}



body::before{
content:"";
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.55);
z-index:-1;
}



header{
margin-top:40px;
}

.main-logo{
width:170px;
}



main{
padding:20px;
}

h1{
font-size:60px;
color:#ffcc00;
margin-bottom:20px;
}

.phones{

font-size:22px;
line-height:40px;

background:rgba(0,0,0,0.45);

padding:15px 30px;

border-radius:10px;

border:2px solid #ffcc00;

}



footer{
margin-bottom:40px;
}

.brands{
display:flex;
gap:40px;
}

.brands img{
width:90px;
opacity:0.8;
transition:0.3s;
}

.brands img:hover{
opacity:1;
transform:scale(1.1);
}



.cursor-light{

position:fixed;

width:300px;
height:300px;

border-radius:50%;

pointer-events:none;

background:radial-gradient(circle,
rgba(255,204,0,0.35) 0%,
rgba(255,0,0,0.15) 40%,
transparent 70%);

transform:translate(-50%,-50%);
}



@media (max-width:768px){

h1{
font-size:40px;
}

.main-logo{
width:130px;
}

.brands{
gap:20px;
}

.brands img{
width:60px;
}

.phones{
font-size:18px;
}

.cursor-light{
width:200px;
height:200px;
}

}