
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#111;background:#fff}
header{background:#050505;padding:15px 6%;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}
.logo img{height:95px;width:auto}
nav a{color:#fff;text-decoration:none;margin:8px;font-weight:bold}
nav a:hover{color:#c8102e}
.hero{background:linear-gradient(135deg,#111,#c8102e);color:#fff;text-align:center;padding:100px 7%}
.hero h1{font-size:52px;line-height:1.1}
.btn{display:inline-block;background:#c8102e;color:white;padding:15px 30px;text-decoration:none;font-weight:bold}
section{padding:60px 7%}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:25px}
.gallery{width:100%;height:260px;object-fit:cover;border-radius:8px}
.card{border:1px solid #ddd;padding:30px;text-align:center;font-weight:bold;border-radius:8px}
footer{background:#050505;color:white;text-align:center;padding:35px}
@media(max-width:700px){.hero h1{font-size:34px}}

.event-feature{
display:grid;
grid-template-columns:1fr 1fr;
gap:35px;
align-items:center;
margin-top:40px;
}
.event-feature img{
width:100%;
max-width:500px;
border-radius:10px;
}
.event-feature h2{
font-size:32px;
}
@media(max-width:700px){
.event-feature{grid-template-columns:1fr;}
}

.school-feature{
display:grid;
grid-template-columns:1fr 1fr;
gap:35px;
align-items:center;
margin-top:40px;
}
.school-feature img{
width:100%;
max-width:450px;
border-radius:10px;
object-fit:cover;
}
.school-feature h2{
font-size:32px;
}
@media(max-width:700px){
.school-feature{grid-template-columns:1fr;}
}

.project-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:30px;
margin-top:35px;
}
.project-card{
background:#fff;
border:1px solid #ddd;
border-radius:12px;
overflow:hidden;
box-shadow:0 3px 10px rgba(0,0,0,.08);
}
.project-card img{
width:100%;
height:300px;
object-fit:cover;
}
.project-card h3{
padding:15px;
text-align:center;
margin:0;
}

.card a{text-decoration:none;color:inherit}
.hero p{font-size:20px}
section h2{font-size:34px}

.quote-box{
max-width:800px;
margin:auto;
background:#fff;
padding:40px;
border-radius:12px;
box-shadow:0 4px 15px rgba(0,0,0,.1);
}
.form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
}
.quote-box input,.quote-box select,.quote-box textarea{
width:100%;
padding:14px;
margin:10px 0;
border:1px solid #ccc;
border-radius:6px;
font-size:16px;
}
.quote-box textarea{height:180px}
@media(max-width:700px){
.form-row{grid-template-columns:1fr}
}

.card{
background:#fff;
border-radius:12px;
padding:35px;
box-shadow:0 4px 15px rgba(0,0,0,.1);
margin:30px auto;
max-width:600px;
}

.contact-section{
padding:60px 7%;
text-align:center;
}
.contact-grid{
display:flex;
justify-content:center;
gap:30px;
flex-wrap:wrap;
margin-top:40px;
}
.contact-card{
background:#111;
color:#fff;
width:350px;
padding:35px;
border-radius:12px;
}
.contact-card h2{
color:#d71920;
}
.contact-card p{
color:#fff;
line-height:1.6;
}

footer{
padding:40px 7%;
text-align:center;
}
.footer-cta{
margin-top:15px;
font-size:18px;
}
.footer-cta a{
color:#d71920;
text-decoration:none;
font-weight:bold;
}

.hero h1{
    font-size:38px;
}
@media(max-width:700px){
    .hero h1{
        font-size:28px;
    }
}

section{
    scroll-margin-top:20px;
}
.hero{
    padding-top:80px;
    padding-bottom:80px;
}
h1,h2,h3{
    letter-spacing:.3px;
}
