body{margin:0;background:#0b1220;color:#eef2f7;font-family:Poppins,sans-serif}
.wrap{width:97%;max-width:1800px;margin:auto}
.hero{padding:70px 0;background:#101827}
h1{font-size:52px;color:#d4af37;margin-bottom:20px}
.lead{font-size:20px;line-height:1.9;max-width:1500px}
.screen{padding:50px 0}
.screen h2,.features h2,.visual h2{color:#d4af37}
.fullimg{width:100%;height:auto;border:4px solid #d4af37;border-radius:12px;display:block;box-shadow:0 20px 40px rgba(0,0,0,.45)}
.features{padding:60px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.card{background:#162235;padding:25px;border-radius:10px;border:1px solid #2b3c56}
.visual{padding:70px 0;background:#111827}
.placeholder{margin-top:30px;padding:90px;border:3px dashed #d4af37;border-radius:12px;text-align:center;font-size:26px}
@media(max-width:900px){h1{font-size:34px}.lead{font-size:17px}}


.visual{

padding:80px 0;
background:#111827;

}

.visual-text{

font-size:20px;
text-align:center;
margin-bottom:40px;

}

.carousel{

position:relative;
overflow:hidden;

}

.slide{

display:none;

}

.slide.active{

display:block;
animation:fade .5s;

}

.slide img{

width:100%;
border-radius:15px;
border:4px solid #d4af37;
box-shadow:0 20px 50px rgba(0,0,0,.4);

}

.caption{

padding:25px 0;
text-align:center;

}

.caption h3{

color:#d4af37;
font-size:34px;

}

.caption p{

font-size:18px;
color:#ddd;

}

.prev,
.next{

position:absolute;
top:45%;
transform:translateY(-50%);
background:#d4af37;
border:none;
padding:15px 20px;
cursor:pointer;
font-size:28px;
font-weight:bold;
border-radius:8px;

}

.prev{

left:20px;

}

.next{

right:20px;

}

.dots{

text-align:center;
margin-top:20px;

}

.dot{

height:14px;
width:14px;
display:inline-block;
margin:6px;
border-radius:50%;
background:#555;

}

.dot.active{

background:#d4af37;

}

@keyframes fade{

from{

opacity:.2;

}

to{

opacity:1;

}

}


.workspace-slide{
display:none;
}

.workspace-slide.active{
display:block;
animation:fade .5s;
}

.workspace-prev,
.workspace-next{

position:absolute;
top:50%;
transform:translateY(-50%);
background:#d4af37;
color:#000;
border:none;
padding:15px;
cursor:pointer;
font-size:28px;
font-weight:bold;
border-radius:8px;
z-index:999;
}

.workspace-prev{
left:20px;
}

.workspace-next{
right:20px;
}

.workspace-carousel{

position:relative;

}


let wIndex=0;

const wSlides=document.querySelectorAll(".workspace-slide");

function workspaceShow(i){

wSlides.forEach(x=>x.classList.remove("active"));

wSlides[i].classList.add("active");

}

document.querySelector(".workspace-next").onclick=function(){

wIndex++;

if(wIndex>=wSlides.length)
wIndex=0;

workspaceShow(wIndex);

}

document.querySelector(".workspace-prev").onclick=function(){

wIndex--;

if(wIndex<0)
wIndex=wSlides.length-1;

workspaceShow(wIndex);

}

setInterval(function(){

wIndex++;

if(wIndex>=wSlides.length)
wIndex=0;

workspaceShow(wIndex);

},4000);