/* Reset et base */
* { margin:0; padding:0; box-sizing:border-box; }

html, body {
    height: 100%;
}

body { 
    font-family:'Roboto', sans-serif; 
    background:#0d1117; 
    color:#e1e4e8; 
    line-height:1.6; 
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Header et navigation */
header { 
    background:#161b22; 
    padding:15px 50px; 
    display:flex; 
    justify-content:space-between; 
    align-items:center; 
}

header h1 { color:#58a6ff; }

nav a { 
    color:#e1e4e8; 
    margin-left:25px; 
    text-decoration:none; 
    font-weight:700; 
}

nav a:hover { color:#58a6ff; }

/* Hero */
.hero { 
    height: 400px;
    background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), 
                url('/img/image.png') center/cover no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    color: #fff;
    text-shadow: 2px 2px 10px #000;
}

.hero h2 { font-size:2.8em; margin-bottom:20px; }
.hero a { 
    padding:12px 25px; 
    background:#58a6ff; 
    color:#0d1117; 
    border-radius:8px; 
    text-decoration:none; 
    font-weight:700; 
}

.hero a:hover { background:#1f6feb; }

/* Main et sections */
main { flex: 1; } /* pousse le footer en bas si contenu trop court */

section { padding:50px; max-width:1200px; margin:auto; }

h3 { color:#58a6ff; text-align:center; margin-bottom:40px; }

/* Cards */
.grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(250px,1fr)); gap:30px; }

.card { 
    background:#161b22; 
    padding:25px; 
    border-radius:12px; 
    box-shadow:0 5px 15px rgba(0,0,0,0.5); 
}

.card h4 { color:#79c0ff; margin-bottom:15px; }

/* Honor code */
ul.honor-code { 
    list-style:none; 
    padding-left:0; 
    line-height:1.8; 
    max-width:900px; 
    margin:40px auto 0; 
}

/* Contact buttons */
.contact-buttons { display:flex; flex-wrap:wrap; justify-content:center; gap:15px; margin-top:20px; }

a.button { 
    display:inline-block; 
    padding:12px 25px; 
    background:#58a6ff; 
    color:#0d1117; 
    border-radius:8px; 
    text-decoration:none; 
    font-weight:700; 
}

a.button:hover { background:#1f6feb; }

/* Footer */
footer { 
    background:#161b22; 
    text-align:center; 
    padding:30px; 
    color:#58a6ff; 
    margin-top:auto; /* pousse le footer en bas si contenu trop court */
}

/* Responsive */
@media(max-width:600px){
    .hero h2{font-size:2em;} 
    header{flex-direction:column;align-items:flex-start;} 
    nav{margin-top:10px;} 
    nav a{margin-left:0;margin-right:15px;} 
}

/* CSS FooterLink */
footer a.footer-link {
    color: white;
    text-decoration: none;
}

footer a.footer-link:hover {
    color: #58a6ff;
}


/* CSS aboutlink */
a.about-link {
    color: white;
    text-decoration: none;
}

a.about-link:hover {
    color: #58a6ff;
}