
*{box-sizing:border-box}html{scroll-behavior:smooth}
:root{
  --bg:#0e0e11; --card:#15151a; --alt:#101015; --text:#e9e9f1; --muted:#b9b9c8;
  --brand:#e63946; --brand2:#457b9d; --border:#23232a; --shadow:0 10px 30px rgba(0,0,0,.35);
  --container:1100px
}
body{margin:0; font-family:Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Helvetica, Arial, sans-serif; color:var(--text); background:var(--bg);}
img{max-width:100%; display:block}
.container{width:100%; max-width:var(--container); margin:0 auto; padding:0 20px}
.muted{color:var(--muted)}
.spacer{height:16px}

/* Header */
.site-header{position:sticky; top:0; z-index:50; background:rgba(16,16,21,.85); backdrop-filter:saturate(1.2) blur(8px); border-bottom:1px solid var(--border)}
.header-inner{display:flex; align-items:center; justify-content:space-between; min-height:64px; gap:16px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--text)}
.logo{width:36px; height:36px; border-radius:6px; box-shadow:var(--shadow)}
.brand-title{font-weight:800; letter-spacing:.2px}
.nav{display:flex; gap:18px}
.nav a{color:var(--muted); text-decoration:none; font-weight:700; padding:10px 8px; border-radius:8px}
.nav a:hover{color:var(--text); background:var(--card)}

.burger{display:none; background:none; border:0; cursor:pointer}
.burger span{display:block; width:24px; height:2px; background:var(--text); margin:5px 0; transition:.2s}

/* Hero */
.hero{position:relative; min-height:60vh; display:grid; place-items:center; text-align:center}
.hero-bg{position:absolute; inset:0; background-position:center; background-size:cover; transform:scale(1.02); filter:saturate(1.05)}
.hero .container{position:relative; z-index:2}
.hero-content{padding:80px 0}
.hero h1{font-size:clamp(28px,5vw,56px); margin:0 0 12px}
.hero p{color:var(--muted); margin:0 0 16px; font-size:clamp(14px,2.2vw,18px)}
.btn{display:inline-block; padding:10px 16px; border-radius:10px; text-decoration:none; font-weight:800; border:1px solid var(--border)}
.btn.primary{background:linear-gradient(135deg,var(--brand),var(--brand2)); color:white; border-color:transparent}

/* Sections */
.section{padding:64px 0; background:var(--bg)}
.section.alt{background:var(--alt); border-top:1px solid var(--border); border-bottom:1px solid var(--border)}
.section h1,.section h2{margin:0 0 18px}

/* Cards & grids */
.grid{display:grid; gap:20px}
.news-grid{grid-template-columns:repeat(3,1fr)}
.card{background:var(--card); border:1px solid var(--border); border-radius:14px; overflow:hidden; box-shadow:var(--shadow)}
.card-body{padding:16px}
.card h3{margin:0 0 8px; font-size:18px}
.card p{margin:0 0 12px; color:var(--muted)}

/* Events */
.events{display:grid; gap:14px}
.event{display:grid; grid-template-columns:auto 1fr; align-items:center; gap:14px; background:var(--card); border:1px solid var(--border); border-radius:14px; padding:14px}
.date{width:64px; height:64px; display:grid; place-items:center; background:linear-gradient(135deg,var(--brand),var(--brand2)); border-radius:12px; color:white; font-weight:800}
.date .d{font-size:22px; line-height:1}
.date .m{font-size:12px; opacity:.9}

/* Gallery */
.gallery{grid-template-columns:repeat(3,1fr)}
.gallery-item{border-radius:12px; overflow:hidden; border:1px solid var(--border)}
.gallery-item img{aspect-ratio:4/3; object-fit:cover; transition:transform .25s}
.gallery-item:hover img{transform:scale(1.04)}

/* Form & Contact */
.form{display:grid; gap:14px; max-width:720px}
.field{display:grid; gap:6px}
label{font-weight:600}
input, textarea{background:var(--card); color:var(--text); border:1px solid var(--border); border-radius:10px; padding:10px 12px; font:inherit}
input:focus, textarea:focus{outline:2px solid var(--brand2); outline-offset:2px}
.contact-cards{display:grid; grid-template-columns:1fr 1fr; gap:20px}

/* Footer */
.site-footer{padding:28px 0; background:#0b0b0d; border-top:1px solid var(--border)}
.footer-inner{display:flex; align-items:center; justify-content:space-between; gap:16px}
.to-top{color:var(--muted); text-decoration:none; border:1px solid var(--border); padding:6px 10px; border-radius:8px}
.to-top:hover{color:var(--text)}

/* Responsive */
@media (max-width: 960px){
  .news-grid, .gallery{grid-template-columns:repeat(2,1fr)}
  .contact-cards{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .nav{position:fixed; inset:64px 0 auto 0; background:rgba(17,17,22,.98); border-bottom:1px solid var(--border); padding:16px; display:none; flex-direction:column}
  .nav.show{display:flex}
  .burger{display:block}
  .news-grid, .gallery{grid-template-columns:1fr}
  .footer-inner{flex-direction:column}
}

/* --- Responsive video embeds --- */
.video-grid{display:grid;gap:20px;grid-template-columns:repeat(2,1fr)}
.video-embed{position:relative;width:100%;aspect-ratio:16/9;background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (max-width: 960px){.video-grid{grid-template-columns:1fr}}
