*,
   *::before,
   *::after {
       box-sizing: border-box;
   }

   html,
   body {
       margin: 0;
       padding: 0;
   }

   body {
       font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
       background-color: #cbe2f1;
       color: #333;
       padding-bottom: 40px;
   }

   a {
       text-decoration: none;
       color: inherit;
   }
   /* ===== Item de link com ações ===== */

   .link-item {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 8px;
       margin-bottom: 8px;
       padding: 4px 0;
   }

   .link-item .link-text {
       flex: 1;
       min-width: 0;
       margin-bottom: 0 !important;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
   }

   .link-item .link-text.btn {
       width: auto;
   }

   .link-actions {
       display: flex;
       gap: 6px;
       flex-shrink: 0;
   }

   .btn-copy {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       width: 32px;
       height: 32px;
       border-radius: 6px;
       border: 1px solid #7eb7f4;
       background: #2a4a62;
       color: #fff;
       cursor: pointer;
       font-size: 0.85rem;
       transition: all 0.2s ease;
       text-decoration: none;
       padding: 0;
   }

   .btn-copy:hover {
       background: #1456b8;
       transform: translateY(-1px);
       box-shadow: 0 3px 8px rgba(20, 86, 184, 0.3);
   }

   .btn-copy.copied {
       background: #1a9e4b;
       border-color: #49da6b;
   }
   /* Sidebar (fundo escuro) */

   .sidebar .btn-copy {
       background: #2a4a62;
       border-color: #7eb7f4;
   }

   .sidebar .btn-copy:hover {
       background: #1456b8;
   }
   /* Ajuste de espaçamento nos accordions */

   .accordion-content .link-item {
       margin-bottom: 6px;
   }

   .accordion-content .link-item:last-child {
       margin-bottom: 0;
   }
   /* =====================================================
       LAYOUT PRINCIPAL
    ===================================================== */

   .container {
       display: flex;
       min-height: 100vh;
       margin-bottom: 32px;
   }

   .main-content {
       width: 80%;
       max-width: 1400px;
       padding: 24px;
       overflow-y: auto;
       margin: 0 auto;
   }
   /* =====================================================
       SIDEBAR
    ===================================================== */

   .sidebar {
       width: 20%;
       min-width: 280px;
       background-color: #213546;
       color: #cbe2f1;
       padding: 20px;
       overflow-y: auto;
       align-self: flex-start;
       position: sticky;
       top: 0;
       max-height: calc(100vh - 20px);
       margin-bottom: 0;
       border-radius: 5px;
   }

   .sidebar-header {
       text-align: center;
       margin-bottom: 30px;
       border-radius: 10px;
   }

   .sidebar-header img {
       max-width: 180px;
       width: 100%;
   }
   /* =====================================================
       ACCORDION — compartilhado
    ===================================================== */

   .accordion-item,
   .accordion-light {
       margin-bottom: 10px;
       border-radius: 10px;
   }

   .accordion-item summary,
   .accordion-light summary {
       cursor: pointer;
       padding: 14px 14px;
       font-weight: 700;
       border-radius: 10px;
       list-style: none;
       transition: background-color 0.2s ease, color 0.2s ease;
   }

   .accordion-item summary::-webkit-details-marker,
   .accordion-light summary::-webkit-details-marker {
       display: none;
   }

   .accordion-item summary::before,
   .accordion-light summary::before {
       content: "➔ ";
       margin-right: 6px;
   }

   .accordion-content {
       padding: 14px 14px 18px 22px;
   }

   .accordion-content a {
       display: block;
       text-decoration: none;
       margin-bottom: 10px;
       font-size: 0.95rem;
       font-weight: 600;
       transition: transform 0.3s ease, color 0.3s ease;
   }

   .accordion-content a:hover {
       text-decoration: none;
       transform: translateX(8px);
   }
   /* =====================================================
       ACCORDION — tema escuro (sidebar)  .accordion-item
    ===================================================== */

   .accordion-item {
       border-bottom: 1px solid rgba(255, 255, 255, 0.15);
       background: transparent;
   }

   .accordion-item summary {
       color: #cbe2f1;
   }

   .accordion-item summary::before {
       color: #7eb7f4;
   }

   .accordion-item[open] summary {
       background-color: #64649a;
       color: #ffffff !important;
       border-radius: 6px;
   }

   .accordion-item[open] summary::before {
       color: #53e27e;
   }

   .accordion-item .accordion-content {
       background: transparent;
   }

   .accordion-item .accordion-content a {
       color: #e8f4fc !important;
       /* claro no fundo escuro */
   }

   .accordion-item .accordion-content a:hover {
       color: #ffffff !important;
   }
   /* =====================================================
       CARD DOS ACCORDIONS (main)
    ===================================================== */

   .accordion-card {
       background: #ffffff;
       color: #0d1b26;
       padding: 18px 16px 12px;
   }

   .accordion-card>h3 {
       margin-top: 0;
       margin-bottom: 16px;
       padding-bottom: 10px;
       border-bottom: 3px solid #e5770a;
       color: #0d1b26;
   }
   /* =====================================================
       ACCORDION — tema claro (main)  .accordion-light
    ===================================================== */

   .accordion-light {
       border: 1px solid #d0dbe6;
       background: #f7fafc;
       box-shadow: none;
       margin-bottom: 10px;
       overflow: hidden;
   }

   .accordion-light summary {
       color: #0a1620 !important;
       background: #eef3f8;
   }

   .accordion-light summary::before {
       color: #e5770a;
   }

   .accordion-light[open] summary {
       background-color: #1a2f3f;
       color: #ffffff !important;
       border-radius: 10px 10px 0 0;
   }

   .accordion-light[open] summary::before {
       color: #53e27e;
   }

   .accordion-light .accordion-content {
       background: #ffffff;
       border-radius: 0 0 10px 10px;
       border-top: 1px solid #e2e8f0;
   }

   .accordion-light .accordion-content a {
       color: #0a1620 !important;
       /* quase preto — máximo contraste */
       font-weight: 600;
   }

   .accordion-light .accordion-content a:hover {
       color: #0d4a9e !important;
   }
   /* Reforço dentro do card */

   .accordion-card .accordion-light .accordion-content a {
       color: #0a1620 !important;
   }
   /* =====================================================
       HERO ENTERPRISE
    ===================================================== */

   .main-banner {
       margin-bottom: clamp(32px, 4vw, 46px);
   }

   .banner-link {
       position: relative;
       display: block;
       border-radius: clamp(16px, 2vw, 22px);
       overflow: hidden;
       background: #000;
       aspect-ratio: 16 / 5;
       min-height: 300px;
   }

   .hero-video {
       position: absolute;
       inset: 0;
       width: 100%;
       height: 100%;
       object-fit: cover;
       z-index: 1;
   }

   .banner-link img {
       width: 100%;
       display: block;
   }

   .banner-overlay {
       position: absolute;
       inset: 0;
       width: 80%;
       max-width: 80%;
       padding: clamp(28px, 5vw, 72px);
       display: flex;
       flex-direction: column;
       gap: clamp(16px, 2.5vw, 24px);
       background: linear-gradient( 90deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.6) 50%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0) 100%);
       color: #cbe2f1;
       z-index: 2;
   }

   .banner-overlay h1 {
       font-size: clamp(2rem, 3.2vw, 3.2rem);
       line-height: clamp(1.08, 1.1, 1.15);
       font-weight: 800;
       margin: 0;
       opacity: 0;
       transform: translateY(24px);
       animation: heroFadeUp 0.8s ease-out 0.15s forwards;
   }

   .banner-body {
       display: grid;
       grid-template-columns: 1fr;
       align-items: end;
       column-gap: clamp(16px, 3vw, 32px);
       max-width: 100%;
   }

   .banner-body p {
       font-size: clamp(1rem, 1.3vw, 1.15rem);
       line-height: clamp(1.55, 1.6, 1.7);
       margin: 0;
       opacity: 0;
       transform: translateY(24px);
       animation: heroFadeUp 0.8s ease-out 0.3s forwards;
   }

   @keyframes heroFadeUp {
       to {
           opacity: 1;
           transform: none;
       }
   }
   /* =====================================================
       BARRA DE LINKS RÁPIDOS (QUICK LINKS)
    ===================================================== */

   .quick-links-bar {
       background-color: #1a2f3f;
       padding: 14px;
       border-radius: 10px;
       margin-bottom: 28px;
       border: 1px solid #7eb7f4;
       display: flex;
       flex-wrap: wrap;
       gap: 10px;
       justify-content: center;
       width: 100%;
   }

   .quick-links-bar a {
       color: #ffffff;
       background-color: #2a4a62;
       border: 1px solid #7eb7f4;
       border-radius: 8px;
       padding: 6px 14px;
       display: inline-block;
       font-size: 0.85rem;
       font-weight: 600;
       letter-spacing: 0.3px;
       transition: all 0.2s ease;
   }

   .quick-links-bar a:hover {
       color: #ffffff;
       transform: translateY(-2px);
       background-color: #1456b8;
       border-color: #edf0d1;
       box-shadow: 0 4px 12px rgba(20, 86, 184, 0.35);
   }

   /* =====================================================
       GRID E CARDS
    ===================================================== */

   .content-grid {
       display: grid;
       grid-template-columns: repeat(3, 1fr);
       gap: 24px;
       margin-bottom: 28px;
       width: 100%;
   }

   .column {
       display: flex;
       flex-direction: column;
       gap: 24px;
   }

   .column .card {
       width: 100%;
   }

   .card {
       background: rgba(255, 255, 255, 0.55);
       border-radius: 12px;
       padding: 22px;
       border: 1px solid rgba(33, 53, 70, 0.15);
       backdrop-filter: blur(12px);
       -webkit-backdrop-filter: blur(12px);
       box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
       color: #213546;
       /* texto escuro — evita herdar cor clara da sidebar */
       transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
   }

   .card:hover {
       transform: translateY(-5px);
       box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
       background: rgba(255, 255, 255, 0.7);
   }

   .card h3 {
       margin-top: 0;
       margin-bottom: 18px;
       padding-bottom: 10px;
       border-bottom: 3px solid #e5770a;
       color: #213546;
   }

   .card-links a {
       display: block;
       margin-bottom: 10px;
       text-decoration: none;
       color: #1a2f3f;
       font-weight: 500;
       transition: color 0.3s ease, transform 0.3s ease;
   }

   .card-links a:hover {
       color: #1456b8;
       transform: translateX(8px);
   }

   .btn {
       display: block;
       width: 100%;
       margin-bottom: 12px;
       padding: 14px 16px;
       border-radius: 8px;
       background-color: #2a4a62;
       color: #fff;
       font-weight: 700;
       text-align: center;
       border: 1px solid #7eb7f4;
       transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
   }

   .btn:hover {
       background-color: #1456b8;
       transform: translateY(-2px);
       box-shadow: 0 4px 12px rgba(20, 86, 184, 0.3);
   }
   /* =====================================================
       CARDS DA SIDEBAR (Autorizações + Ações)
    ===================================================== */

   .sidebar-cards {
       display: flex;
       flex-direction: column;
       gap: 18px;
       /* separa os dois cards */
       margin-top: 24px;
       /* distância do acordeão acima */
   }

   .sidebar-card {
       padding: 14px 14px 12px;
       border-radius: 10px;
   }

   .sidebar-card:hover {
       transform: none;
       /* sem "pulo" do card inteiro na sidebar */
   }

   .sidebar-card h3 {
       font-size: 0.8rem;
       text-transform: uppercase;
       letter-spacing: 0.6px;
       margin-bottom: 12px;
       padding-bottom: 8px;
       border-bottom-width: 2px;
   }

   .sidebar-card.card-downloads h3 {
       color: #1a9e4b;
       border-bottom-color: #49da6b;
   }

   .sidebar-card.card-acoes h3 {
       color: #1456b8;
       border-bottom-color: #1456b8;
   }
   /* =====================================================
   AJUSTE DE HOVER PARA OS BOTÕES DA SIDEBAR (Dourado Elegante)
===================================================== */

   .sidebar-card .btn:hover {
       background-color: var(--gold, #c9a84c) !important;
       color: var(--navy, #213546) !important;
       border-color: var(--gold-lt, #e8c96a) !important;
       transform: translateY(-2px);
       box-shadow: 0 4px 12px rgba(201, 168, 76, 0.35);
   }

   .sidebar-card .btn {
       padding: 8px 12px;
       margin-bottom: 8px;
       font-size: 0.8rem;
       font-weight: 600;
       border-radius: 6px;
   }

   .sidebar-card .btn:last-child {
       margin-bottom: 0;
   }

   /* =====================================================
       CARD AGENDA / CALENDÁRIO
    ===================================================== */

   .agenda-card {
       padding: 20px;
       border-radius: 16px;
       background: rgba(255, 255, 255, 0.95);
       backdrop-filter: blur(10px);
       border: 1px solid rgba(225, 230, 235, 0.8);
       box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
       display: flex;
       flex-direction: column;
       gap: 14px;
   }

   .agenda-header {
       display: flex;
       justify-content: space-between;
       align-items: center;
       border-bottom: 2px solid #fc4c02;
       padding-bottom: 12px;
   }

   .agenda-title {
       display: flex;
       align-items: center;
       gap: 10px;
   }

   .agenda-title i {
       font-size: 1.3rem;
       color: #fc4c02;
   }

   .agenda-title h3 {
       margin: 0 !important;
       padding: 0 !important;
       border-bottom: none !important;
       font-size: 1.1rem;
       color: #213546;
       font-weight: 700;
   }

   .agenda-open {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       background-color: #2a4a62;
       color: #ffffff !important;
       padding: 6px 12px;
       border-radius: 6px;
       font-size: 0.8rem;
       font-weight: 600;
       border: 1px solid #7eb7f4;
       transition: all 0.25s ease;
   }

   .agenda-open:hover {
       background-color: #1456b8;
       transform: translateY(-2px);
       box-shadow: 0 4px 10px rgba(20, 86, 184, 0.25);
   }

   .calendar-container {
       width: 100%;
       border-radius: 10px;
       overflow: hidden;
       border: 1px solid #e2e8f0;
       background: #ffffff;
       box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02);
   }

   .calendar-container iframe {
       display: block;
       width: 100%;
       height: 420px;
       border: 0;
   }
   /* =====================================================
       FOOTER
    ===================================================== */

   .site-footer {
       width: 100%;
       max-width: 100%;
       margin: 0;
       padding: 36px 24px 28px;
       text-align: center;
       border-top: 1px solid rgba(255, 255, 255, 0.08);
       background: radial-gradient( ellipse at center, #2f4a60 0%, #213546 55%, #1a2a38 100%);
       color: #e8eef4;
   }

   .site-footer img {
       max-width: 160px;
       width: 100%;
       height: auto;
       margin: 0 auto 14px auto;
       display: block;
       filter: brightness(1.05);
   }

   .site-footer p {
       margin: 0;
       color: #c5d0db;
       font-size: 0.95rem;
       line-height: 1.5;
   }

   .site-footer a {
       color: inherit;
       text-decoration: none;
   }
   /* =====================================================
       POPUP
    ===================================================== */

   .popup-close {
       position: absolute;
       top: 10px;
       right: 15px;
       background: rgba(0, 0, 0, 0.5);
       color: #fff;
       border: none;
       font-size: 24px;
       line-height: 1;
       width: 32px;
       height: 32px;
       border-radius: 50%;
       cursor: pointer;
       z-index: 10;
   }

   .popup-banner {
       width: 100%;
       height: auto;
       display: block;
   }

   .popup-body {
       padding: 20px;
   }

   .popup-body h3 {
       margin: 0 0 10px;
       color: #333;
   }

   .popup-body p {
       margin: 0 0 20px;
       color: #666;
       font-size: 14px;
   }

   .popup-btn {
       display: inline-block;
       background-color: #1456b8;
       color: #fff;
       padding: 12px 24px;
       text-decoration: none;
       border-radius: 6px;
       font-weight: bold;
       transition: background-color 0.2s;
   }

   .popup-btn:hover {
       background-color: #0d3d8a;
   }
   /* =====================================================
       RESPONSIVIDADE
    ===================================================== */

   @media (max-width: 1100px) {
       .content-grid {
           grid-template-columns: repeat(2, 1fr);
       }
       .main-content {
           width: 100%;
           max-width: 100%;
       }
       .site-footer {
           padding: 32px 20px 24px;
       }
       .site-footer img {
           max-width: 140px;
       }
       .site-footer p {
           font-size: 0.9rem;
       }
   }

   @media (max-width: 900px) {
       body {
           padding-bottom: 60px;
       }
       .card h3 {
           color: #213546;
           border-bottom-color: #53e27e;
       }
       .card-links a {
           color: #1a2f3f;
       }
       .card-links a:hover {
           color: #1456b8;
       }
       .container {
           flex-direction: column;
       }
       .sidebar {
           position: static;
           max-height: none;
           overflow-y: visible;
           top: auto;
           align-self: stretch;
           width: 100%;
           max-width: 100%;
       }
       .main-content {
           overflow-y: visible;
       }
       .content-grid {
           grid-template-columns: 1fr;
       }
       .column {
           gap: 18px;
       }
       .banner-link {
           width: 100%;
           max-width: 100%;
           aspect-ratio: 4 / 3;
           min-height: 380px;
       }
       .hero-video {
           position: absolute;
           inset: 0;
           width: 100%;
           height: 100%;
           object-fit: cover;
       }
       .banner-overlay {
           width: 100%;
           max-width: 100%;
           padding: clamp(20px, 6vw, 32px);
           justify-content: center;
           background: linear-gradient( 180deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.85) 100%);
       }
       .banner-body {
           grid-template-columns: 1fr;
           row-gap: clamp(16px, 4vw, 22px);
           align-items: center;
       }
       .banner-overlay h1,
       .banner-body p {
           text-align: center;
       }
       .banner-overlay h1 {
           font-size: clamp(1.5rem, 5vw, 2.2rem);
       }
       .banner-body p {
           font-size: clamp(0.95rem, 3vw, 1.1rem);
       }

       .site-footer {
           padding: 28px 16px 36px 16px;
       }
       .site-footer img {
           max-width: 120px;
           margin-bottom: 12px;
       }
       .site-footer p {
           font-size: 0.85rem;
       }
   }

   @media (max-width: 600px) {
       .calendar-container iframe {
           height: 350px;
       }
   }

   @media (max-width: 480px) {
       .site-footer {
           padding: 24px 14px 20px;
       }
       .site-footer img {
           max-width: 110px;
       }
       .site-footer p {
           font-size: 0.8rem;
       }
   }

.popup-corner {
       position: fixed;
       top: 16px;
       right: 16px;
       width: min(320px, calc(100vw - 32px));
       background: #DCF4FB;
       border-radius: 12px;
       overflow: hidden;
       box-shadow: 0 8px 28px rgba(0, 0, 0, 0.22);
       z-index: 99999;
       font-family: Arial, sans-serif;
       text-align: center;
       opacity: 0;
       visibility: hidden;
       transform: translateY(-12px) scale(0.96);
       transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
       pointer-events: none;
   }

   .popup-corner.active {
       opacity: 1;
       visibility: visible;
       transform: translateY(0) scale(1);
       pointer-events: auto;
   }

   .popup-close {
       position: absolute;
       top: 8px;
       right: 8px;
       background: rgba(0, 0, 0, 0.55);
       color: #fff;
       border: none;
       font-size: 20px;
       line-height: 1;
       width: 28px;
       height: 28px;
       border-radius: 50%;
       cursor: pointer;
       z-index: 10;
       display: flex;
       align-items: center;
       justify-content: center;
       transition: background 0.2s;
   }

   .popup-close:hover {
       background: rgba(0, 0, 0, 0.8);
   }

   .popup-banner-link {
       display: block;
   }

   .popup-banner {
       width: 100%;
       height: auto;
       display: block;
       max-height: 140px;
       object-fit: cover;
   }

   .popup-body {
       padding: 14px 16px 18px;
   }

   .popup-body h3 {
       margin: 0 0 8px;
       color: #213546;
       font-size: 1rem;
   }

   .popup-body p {
       margin: 0 0 14px;
       color: #555;
       font-size: 0.85rem;
       line-height: 1.4;
   }

   .popup-btn {
       display: inline-block;
       background-color: #007bff;
       color: #fff !important;
       padding: 10px 20px;
       text-decoration: none;
       border-radius: 6px;
       font-weight: bold;
       font-size: 0.9rem;
       transition: background-color 0.2s;
   }

   .popup-btn:hover {
       background-color: #0056b3;
   }

   @media (max-width: 480px) {
       .popup-corner {
           top: auto;
           bottom: 16px;
           right: 12px;
           left: 12px;
           width: auto;
       }
   }
