body {
            font-family: 'Montserrat', sans-serif;
              --gap-unit: 4px;
        }
        
        :root {
            --primary-color: #0066cc;
            --secondary-color: #004080;
            --accent-color: #ffcc00;
            --light-color: #f8f9fa;
        }
        
        .skip-link {
            position: absolute;
            top: -40px;
            left: 6px;
            background: #000;
            color: white;
            padding: 8px;
            z-index: 100;
            text-decoration: none;
        }
        
        .skip-link:focus {
            top: 0;
        }
        
        .high-contrast {
            filter: invert(1) hue-rotate(180deg);
        }
        
        @media (max-width: 600px) {
            .sm-container {
                max-width: 100% !important;
                padding-left: 0 !important;
                padding-right: 0 !important;
            }
        }



          .scrollbar-hide::-webkit-scrollbar {
    display: none;
  }
  .scrollbar-hide {
    -ms-overflow-style: none;  /* IE e Edge */
    scrollbar-width: none;     /* Firefox */
  }




/* Garante que só afete containers flex ou grid */
[class*="gap-"] {
  display: flex;
  flex-wrap: wrap;
}

/* Gaps gerais (horizontal + vertical) */
.gap-0  { gap: 0; }
.gap-0\.5 { gap: calc(var(--gap-unit) * 0.5); } /* 2px */
.gap-1  { gap: calc(var(--gap-unit) * 1); }     /* 4px */
.gap-1\.5 { gap: calc(var(--gap-unit) * 1.5); } /* 6px */
.gap-2  { gap: calc(var(--gap-unit) * 2); }     /* 8px */
.gap-2\.5 { gap: calc(var(--gap-unit) * 2.5); } /* 10px */
.gap-3  { gap: calc(var(--gap-unit) * 3); }     /* 12px */
.gap-3\.5 { gap: calc(var(--gap-unit) * 3.5); } /* 14px */
.gap-4  { gap: calc(var(--gap-unit) * 4); }     /* 16px */
.gap-5  { gap: calc(var(--gap-unit) * 5); }     /* 20px */
.gap-6  { gap: calc(var(--gap-unit) * 6); }     /* 24px */
.gap-7  { gap: calc(var(--gap-unit) * 7); }     /* 28px */
.gap-8  { gap: calc(var(--gap-unit) * 8); }     /* 32px */
.gap-9  { gap: calc(var(--gap-unit) * 9); }     /* 36px */
.gap-10 { gap: calc(var(--gap-unit) * 10); }    /* 40px */