:root{
   
        /* Base surface */
        --bg:    #0F1117;
        --panel: #161B22;

        /* Typography */
        --text:  #ffffff;
        --muted: #B7C1D6;

        /* Brand (your colors) */
        --brand:   #E7740E;
        --brand-2: #FF9A3C;
        --accent:  #007BFF;

        --radius:18px;
      --shadow: 0 10px 30px rgba(0,0,0,.35);
        --nav-height: 64px;
    }
    *{box-sizing:border-box}
    html { scroll-padding-top: calc(var(--nav-height) + 8px); }
    section[id]{ scroll-margin-top: calc(var(--nav-height) + 8px); }
    header .wrap { min-height: var(--nav-height); }
    html,body{margin:0;padding:0;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;background:radial-gradient(1200px 600px at 10% 0%, rgba(110,168,255,.25), transparent 60%), radial-gradient(1000px 500px at 90% -10%, rgba(122,231,255,.2), transparent 60%), var(--bg);color:var(--text)}
    a{color:var(--brand);text-decoration:none}
    .container{max-width:1100px;margin:0 auto;padding:0 20px}
    header{position:sticky;top:0;background:linear-gradient(180deg, rgba(11,16,32,.85), rgba(11,16,32,.6));border-bottom:1px solid rgba(255,255,255,.08);z-index:10}
    header .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
    .logo{display:flex;gap:10px;align-items:center}
    .logo-badge{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--brand-2));display:grid;place-items:center;color:#041028;font-weight:900;box-shadow:var(--shadow)}
    .hero{padding:72px 0 24px}
    h1{font-size:44px;margin:10px 0 6px}
    .lead{color:var(--muted);font-size:18px}
    .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
    .panel{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
    .btn{display:inline-flex;gap:10px;align-items:center;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);font-weight:800}
    .btn.primary{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#041028;border-color:transparent}
    section{padding:56px 0}
    h2{margin:0 0 14px}
    .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
    .k{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:14px;text-align:center}
    .k .v{font-size:26px;font-weight:900}
    .k .t{font-size:12px;color:var(--muted)}
    footer{padding:40px 0 80px;color:var(--muted)}
    @media (max-width: 980px){ .grid-3,.kpis{grid-template-columns:1fr} }

/* -----------------------------
   Index theme alignment
   Keeps the subpages consistent with index.html (fonts + light palette)
------------------------------*/
html, body{
  font-family: Arial, sans-serif !important;
  background: #f9f9f9 !important;
  color: #0D0D0D !important;
}
:root{
  --bg: #f9f9f9;
  --panel: #ffffff;
  --text: #0D0D0D;
  --muted: #555;
  --brand: #E7740E;
  --brand-2: #FF9A3C;
  --accent: #05C7F2;
  --radius: 10px;
  --shadow: 0 4px 8px rgba(0,0,0,0.10);
}

a{ color: var(--brand); }

.panel, .card{
  background: var(--panel) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  box-shadow: var(--shadow) !important;
}

.muted, .subtle, .lead{
  color: var(--muted) !important;
}

/* -----------------------------
   Index theme alignment
   Keeps the subpages consistent with index.html (fonts + light palette)
------------------------------*/
html, body{
  font-family: Arial, sans-serif !important;
  background: #f9f9f9 !important;
  color: #0D0D0D !important;
}
:root{
  --bg: #f9f9f9;
  --panel: #ffffff;
  --text: #0D0D0D;
  --muted: #555;
  --brand: #E7740E;
  --brand-2: #FF9A3C;
  --accent: #05C7F2;
  --radius: 10px;
  --shadow: 0 4px 8px rgba(0,0,0,0.10);
}

/* Make the existing "panel/card" blocks readable on a light background */
.panel, .card{
  background: var(--panel) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  box-shadow: var(--shadow) !important;
}

/* Softer secondary text, similar to index */
.muted, .subtle, .lead{
  color: var(--muted) !important;
}

/* Keep links on-brand */
a{ color: var(--brand); }