/* ===== GENERAL ===== */

body{
    font-family: Arial, sans-serif;
    background:#F7F8FA;
    color:#333;
    margin:0;
    line-height:1.7;
}

h1,h2,h3{
    color:#0B3C5D;
}

a{
    text-decoration:none;
}

/* ===== HEADER ===== */

header{
    background:#0B3C5D;
    color:white;
    text-align:center;
    padding:70px 20px;
}

header h1{
    color:white;
    margin-bottom:10px;
    font-size:3em;
}

header p{
    font-size:1.2em;
}

/* ===== BUTTONS ===== */

.button{
    display:inline-block;
    margin-top:20px;
    background:#4EA5D9;
    color:white;
    padding:14px 28px;
    border-radius:8px;
}

.button:hover{
    background:#3888b5;
}

/* ===== NAVIGATION ===== */

nav{
    background:#2E8B57;
    padding:15px;
    text-align:center;
}

nav a{
    color:white;
    margin:15px;
    font-weight:bold;
}

/* ===== CONTENT ===== */

section{
    max-width:1000px;
    margin:30px auto;
    background:white;
    padding:40px;
    border-radius:10px;
}

/* ===== DISCLAIMER BOX ===== */

.disclaimer{
    max-width:1000px;
    margin:30px auto;
    background:#FFF3CD;
    border-left:6px solid #D4A017;
    padding:25px;
    border-radius:8px;
}

/* ===== CARDS ===== */

.cards{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:20px;
}

.card{
    background:#F3F7FA;
    padding:25px;
    border-radius:10px;
    text-align:center;
}

/* ===== AI BOX ===== */

.ai-box{
    background:#EAF6FF;
    border-left:5px solid #4EA5D9;
    padding:25px;
    border-radius:8px;
}

/* ===== FOOTER ===== */

footer{
    background:#0B3C5D;
    color:white;
    text-align:center;
    padding:40px;
}

footer a{
    color:#9fd3ff;
}

footer p{
    max-width:900px;
    margin:auto;
}

/* ===== MOBILE ===== */

@media(max-width:768px){

header h1{
    font-size:2em;
}

nav a{
    display:block;
    margin:10px;
}

section{
    padding:25px;
}

}