.about-section{

padding:170px 8%;

background:#090909;

position:relative;

overflow:hidden;

}


.container{

max-width:1400px;

margin:auto;

}


.dashboard{

background:#101010;

border:1px solid rgba(255,212,0,.12);

border-radius:25px;

padding:60px;

box-shadow:

0 0 80px rgba(255,212,0,.05);

}


.dashboard-header{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:70px;

}


.dashboard-label{

color:#FFD400;

letter-spacing:4px;

font-size:.8rem;

}


.dashboard-header h2{

font-size:3rem;

margin-top:15px;

}


.status-box{

display:flex;

align-items:center;

gap:15px;

padding:12px 22px;

border:1px solid rgba(255,212,0,.2);

border-radius:40px;

color:#FFD400;

font-size:.85rem;

}


.status-light{

width:12px;

height:12px;

background:#FFD400;

border-radius:50%;

animation:blink 1.4s infinite;

}


.dashboard-body{

display:grid;

grid-template-columns:1.4fr .8fr;

gap:80px;

}


.intro{

font-size:1.4rem;

margin-bottom:10px;

}


.dashboard-left h3{

font-size:3.2rem;

color:#FFD400;

margin-bottom:30px;

}


.dashboard-left p{

font-size:1.05rem;

line-height:2;

margin-bottom:30px;

color:#d8d8d8;

}


.monitor{

background:#050505;

border:1px solid rgba(255,212,0,.15);

border-radius:20px;

padding:30px;

}


.monitor-title{

color:#FFD400;

margin-bottom:30px;

letter-spacing:3px;

}


.monitor-item{

display:flex;

justify-content:space-between;

padding:18px 0;

border-bottom:1px solid rgba(255,255,255,.05);

}


.monitor-item strong{

color:#FFD400;

}


@keyframes blink{

50%{

opacity:.25;

}

}
.monitor-item{

opacity:0;

transform:translateX(40px);

transition:.7s;

}
.monitor{
    position:relative;
    overflow:hidden;
}

.neural-network{

    position:absolute;
    inset:0;
    pointer-events:none;

}

.node{

    position:absolute;

    width:6px;
    height:6px;

    background:#FFD400;

    border-radius:50%;

    animation:pulseNode 2s infinite;

}

.n1{top:18%;left:12%;}
.n2{top:38%;right:18%;}
.n3{bottom:32%;left:30%;}
.n4{bottom:12%;right:12%;}

.node::after{

    content:"";

    position:absolute;

    width:140px;
    height:1px;

    background:linear-gradient(90deg,#FFD400,transparent);

    left:100%;
    top:50%;

}

@keyframes pulseNode{

0%,100%{

transform:scale(1);

opacity:.4;

}

50%{

transform:scale(2);

opacity:1;

}

}
