body{

    margin:0;
    font-family:"Segoe UI",sans-serif;
    
    background: linear-gradient(180deg,#020617,#020617,#071226);
    
    color:#e5e7eb;
    
    }
    
    
    
    header{
    
    padding:60px 10%;
    
    }
    
    
    
    .section-title{
    
    color:#ef4444;
    letter-spacing:3px;
    
    }
    
    
    
    .section-main{
    
    font-size:42px;
    font-weight:bold;
    
    background: linear-gradient(90deg,#38bdf8,#ef4444);
    
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    
    }
    
    
    
    .section-sub{
    
    color:#94a3b8;
    margin-top:10px;
    
    }
    
    
    
    .container{
    
    padding:60px 10%;
    
    }
    
    
    
    .chart-section{
    
    background: linear-gradient(135deg,#0f172a,#1f0a0a);
    
    padding:30px;
    
    border-radius:12px;
    
    border:1px solid #3f1d1d;
    
    margin-bottom:40px;
    
    }
    
    
    
    .chart-section h2{
    
    color:#38bdf8;
    margin-bottom:20px;
    
    }
    
    
    
    canvas{
    
    background:#020617;
    
    padding:20px;
    
    border-radius:10px;
    
    }
    
    
    
    .note-section h2{
    
    color:#ef4444;
    
    margin-bottom:20px;
    
    }
    
    
    
    .note-box{
    
    background: linear-gradient(135deg,#0f172a,#1f0a0a);
    
    padding:25px;
    
    border-radius:12px;
    
    border:1px solid #3f1d1d;
    
    }
    
    
    
    .note-box ul{
    
    line-height:1.8;
    
    color:#cbd5e1;
    
    }
    
    
    
    .back-button{
    
    display:inline-block;
    
    margin-top:40px;
    
    padding:12px 25px;
    
    background: linear-gradient(90deg,#0ea5e9,#ef4444);
    
    color:white;
    
    text-decoration:none;
    
    border-radius:8px;
    
    font-weight:bold;
    
    transition:0.3s;
    
    }
    
    
    .back-button:hover{
    
    transform:translateY(-3px);
    
    box-shadow:0 0 10px rgba(239,68,68,0.4);
    
    }