/*
       ========================================= VARIÁVEIS GLOBAIS DE CORES E FONTES =========================================
       */
    :root {
       --bg: #02040d;
       --bg-2: #050b1f;
       --bg-3: #07112e;
       --neon-blue: #00b4ff;
       --neon-cyan: #00eaff;
       --neon-pink: #ff2bd6;
       --neon-purple: #8a5bff;
       --neon-yellow: #f9f871;
       --neon-green: #00ff66;
       --text: #e8f1ff;
       --muted: #93a7d1;
       --border: rgba(0, 180, 255, 0.28);
       --glow-cyan: 0 0 12px var(--neon-cyan), 0 0 30px rgba(0, 234, 255, .35);
       --glow-blue: 0 0 14px var(--neon-blue), 0 0 36px rgba(0, 180, 255, .45);
       --glow-pink: 0 0 12px var(--neon-pink), 0 0 30px rgba(255, 43, 214, .4);
       --font-display: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
       --font-mono: "Cascadia Mono", Consolas, "Courier New", monospace;
       --font-body: "Segoe UI", Arial, Helvetica, sans-serif;

    }

     * {
      box-sizing: border-box;
      margin: 0;
      padding: 0
    }

     html, body {
      height: 100%
    }

     body {
       font-family: var(--font-body);
       background: radial-gradient(ellipse at top, var(--bg-3), var(--bg) 60%);
       color: var(--text);
       min-height: 100vh;
       overflow-x: hidden;
       overflow-y: auto;
       position: relative;
       isolation: isolate;
       scroll-behavior: smooth;

    }
     .sr-only {
       position: absolute;
       width: 1px;
       height: 1px;
       padding: 0;
       margin: -1px;
       overflow: hidden;
       clip: rect(0, 0, 0, 0);
       white-space: nowrap;
       border: 0;
     }
     img, svg {
      -webkit-user-drag: none;
      pointer-events: none
    }

     #matrix {
      position: fixed;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 0;
      opacity: .55;
      pointer-events: none
    }

     .scanlines {
      position: fixed;
      inset: 0;
      z-index: 1;
      pointer-events: none;
       background: repeating-linear-gradient(to bottom, rgba(0, 234, 255, .04) 0 1px, transparent 1px 3px);
       mix-blend-mode: overlay
    }

    .vignette {
     position: fixed;
     inset: 0;
     z-index: 1;
     pointer-events: none;
       background: radial-gradient(ellipse at center, transparent 40%, rgba(0, 0, 0, .85) 100%)
    }
     main, footer {
       position: relative;
       z-index: 2;
    }
     header.site-header, .header.site-header, body > header.nav {
       z-index: 10000 !important;
       pointer-events: auto;
       isolation: isolate;
    }
     header.site-header .nav-menu, header.site-header .nav-dropdown, header.site-header .nav-dropdown summary, header.site-header .nav-dropdown-panel, header.site-header .nav-dropdown-panel a {
       pointer-events: auto;
    }
     header.site-header .nav-dropdown {
       z-index: 10010 !important;
    }
     header.site-header .nav-dropdown-panel {
       z-index: 10020 !important;
    }

     /* ===== Cabeçalho ===== */
    .header {
       position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       padding: 1.25rem 2rem;
       display: flex;
       justify-content: space-between;
       align-items: center;
       background: rgba(2, 4, 13, 0.85);
       backdrop-filter: blur(12px);
       border-bottom: 1px solid var(--border);
       z-index: 100;

    }

     .logo {
       display: flex;
       align-items: center;
       gap: 0.75rem;
       font-family: var(--font-display);
       font-weight: 700;
       font-size: 1.2rem;
       letter-spacing: 0.1em;
       color: var(--text);
       text-decoration: none;

    }

     .logo svg {
       width: 36px;
       height: 36px;

    }

     .nav {
       display: flex;
       gap: 1.5rem;
       align-items: center;

    }

     .nav a {
       color: var(--text);
       text-decoration: none;
       font-size: 0.95rem;
       font-weight: 600;
       text-transform: uppercase;
       letter-spacing: 0.08em;
       transition: color 0.25s ease;

    }

     .nav a:hover {
       color: var(--neon-cyan);
       text-shadow: var(--glow-cyan);

    }

     .nav .btn-nav {
       padding: 0.5rem 1rem;
       border-radius: 8px;
       border: 1px solid var(--neon-cyan);
       color: var(--neon-cyan);
       box-shadow: 0 0 10px rgba(0, 234, 255, 0.2);

    }

     .nav .btn-nav:hover {
       background: var(--neon-cyan);
       color: var(--bg);

    }

     @media (max-width: 768px) {
       .header {
         padding: 1rem;
         flex-direction: column;
         gap: 1rem;

      }

       .nav {
         width: 100%;
         justify-content: center;
         gap: 1rem;
         flex-wrap: wrap;

      }

    }

     /* ===== Corpo Principal ===== */
    .wrap {
       position: relative;
      z-index: 2;
       min-height: 100vh;
       display: flex;
      align-items: center;
      justify-content: center;
       padding: 8rem 1.25rem 4rem;
       text-align: center;

    }

     .card {
       max-width: 1440px;
      width: 100%;
       padding: clamp(1.5rem, 4vw, 3rem);
       border: 1px solid var(--border);
       border-radius: 18px;
       background: linear-gradient(180deg, rgba(5, 11, 31, .78), rgba(2, 4, 13, .85));
       backdrop-filter: blur(10px);
       box-shadow: 0 0 60px rgba(0, 180, 255, .18), inset 0 0 60px rgba(0, 234, 255, .06);
       position: relative;
      overflow: hidden;

    }

     .card::before {
       content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
       background: linear-gradient(90deg, transparent, rgba(0, 234, 255, .08), transparent);
       transform: translateX(-100%);
       animation: sweep 5s ease-in-out infinite;

    }

     @keyframes sweep {
      50% {
        transform: translateX(100%)
      }

      100% {
        transform: translateX(100%)
      }

    }

     .badge {
       display: inline-flex;
      gap: .5rem;
      align-items: center;
       font-family: var(--font-mono);
      font-size: .8rem;
      letter-spacing: .2em;
       color: var(--neon-cyan);
       padding: .4rem .8rem;
      border: 1px solid var(--border);
      border-radius: 999px;
       background: rgba(0, 234, 255, .05);
       box-shadow: var(--glow-cyan);
       margin-bottom: 1.5rem;

    }

     .dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--neon-green);
       box-shadow: 0 0 10px var(--neon-green);
      animation: pulse 1.4s infinite
    }

     @keyframes pulse {
      50% {
        opacity: .3;
        transform: scale(.7)
      }

    }

     h1 {
       font-family: var(--font-display);
       font-weight: 900;
       font-size: clamp(5rem, 18vw, 12rem);
       line-height: 1;
       letter-spacing: .05em;
       background: linear-gradient(180deg, var(--neon-cyan), var(--neon-blue) 60%, var(--neon-purple));
       -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
       text-shadow: 0 0 40px rgba(0, 234, 255, .45);
       position: relative;

    }

     h2 {
       font-family: var(--font-display);
       font-weight: 700;
       font-size: clamp(1.1rem, 3vw, 1.8rem);
       letter-spacing: .15em;
      text-transform: uppercase;
       color: var(--text);
       margin: .5rem 0 1rem;

    }

     h2 .accent {
      color: var(--neon-cyan);
      text-shadow: var(--glow-cyan)
    }

     p.lead {
       font-size: clamp(1rem, 2vw, 1.15rem);
       color: var(--muted);
       max-width: 60ch;
      margin: 0 auto 1.5rem;
       line-height: 1.55;

    }

     .terminal {
       font-family: var(--font-mono);
       text-align: left;
       background: rgba(2, 4, 13, .7);
       border: 1px solid var(--border);
       border-radius: 10px;
       padding: 1rem 1.1rem;
       margin: 1.25rem auto;
       max-width: 560px;
       color: var(--neon-green);
       font-size: .92rem;
       box-shadow: inset 0 0 20px rgba(0, 180, 255, .1);

    }

     .terminal .line {
      display: block;
      white-space: pre-wrap
    }

     .terminal .muted {
      color: var(--muted)
    }

     .terminal .success {
       color: var(--neon-green);
       text-shadow: 0 0 10px var(--neon-green);
       animation: pulse-text 1.4s infinite;

    }

     @keyframes pulse-text {
       50% {
         opacity: 0.3;
         text-shadow: 0 0 2px var(--neon-green);

      }

    }

     .cursor {
      display: inline-block;
      width: 9px;
      height: 1em;
      background: var(--neon-cyan);
       vertical-align: -2px;
      margin-left: 2px;
      animation: blink 1s steps(1) infinite;
      box-shadow: var(--glow-cyan)
    }

     @keyframes blink {
      50% {
        opacity: 0
      }

    }

     .actions {
       display: flex;
      gap: .8rem;
      flex-wrap: wrap;
      justify-content: center;
      margin-top: 1.5rem;

    }

     .btn {
       font-family: var(--font-display);
      font-weight: 700;
       text-decoration: none;
      cursor: pointer;
       padding: .85rem 1.4rem;
      border-radius: 10px;
       letter-spacing: .12em;
      text-transform: uppercase;
      font-size: .85rem;
       border: 1px solid var(--border);
       color: var(--text);
      background: rgba(0, 180, 255, .08);
       transition: all .25s ease;
       position: relative;
      overflow: hidden;

    }

     .btn:hover {
      transform: translateY(-2px);
      color: var(--bg);
       background: var(--neon-cyan);
      box-shadow: var(--glow-cyan)
    }

     .btn.primary {
      background: linear-gradient(90deg, var(--neon-blue), var(--neon-cyan));
      color: var(--bg);
       border-color: transparent;
      box-shadow: var(--glow-blue)
    }

     .btn.primary:hover {
      filter: brightness(1.1)
    }

     .meta {
       margin-top: 1.75rem;
       font-family: var(--font-mono);
      font-size: .78rem;
      color: var(--muted);
       letter-spacing: .1em;

    }

     .meta a {
      color: var(--neon-cyan);
      text-decoration: none
    }

     .meta a:hover {
      text-shadow: var(--glow-cyan)
    }

     @media (max-width:480px) {
       .card {
        padding: 1.25rem
      }

       .actions {
        flex-direction: column
      }

       .btn {
        width: 100%
      }

    }

     /* ===== Página A4 (substitui a figura) ===== */
    .a4-page {
       width: 100%;
       max-width: 210mm;
       min-height: 297mm;
       margin: 0 auto 2rem auto;
       padding: 20mm;
       background: #ffffff;
       color: #1a1a1a;
       box-shadow: 0 0 50px rgba(0, 234, 255, 0.3), inset 0 0 10px rgba(0, 0, 0, 0.1);
       border-radius: 6px;
       border: 1px solid var(--border);
       text-align: left;
       line-height: 1.6;
       font-family: Arial, Helvetica, sans-serif;
       font-size: 11pt;
       position: relative;
       z-index: 3;
       -webkit-user-select: text;
       user-select: text;

    }

     .a4-page h1, .a4-page h2, .a4-page h3, .a4-page h4 {
       animation: none !important;
       color: #0b1a3a !important;
       text-shadow: none !important;
       background: none !important;
       -webkit-background-clip: unset !important;
       background-clip: unset !important;
       -webkit-text-fill-color: initial !important;
       position: static !important;
       font-family: Arial, Helvetica, sans-serif !important;
       letter-spacing: normal !important;
       text-transform: none !important;

    }

     .a4-page h1 {
       font-size: 20pt;
       margin-bottom: 8mm;

    }

     .a4-page .guide-title {
       font-size: 20pt;
       margin-bottom: 8mm;
     }
     .a4-page h2 {
       font-size: 14pt;
       color: #0056b3 !important;
       margin: 6mm 0 3mm;

    }

     .a4-page h3 {
       font-size: 12pt;
       margin: 4mm 0 2mm;

    }

     .a4-page h4 {
       font-size: 11pt;
       margin: 4mm 0 2mm;

    }

     .a4-page p {
       margin-bottom: 3mm;

    }

     .a4-page ul, .a4-page ol {
       margin: 0 0 4mm 6mm;

    }

     .a4-page li {
       margin-bottom: 2mm;

    }

     .a4-page a {
       color: #0056b3;
       text-decoration: underline;

    }

     .a4-page .author-section {
       margin-bottom: 6mm;
       font-size: 10pt;
       color: #333;

    }

     .a4-page .references {
       margin-top: 6mm;
       border-top: 1px solid #ccc;
       padding-top: 4mm;
       font-size: 10pt;

    }

     @media (max-width: 800px) {
       .a4-page {
         padding: 10mm;
         min-height: auto;
         font-size: 11pt;

      }

    }

     /* ===== Botões neon ===== */ @keyframes pulse-glow-green {
       0%, 100% {
         box-shadow: 0 0 15px rgba(0, 255, 102, 0.6), inset 0 0 10px rgba(0, 255, 102, 0.4);
         border-color: var(--neon-green);
         opacity: 1;

      }

       50% {
         box-shadow: 0 0 4px rgba(0, 255, 102, 0.2), inset 0 0 2px rgba(0, 255, 102, 0.1);
         border-color: rgba(0, 255, 102, 0.3);
         opacity: 0.85;

      }

    }

     .btn-download-green {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       gap: 10px;
       background: rgba(2, 4, 13, 0.9);
       color: var(--neon-green) !important;
       font-family: var(--font-display), sans-serif;
       font-size: 1.1rem;
       font-weight: 700;
       text-transform: uppercase;
       letter-spacing: 1px;
       padding: 0.8rem 2rem;
       border: 2px solid var(--neon-green);
       border-radius: 12px;
       text-decoration: none;
       margin-top: 1.5rem;
       cursor: pointer;
       transition: all 0.3s ease;
       animation: pulse-glow-green 1.4s infinite ease-in-out;

    }

     .btn-download-green:hover {
       background: var(--neon-green);
       color: #02040d !important;
       box-shadow: 0 0 30px var(--neon-green);

    }

     .cta-text {
       font-family: var(--font-display), sans-serif;
       font-size: 1.4rem;
       letter-spacing: 1px;
       margin-bottom: 1.2rem;
       background: linear-gradient(90deg, var(--neon-cyan), var(--neon-green));
       -webkit-background-clip: text;
       -webkit-text-fill-color: transparent;
       filter: drop-shadow(0 0 8px rgba(0, 255, 102, 0.2));

    }

     .btn-neon {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       gap: 8px;
       font-family: var(--font-display);
       font-weight: 700;
       text-decoration: none;
       cursor: pointer;
       padding: 0.85rem 1.4rem;
       border-radius: 10px;
       letter-spacing: 0.12em;
       text-transform: uppercase;
       font-size: 0.85rem;
       border: 1px solid var(--neon-blue);
       color: var(--neon-blue);
       background: rgba(0, 180, 255, 0.05);
       transition: all 0.3s ease;
       animation: pulse-glow-blue 1.4s infinite ease-in-out;
       min-width: 160px;

    }

     .btn-neon:hover {
       background: var(--neon-blue);
       color: #02040d !important;
       box-shadow: 0 0 20px var(--neon-blue);

    }

     @keyframes pulse-glow-blue {
       0%, 100% {
         box-shadow: 0 0 15px rgba(0, 180, 255, 0.4);
         border-color: var(--neon-blue);

      }

       50% {
         box-shadow: 0 0 5px rgba(0, 180, 255, 0.2);

      }

    }

     /* ====== Menu suspenso estável do cabeçalho ====== */
    .nav-menu {
       position: relative;

    }

     .nav-dropdown {
       position: relative;
       padding-bottom: 10px;
       margin-bottom: -10px;
       font-family: var(--font-mono);

    }

     .nav-dropdown::after {
       content: "";
       position: absolute;
       left: 0;
       top: 100%;
       width: 100%;
       height: 14px;
       pointer-events: auto;

    }

     .nav-dropdown summary {
       list-style: none;
       cursor: pointer;
       display: inline-flex;
       align-items: center;
       gap: 6px;
       padding: 8px 10px;
       border: 1px solid transparent;
       border-radius: 6px;
       color: var(--text);
       font-size: 0.95rem;
       font-weight: 600;
       text-transform: uppercase;
       letter-spacing: 0.08em;
       transition: color .2s, border-color .2s, background .2s, box-shadow .2s;

    }

     .nav-dropdown summary::-webkit-details-marker {
       display: none;

    }

     .nav-dropdown summary::after {
       content: "▾";
       color: var(--neon-cyan);
       transition: transform .2s;

    }

     .nav-dropdown[open] summary, .nav-dropdown:hover summary, .nav-dropdown:focus-within summary {
       color: var(--neon-cyan);
       border-color: var(--border);
       background: rgba(0, 234, 255, .06);
       box-shadow: 0 0 8px var(--neon-cyan), 0 0 20px rgba(0, 234, 255, .22);

    }

     .nav-dropdown[open] summary::after, .nav-dropdown:hover summary::after, .nav-dropdown:focus-within summary::after {
       transform: rotate(180deg);

    }

     .nav-dropdown-panel {
       position: absolute;
       top: calc(100% + 4px);
       left: 0;
       z-index: 120;
       min-width: 250px;
       padding: 10px;
       display: grid;
       gap: 6px;
       border: 1px solid var(--border);
       border-radius: 10px;
       background: rgba(2, 4, 13, .97);
       backdrop-filter: blur(14px);
       box-shadow: var(--glow-cyan);
       opacity: 0;
       transform: translateY(6px);
       visibility: hidden;
       pointer-events: none;
       transition: opacity .18s ease, transform .18s ease, visibility .18s ease;

    }

     .nav-dropdown[open] .nav-dropdown-panel {
       opacity: 1;
       transform: translateY(0);
       visibility: visible;
       pointer-events: auto;

    }

     .nav-dropdown-panel a {
       display: block;
       padding: 10px 12px;
       border: 1px solid transparent;
       border-radius: 6px;
       color: var(--text);
       font-family: var(--font-mono);
       font-size: .8rem;
       text-transform: uppercase;
       letter-spacing: .08em;

    }

     .nav-dropdown-panel a:hover {
       color: var(--neon-cyan);
       border-color: var(--border);
       background: rgba(0, 234, 255, .07);
       text-shadow: none;

    }

     /* ====== Rodapé padrão do ecossistema ====== */
    .footer {
       position: relative;
       z-index: 2;
       padding: 50px 6vw 30px;
       border-top: 1px solid var(--border);
       background: rgba(2, 4, 13, .72);
       color: var(--muted);
       font-family: var(--font-mono);
       font-size: 13px;

    }

     .footer-grid {
       max-width: 1300px;
       margin: 0 auto 30px;
       display: grid;
       gap: 24px;

    }

     .footer-grid--enhanced {
       grid-template-columns: 1.4fr 1fr 1fr 1.2fr;

    }

     .footer-brand-block p, .footer-grid li {
       line-height: 1.7;
       text-align: left;

    }

     .brand {
       display: inline-flex;
       align-items: center;
       gap: 8px;
       margin-bottom: 14px;
       color: var(--text);
       font-family: var(--font-display);
       font-weight: 900;
       font-size: 18px;

    }

     .brand__mark {
       color: var(--neon-cyan);
       text-shadow: var(--glow-cyan);

    }

     .brand__text span {
       color: var(--neon-blue);

    }

     .footer-dropdown {
       padding: 14px 16px;
       border: 1px solid rgba(0, 180, 255, .18);
       border-radius: 10px;
       background: rgba(0, 180, 255, .035);

    }

     .footer-dropdown summary {
       cursor: pointer;
       list-style: none;
       display: flex;
       align-items: center;
       justify-content: space-between;
       color: var(--neon-cyan);
       font-family: var(--font-display);
       font-size: 13px;
       letter-spacing: 2px;
       text-transform: uppercase;

    }

     .footer-dropdown summary::-webkit-details-marker {
       display: none;

    }

     .footer-dropdown summary::after {
       content: "+";
       font-size: 18px;
       transition: transform .2s;

    }

     .footer-dropdown[open] summary::after {
       transform: rotate(45deg);

    }

     .footer-dropdown ul {
       list-style: none;
       display: grid;
       gap: 7px;
       margin-top: 14px;

    }

     .footer-dropdown a {
       color: var(--muted);
       text-decoration: none;

    }

     .footer-dropdown a:hover {
       color: var(--neon-cyan);
       text-shadow: var(--glow-cyan);

    }

     .footer-base {
       max-width: 1300px;
       margin: 0 auto;
       padding-top: 24px;
       border-top: 1px dashed var(--border);
       text-align: center;

    }

     .footer-base p {
       margin: 4px 0;
       text-align: center;

    }

     @media (max-width: 900px) {
       .footer-grid--enhanced {
         grid-template-columns: 1fr;

      }

    }

     @media (max-width: 768px) {
       .nav-dropdown[open] {
         width: 100%;

      }

       .nav-dropdown-panel {
         position: static;
         width: 100%;
         min-width: auto;
         margin-top: 8px;

      }

    }

     /*
       ========================================= CABEÇALHO PADRÃO INDEX E RODAPÉ PADRÃO GUIA =========================================
       */ header.site-header {
       position: fixed;
       top: 0;
       left: 0;
       z-index: 100;
       width: 100%;
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 18px;
       padding: 16px 6vw;
       background: rgba(2, 4, 13, 0.86);
       border-bottom: 1px solid var(--border);
       backdrop-filter: blur(12px);

    }

     header.site-header .logo {
       display: flex;
       align-items: center;
       gap: 10px;
       color: var(--text);
       text-decoration: none;
       font-family: var(--font-display);
       font-weight: 900;
       font-size: 20px;
       letter-spacing: 1px;
       line-height: 1.1;

    }

     header.site-header .logo-mark {
       color: var(--neon-cyan);
       text-shadow: var(--glow-cyan);

    }

     header.site-header .logo-text {
       color: var(--text);
       text-align: left;

    }

     header.site-header .accent {
       color: var(--neon-blue);
       text-shadow: var(--glow-blue);
       font-family: var(--font-mono);
       font-size: 0.72em;
       font-weight: 400;

    }

     header.site-header .nav-menu {
       position: relative;
       display: flex;
       align-items: center;
       gap: 22px;

    }

     header.site-header .nav-menu > a, header.site-header .nav-dropdown summary {
       color: var(--text);
       font-family: var(--font-mono);
       font-size: 13px;
       font-weight: 600;
       text-decoration: none;
       text-transform: uppercase;
       letter-spacing: 1px;

    }

     header.site-header .nav-menu > a:hover {
       color: var(--neon-cyan);
       text-shadow: var(--glow-cyan);

    }

     header.site-header .cta-mini, header.site-header .btn-nav {
       padding: 8px 16px;
       border: 1px solid var(--neon-cyan);
       border-radius: 4px;
       color: var(--neon-cyan);
       box-shadow: var(--glow-cyan);

    }

     header.site-header .cta-mini:hover, header.site-header .btn-nav:hover {
       background: var(--neon-cyan);
       color: var(--bg) !important;
       text-shadow: none;

    }

     header.site-header .nav-dropdown {
       position: relative;
       padding-bottom: 10px;
       margin-bottom: -10px;
       font-family: var(--font-mono);

    }

     header.site-header .nav-dropdown::after {
       content: "";
       position: absolute;
       top: 100%;
       left: 0;
       width: 100%;
       height: 14px;
       pointer-events: auto;

    }

     header.site-header .nav-dropdown summary {
       list-style: none;
       cursor: pointer;
       display: inline-flex;
       align-items: center;
       gap: 6px;
       padding: 8px 10px;
       border: 1px solid transparent;
       border-radius: 6px;
       transition: color 0.2s, border-color 0.2s, background 0.2s, box-shadow 0.2s;

    }

     header.site-header .nav-dropdown summary::-webkit-details-marker {
       display: none;

    }

     header.site-header .nav-dropdown summary::after {
       content: "▾";
       color: var(--neon-cyan);
       transition: transform 0.2s;

    }

     header.site-header .nav-dropdown[open] summary, header.site-header .nav-dropdown:hover summary, header.site-header .nav-dropdown:focus-within summary {
       color: var(--neon-cyan);
       border-color: var(--border);
       background: rgba(0, 234, 255, 0.06);
       box-shadow: 0 0 8px var(--neon-cyan), 0 0 20px rgba(0, 234, 255, 0.22);

    }

     header.site-header .nav-dropdown[open] summary::after, header.site-header .nav-dropdown:hover summary::after, header.site-header .nav-dropdown:focus-within summary::after {
       transform: rotate(180deg);

    }

     header.site-header .nav-dropdown-panel {
       position: absolute;
       top: calc(100% + 4px);
       left: 0;
       z-index: 120;
       min-width: 250px;
       padding: 10px;
       display: grid;
       gap: 6px;
       border: 1px solid var(--border);
       border-radius: 10px;
       background: rgba(2, 4, 13, 0.97);
       backdrop-filter: blur(14px);
       box-shadow: var(--glow-cyan);
       opacity: 0;
       transform: translateY(6px);
       visibility: hidden;
       pointer-events: none;
       transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;

    }

     header.site-header .nav-dropdown[open] .nav-dropdown-panel {
       opacity: 1;
       transform: translateY(0);
       visibility: visible;
       pointer-events: auto;

    }

     header.site-header .nav-dropdown-panel a {
       display: block;
       padding: 10px 12px;
       border: 1px solid transparent;
       border-radius: 6px;
       color: var(--text);
       text-decoration: none;
       font-family: var(--font-mono);
       font-size: 12px;
       text-transform: uppercase;
       letter-spacing: 1px;

    }

     header.site-header .nav-dropdown-panel a:hover {
       color: var(--neon-cyan);
       border-color: var(--border);
       background: rgba(0, 234, 255, 0.07);
       text-shadow: none;

    }

     .footer {
       position: relative;
       z-index: 2;
       padding: 50px 6vw 30px;
       border-top: 1px solid var(--border);
       background: rgba(2, 4, 13, 0.72);
       color: var(--muted);
       font-family: var(--font-mono);
       font-size: 13px;

    }

     .footer-grid {
       max-width: 1300px;
       margin: 0 auto 30px;
       display: grid;
       gap: 24px;

    }

     .footer-grid--enhanced {
       grid-template-columns: 1.4fr 1fr 1fr 1.2fr;

    }

     .footer-brand-block p, .footer-grid li {
       line-height: 1.7;
       text-align: left;

    }

     .brand {
       display: inline-flex;
       align-items: center;
       gap: 8px;
       margin-bottom: 14px;
       color: var(--text);
       font-family: var(--font-display);
       font-weight: 900;
       font-size: 18px;

    }

     .brand__mark {
       color: var(--neon-cyan);
       text-shadow: var(--glow-cyan);

    }

     .brand__text span {
       color: var(--neon-blue);

    }

     .footer-dropdown {
       padding: 14px 16px;
       border: 1px solid rgba(0, 180, 255, 0.18);
       border-radius: 10px;
       background: rgba(0, 180, 255, 0.035);

    }

     .footer-dropdown summary {
       cursor: pointer;
       list-style: none;
       display: flex;
       align-items: center;
       justify-content: space-between;
       color: var(--neon-cyan);
       font-family: var(--font-display);
       font-size: 13px;
       letter-spacing: 2px;
       text-transform: uppercase;

    }

     .footer-dropdown summary::-webkit-details-marker {
       display: none;

    }

     .footer-dropdown summary::after {
       content: "+";
       font-size: 18px;
       transition: transform 0.2s;

    }

     .footer-dropdown[open] summary::after {
       transform: rotate(45deg);

    }

     .footer-dropdown ul {
       list-style: none;
       display: grid;
       gap: 7px;
       margin-top: 14px;

    }

     .footer-dropdown a {
       color: var(--muted);
       text-decoration: none;

    }

     .footer-dropdown a:hover {
       color: var(--neon-cyan);
       text-shadow: var(--glow-cyan);

    }

     .footer-base {
       max-width: 1300px;
       margin: 0 auto;
       padding-top: 24px;
       border-top: 1px dashed var(--border);
       text-align: center;

    }

     .footer-base p {
       margin: 4px 0;
       text-align: center;

    }

     @media (max-width: 900px) {
       .footer-grid--enhanced {
         grid-template-columns: 1fr;

      }

    }

     @media (max-width: 768px) {
       header.site-header {
         flex-direction: column;
         align-items: center;
         padding: 14px 5vw;

      }

       header.site-header .nav-menu {
         width: 100%;
         justify-content: center;
         flex-wrap: wrap;
         gap: 10px;

      }

       header.site-header .nav-menu > a, header.site-header .nav-dropdown summary {
         font-size: 12px;

      }

       header.site-header .nav-dropdown[open] {
         width: 100%;

      }

       header.site-header .nav-dropdown-panel {
         position: static;
         width: 100%;
         min-width: auto;
         margin-top: 8px;

      }

    }

     /* ===== Acessibilidade: reduz animações quando o usuário prefere menos movimento ===== */
    @media (prefers-reduced-motion: reduce) {
       *, *::before, *::after {
         animation-duration: 0.001ms !important;
         animation-iteration-count: 1 !important;
         transition: none !important;

      }

    }

.terminal-accent {
  color: var(--neon-cyan);
}

.download-section {
  margin-top: 2.5rem;
  text-align: center;
}

.download-actions {
  margin-top: 1rem;
}