
:root{
  --blue:#0b5bd3;
  --green:#16a34a;
  --gold:#f59e0b;
  --text:#111827;
  --muted:#6b7280;
  --bg:#ffffff;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans',sans-serif;color:var(--text);background:var(--bg);}
.wrap{max-width:1100px;margin:0 auto;padding:0 16px;}
a{color:var(--blue);text-decoration:none;}
a:hover{text-decoration:underline;}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid #e5e7eb;}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;min-height:64px;}
.brand{display:flex;align-items:center;gap:12px;}
.logo{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--gold),var(--blue),var(--green));color:white;font-size:20px;box-shadow:0 4px 14px rgba(0,0,0,.12);}
.brand-name{font-size:16px;margin:0;}
.brand-motto{margin:2px 0 0;color:var(--muted);font-size:12px;}
.nav-toggle{display:none;background:none;border:1px solid #e5e7eb;border-radius:8px;padding:6px 10px;font-size:16px;}
.menu{display:flex;gap:14px;list-style:none;margin:0;padding:0;flex-wrap:wrap;}
.menu a{color:#374151;font-size:14px;}
.menu a:hover{color:#111827}

/* Hero */
.hero{position:relative;overflow:hidden;}
.hero .wrap{padding:64px 16px;text-align:center;}
.hero-bg{position:absolute;inset:0;opacity:.12;background:radial-gradient(80% 80% at 20% 20%,var(--gold),transparent 60%),radial-gradient(90% 90% at 80% 30%,var(--blue),transparent 60%),radial-gradient(80% 80% at 50% 80%,var(--green),transparent 60%);z-index:-1;}
.hero-title{font-size:28px;margin:0;}
.hero-sub{max-width:800px;margin:12px auto 0;color:#374151;}

/* Buttons */
.btn{display:inline-block;padding:10px 16px;border-radius:999px;border:1px solid #d1d5db;transition:.15s all ease;}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue);}
.btn-primary:hover{filter:brightness(.95);}
.btn-outline:hover{background:#fff;}

/* Sections */
.section{padding:56px 0;border-top:1px solid #f1f5f9;}
.section.alt{background:#f8fafc;}
.section-title{margin:0 0 16px 0;font-size:24px;}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.cards.two{grid-template-columns:repeat(2,minmax(0,1fr));}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:16px;box-shadow:0 4px 12px rgba(0,0,0,.04);}
.card h4{margin:0 0 6px 0;font-size:18px;}
.card p{margin:0;color:#374151;}

/* Grid */
.grid-2{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;}

/* Contact */
.contact-list{padding:0;margin:0;list-style:none;}
.contact-list li{margin:8px 0;}
.socials ul{padding:0;margin:8px 0 0 0;list-style:none;}
.socials li{margin:6px 0;}
.contact-form label{display:block;font-size:14px;margin-top:10px;}
.contact-form input,.contact-form textarea{width:100%;padding:10px;border:1px solid #e5e7eb;border-radius:10px;margin-top:6px;}
.hint{color:#6b7280;font-size:12px;margin-top:8px;}

/* Footer */
.site-footer{border-top:1px solid #e5e7eb;padding:28px 0;text-align:center;background:#fff;}
.site-footer .sub{color:#6b7280;margin:6px 0 0 0;font-size:14px;}

/* Responsive */
@media (max-width: 900px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr));}
  .grid-2{grid-template-columns:1fr;gap:16px;}
}
@media (max-width: 640px){
  .nav-toggle{display:block;}
  .menu{display:none;flex-direction:column;gap:10px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px;margin-top:10px;}
  .menu.open{display:flex;}
  .hero .wrap{padding:44px 16px;}
  .hero-title{font-size:22px;}
}
