    :root{
      --azul:#0a54c5;       /* cor do texto */
      --azul-escuro:#083e90;
      --overlay:rgba(0,0,0,.45);
      --radius:18px;
      --shadow:0 20px 50px rgba(0,0,0,.25);
    }

    /* Página de exemplo (remova/ajuste conforme seu layout) */

    /* Overlay / popup */
    .popup-overlay{
      position:fixed;
      inset:0;
      background:var(--overlay);
      display:flex;
      align-items:center;
      justify-content:center;
      padding:24px;
      z-index:9999;
      opacity:0;
      visibility:hidden;
      transition:opacity .25s ease, visibility .25s ease;
    }
    .popup-overlay.is-open{
      opacity:1;
      visibility:visible;
    }

    .popup{
      position:relative;
      background:#fff;
      border-radius:var(--radius);
      box-shadow:var(--shadow);
      width:min(860px, 100%);
      max-height:min(80vh, 900px);
      overflow:auto;
      padding:28px 24px 24px;
      border:1px solid #e6eaf2;
      transform:scale(.98) translateY(6px);
      transition:transform .25s ease, opacity .25s ease;
      opacity:0;
    }
    .popup-overlay.is-open .popup{
      transform:scale(1) translateY(0);
      opacity:1;
    }

    .popup h2{
      margin:0 48px 8px 0;
      color:var(--azul);
      font-size:1.35rem;
      letter-spacing:.2px;
    }
    .popup p,
    .popup li{
      color:var(--azul);
      margin:.35rem 0;
    }
    .popup ul{
      padding-left:1.2rem;
      margin:.5rem 0 1rem;
    }
    .badge{
      display:inline-block;
      background:#eef4ff;
      border:1px solid #d7e3ff;
      color:var(--azul-escuro);
      padding:.2rem .5rem;
      border-radius:999px;
      font-size:.825rem;
      margin-bottom:.5rem;
    }

    /* Botão fechar (ícone X) */
    .btn-close{
      position:absolute;
      top:10px;
      right:10px;
      width:38px;
      height:38px;
      border:none;
      border-radius:10px;
      background:#f2f5fb;
      color:#244DFF;
      font-size:22px;
      line-height:1;
      display:grid;
      place-items:center;
      cursor:pointer;
      transition:background .2s ease, transform .08s ease;
    }
    .btn-close:hover{ background:#e8eefc; }
    .btn-close:active{ transform:scale(.96); }
    .btn-close:focus-visible{
      outline:3px solid #bcd2ff;
      outline-offset:2px;
    }

    /* Rodapé do popup (opcional) */
    .popup-footer{
      margin-top:12px;
      font-size:.85rem;
      color:var(--azul);
      opacity:.9;
      display:flex;
      align-items:center;
      gap:.5rem;
      flex-wrap:wrap;
    }
    .popup-footer strong{ color:var(--azul-escuro); }
