:root {
    --brand-dark: #0c6a52;
    --brand-mid: #0f8b6b;
    --brand-lime: #a2cf5a;
    --ink: #0c1220;
    --muted: #5b6876;
    --bg: #0c0f14;
    --card: #121722;
    --card-2: #0f141f;
    --accent: #d7f8b2;
    --good: #20c997;
    --warn: #ffc107;
  }
  html, body {
    margin:0;
    padding:0;
    background: linear-gradient(160deg, var(--bg), #0b1410 45%, #0b1410 55%, var(--bg));
    color:#e8eef7;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    line-height:1.55;
  }
  a { color: var(--brand-lime); text-decoration: none; }
  a:hover { text-decoration: underline; }
  .container { width: min(1200px, 92vw); margin: 0 auto; }
  header.site {
    position: sticky; top:0; z-index: 50;
    backdrop-filter: saturate(140%) blur(8px);
    background: rgba(12, 15, 20, 0.75);
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  .nav { display:flex; align-items: center; gap: 18px; padding: 12px 0; }
  .nav img { height:44px; }
  .nav .brand { font-weight: 700; letter-spacing:.2px; }
  .spacer { flex:1; }
  .nav a.link { font-weight:600; color:#cfe7d2; opacity:.9; }
  .nav a.cta {
    background: linear-gradient(90deg, var(--brand-mid), var(--brand-dark));
    color: white; padding: 10px 16px; border-radius: 10px; font-weight:700;
    box-shadow: 0 6px 18px rgba(16, 147, 106, .25);
  }
  /* Hero */
  .hero {
    padding: clamp(36px, 8vw, 90px) 0 40px;
    background:
      radial-gradient(1200px 600px at -10% -20%, rgba(162,207,90,.10), transparent 60%),
      radial-gradient(800px 500px at 110% -10%, rgba(15,139,107,.20), transparent 60%);
    border-bottom: 1px solid rgba(255,255,255,.06);
  }
  .hero-grid { display:grid; grid-template-columns: 1.3fr 1fr; gap: 36px; align-items:center; }
  @media (max-width: 900px) { .hero-grid { grid-template-columns: 1fr; } }
  .badge { display:inline-flex; gap:10px; align-items:center; padding:6px 10px; border-radius:999px; background:rgba(162,207,90,.12); border:1px solid rgba(162,207,90,.35); color:#dff5be; font-weight:600; }
  h1 { font-size: clamp(28px, 3.8vw, 46px); line-height:1.15; margin: 10px 0 12px; }
  p.lead { font-size: clamp(16px, 1.6vw, 18px); color:#d5e7db; }
  .hero-card {
    background:linear-gradient(180deg, var(--card), var(--card-2));
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 18px; padding:18px; display:grid; gap:16px;
    box-shadow: 0 20px 60px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.04);
  }
  .kpis { display:grid; grid-template-columns: repeat(4,1fr); gap:16px; }
  @media (max-width: 900px) { .kpis { grid-template-columns: repeat(2,1fr); } }
  .kpi { background:#0e1421; border:1px solid rgba(255,255,255,.05); border-radius:14px; padding:16px; }
  .kpi .n { font-size: 22px; font-weight:800; }
  .kpi .t { font-size:12px; color:#b9c6d3; letter-spacing:.3px; text-transform:uppercase; }
  /* Sections */
  section { padding: 46px 0; }
  section h2 { font-size: clamp(22px, 2.6vw, 30px); margin: 0 0 14px; }
  .grid-3 { display:grid; grid-template-columns: repeat(3,1fr); gap:18px; }
  .grid-2 { display:grid; grid-template-columns: repeat(2,1fr); gap:18px; }
  .card { background: linear-gradient(180deg, var(--card), var(--card-2)); border:1px solid rgba(255,255,255,.06); border-radius:16px; padding:18px; }
  .card h3 { margin:0 0 6px; }
  .note { font-size: 13px; color: #9fb2a3; }
  @media (max-width: 900px) { .grid-3 { grid-template-columns: 1fr; } .grid-2 { grid-template-columns: 1fr; } }
  /* Table */
  table { width:100%; border-collapse:collapse; }
  th, td { padding: 12px 10px; border-bottom: 1px solid rgba(255,255,255,.06); vertical-align: top; }
  th { text-align:left; color:#dcebe0; font-size: 13px; letter-spacing:.3px; text-transform:uppercase; }
  tbody tr:hover { background: rgba(162,207,90,.05); }
  code.inline { background: rgba(255,255,255,.06); padding: 2px 6px; border-radius: 6px; }
  /* Tag pills */
  .pill { display:inline-block; padding:2px 8px; border:1px solid rgba(255,255,255,.15); border-radius:999px; font-size:12px; color:#d5e7db; margin-right:6px; }
  /* Foot */
  footer { padding: 40px 0; border-top:1px solid rgba(255,255,255,.06); color:#a6b2bd; }
  .tiny { font-size: 12px; color:#a8b7a8; }
  .brand-note { background: rgba(255,193,7,.08); border:1px solid rgba(255,193,7,.35); color:#ffe9a6; padding:10px 14px; border-radius:12px; }
  .procedures ol { margin:0; padding-left: 20px; }
  .procedures li { margin: 6px 0; }