:root {
  --bg:#0f111a;
  --card:#1f2235;
  --radius:12px;
  --shadow:0 20px 40px -10px rgba(0,0,0,.5);
  --gap:1.25rem;
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:#f0f0f8;
}
*{box-sizing:border-box;}
body{margin:0;background:linear-gradient(135deg,#0f111a,#1a1f3e);min-height:100%;line-height:1.4;font-size:16px;}
.container{max-width:1080px;margin:0 auto;padding:0 1rem;}
header{position:sticky;top:0;z-index:10;background:rgba(15,17,26,.95);backdrop-filter:blur(8px);padding:0.75rem 0;}
nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.brand{font-weight:700;font-size:1.3rem;letter-spacing:1px;text-decoration:none;color:#fff;}
.menu{display:flex;gap:1rem;flex-wrap:wrap;}
.menu a{position:relative;color:#a9cfff;text-decoration:none;font-size:.9rem;padding:6px 8px;border-radius:6px;transition:background .2s;}
.menu a:hover{background:rgba(255,255,255,.08);}
.cta{background:#e8c55c;color:#0f111a;padding:8px 16px;border:none;border-radius:8px;font-weight:600;cursor:pointer;text-decoration:none;display:inline-block;}
.hero{display:grid;grid-template-columns:1fr;gap:1.5rem;padding:3rem 0;align-items:center;}
.hero-inner{display:flex;flex-direction:column;gap:1rem;}
.badge{display:inline-block;background:#e8c55c;color:#0f111a;padding:4px 12px;border-radius:999px;font-size:.65rem;letter-spacing:1px;margin-bottom:6px;}
h1{margin:0;font-size:2.4rem;line-height:1.1;}
p{margin:0 0 1rem;}
.grid{display:grid;gap:1.25rem;}
.card{background:var(--card);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;}
.card img{width:100%;display:block;object-fit:cover;}
.section{padding:3rem 0;}
.flex{display:flex;gap:1rem;flex-wrap:wrap;}
.footer{padding:2rem 0;font-size:.8rem;display:flex;flex-wrap:wrap;gap:2rem;border-top:1px solid rgba(255,255,255,.07);}
.footer-col{flex:1;min-width:180px;}
.footer a{color:#a9cfff;text-decoration:none;}
.footer a:hover{text-decoration:underline;}
.small{font-size:.75rem;color:rgba(255,255,255,.7);}
@media (min-width:768px){
  .hero{grid-template-columns:2fr 1fr;}
  h1{font-size:3rem;}
}
.mobile-toggle{display:none;cursor:pointer;font-size:1.4rem;}
@media (max-width:900px){
  .menu{display:none;position:absolute;top:100%;left:0;right:0;background:rgba(15,17,26,.98);flex-direction:column;padding:1rem;}
  .mobile-toggle{display:block;}
}