:root{
  --bg:#f4f7fb;
  --surface:#ffffff;
  --text:#102033;
  --muted:#667085;
  --line:#e6eaf2;
  --green:#167a5b;
  --green-2:#20a77a;
  --blue:#2f80ed;
  --orange:#f2994a;
  --purple:#7b61ff;
  --cyan:#00a6c8;
  --pink:#e2559a;
  --shadow:0 18px 45px rgba(16,32,51,.08);
  --radius:24px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.layout{display:flex;min-height:100vh}
.sidebar{width:280px;background:#10291f;color:#fff;padding:24px;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;gap:24px}
.brand{display:flex;align-items:center;gap:13px}
.brand-logo{width:46px;height:46px;border-radius:16px;background:linear-gradient(135deg,#21a67a,#167a5b);display:grid;place-items:center}
.brand h1{margin:0;font-size:25px;letter-spacing:.05em}
.nav{display:grid;gap:8px}
.nav-link{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:14px;color:#dce9e4;text-decoration:none;font-weight:700;transition:.18s ease}
.nav-link:hover,.nav-link.active{background:rgba(255,255,255,.12);transform:translateX(4px)}
.sidebar-profile{margin-top:auto;display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:rgba(255,255,255,.10)}
.profile-avatar,.account-button span{width:38px;height:38px;border-radius:50%;background:#21a67a;display:grid;place-items:center;color:#fff;font-weight:800}
.profile-text{display:grid}
.profile-text span{font-size:13px;color:#b8cec6}
.profile-arrow{margin-left:auto;width:18px}
.main{margin-left:280px;width:calc(100% - 280px);padding:26px}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}
.topbar-title{display:grid;gap:3px}
.topbar-title strong{font-size:20px}
.topbar-title span{color:var(--muted);font-size:14px}
.top-actions{display:flex;align-items:center;gap:10px}
button,a{font:inherit}
.icon-button,.theme-button,.search-button,.account-button{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:11px 13px;display:flex;align-items:center;gap:9px;cursor:pointer;text-decoration:none;color:var(--text);font-weight:700;transition:.18s ease}
.icon-button:hover,.theme-button:hover,.search-button:hover,.account-button:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.language-wrapper{position:relative}
.language-toggle{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:11px 13px;display:flex;gap:8px;align-items:center;font-weight:800;cursor:pointer}
.language-menu{display:none;position:absolute;right:0;top:48px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:8px;z-index:5}
.language-menu.open{display:grid}
.language-option{border:0;background:transparent;display:flex;gap:8px;padding:10px 16px;border-radius:12px;cursor:pointer}
.language-option:hover,.language-option.active{background:#eef7f3}
.hero{border-radius:0;background:transparent;border:0;display:block;padding:10px 0 0;margin-bottom:26px;box-shadow:none;overflow:visible;text-align:center}
.hero-title h2{font-size:58px;letter-spacing:.04em;margin:0;color:var(--green);font-weight:900}
.hero-title h3{font-size:32px;margin:4px 0 10px;font-weight:900;color:var(--text)}
.hero-title p{margin:0 0 28px;color:var(--green);font-size:20px;font-weight:800}
.hero-visual{width:100%;height:315px;border-radius:14px;background:url('assets/hero-banner.jpg') center/cover no-repeat;box-shadow:0 18px 45px rgba(16,32,51,.12);opacity:1}
.section{margin-top:22px}
.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:16px}
.section-title h3{margin:0;font-size:24px}
.section-title p{margin:5px 0 0;color:var(--muted)}
.module-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px}
.module-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;min-height:260px;box-shadow:0 10px 28px rgba(16,32,51,.05);transition:.22s ease;position:relative}
.module-card:hover,.module-card.card-launch{transform:translateY(-5px) scale(1.01);box-shadow:var(--shadow)}
.module-card.clickable-card{cursor:pointer}
.module-icon{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;margin-bottom:18px}
.icon-green{background:#e9f8f2;color:var(--green)}
.icon-blue{background:#eef5ff;color:var(--blue)}
.icon-orange{background:#fff4e8;color:var(--orange)}
.icon-purple{background:#f1efff;color:var(--purple)}
.icon-cyan{background:#e8fbff;color:var(--cyan)}
.icon-pink{background:#fff0f7;color:var(--pink)}
.module-card h4{font-size:20px;margin:0 0 14px}
.module-card p{margin:0;color:var(--muted);line-height:1.55}
.module-footer{display:flex;justify-content:space-between;align-items:center;margin-top:22px}
.card-status{font-size:13px;font-weight:800;color:var(--green);background:#e9f8f2;padding:8px 12px;border-radius:999px}
.module-footer a,.module-footer button{width:38px;height:38px;border-radius:12px;border:0;background:#eef2f7;display:grid;place-items:center;text-decoration:none;color:var(--text);font-weight:900;cursor:pointer}
.module-footer button:disabled{opacity:.45;cursor:not-allowed}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:24px}
.stats article{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;display:flex;gap:14px;align-items:center;box-shadow:0 10px 28px rgba(16,32,51,.05)}
.stat-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center}
.stat-green{background:#e9f8f2;color:var(--green)}
.stat-blue{background:#eef5ff;color:var(--blue)}
.stat-orange{background:#fff4e8;color:var(--orange)}
.stat-purple{background:#f1efff;color:var(--purple)}
.stats strong{display:block;font-size:30px}
.stats span{color:var(--muted);font-size:14px}
.page-fade{animation:fadeIn .35s ease both}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
body.theme-dark{--bg:#0c1411;--surface:#13221c;--text:#eef7f3;--muted:#a9bbb4;--line:#284139;--shadow:0 18px 45px rgba(0,0,0,.28)}
body.theme-dark .ethno-hero{background:linear-gradient(135deg,#173d30,#13221c)}

/* SIEBIS UI Framework v2.0 - desktop base */
.mobile-menu-button,
.mobile-sidebar-overlay{
  display:none;
}

body.mobile-menu-open{
  overflow:hidden;
}