body{
    background-color: #000;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
main{height: 100vh;}
.brand{height: 18vh; min-height: 80px;}
.subbrand{height: 80pt;}
.degradee-dark-top{
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0));
}
.vh-100-custom{height: calc(100vh - 60px);}
#miniplayer{
  opacity: .25;
  transition: 0.4s;
}
#miniplayer:hover{
  opacity: 1;
}
.btn-modal-close-md{opacity: 0.7; transition: 0.4s}
.btn-modal-close-md:hover{opacity: 1;}
.h-85{height: 85% !important;}
.backdrop-blur-10{backdrop-filter: blur(10px);}

.card-button{
  box-shadow: var(--bs-box-shadow-sm);
  opacity: 0.8;
  transition: 0.4s;
  top: 0px;;
}
.card-button:hover, .card-button:focus{
  box-shadow: var(--bs-box-shadow-lg);
  opacity: 1;
  top: -1rem;
  border-color: var(--bs-orange) !important;
}
.card-img-top{
  background-attachment: scroll;
  background-position: top center;
  background-size: 400px auto;
  height: 100px;
}
.no-arrow-dropdownmenu::after{
    display: none !important;
}
#modal-material [name="modal-title-bg"]{
  background: url(../../assets/jpgs/35aniversary-bar-promo.jpg) fixed no-repeat center;
  background-size: cover;
}
#modal-comunidade [name="modal-title-bg"]{
  background: url(../../assets/jpgs/35anniversarySFpromo.jpg) fixed no-repeat center;
  background-size: cover;
}
.modal [name="modal-title-text"]{
  background: url(../../assets/svgs/under-brush-dark.svg) scroll no-repeat center center;
  background-size: 600px 350px;
}
#offcanvas-sfcards [name="offcanvas-banner"]{
  height: 200px;
  background: url(../../assets/jpgs/sfcards-preview.jpg) fixed center center; 
  background-size: cover;
}


.img-icon-2x{width: 2rem;}


.offcanvas-backdrop.show {
  z-index: 1060;
}
.offcanvas{
  z-index: 1065;
}
.nav{padding-bottom: 60px;}
.nav-underbrush .nav-link{
  position: relative;
  font-weight: 600;
  letter-spacing: 1pt;
  font-size: larger;
  text-align: start;
  transition: 0.4s;
  opacity: 0.6;
  padding: 1.25rem 0.5rem;
  min-width: 300px;
}
.nav-underbrush .nav-link.active{
  opacity: 1.0;
}
.nav-underbrush .nav-link.active .brush-marker{
  width: 100%;
  opacity: 1.0 !important;
}
.nav-underbrush .nav-link .brush-marker{
  position: absolute;
  z-index: 0;
  top: 0.5rem;
  left: 0;
  overflow: hidden;
  width: 0;
  transition: 0.2s;
}
.nav-underbrush .nav-link:hover .brush-marker{
  position: absolute;
  z-index: 0;
  top: 0.5rem;
  overflow: hidden;
  width: 100%;
  transition: 0.4s;
}
.nav-underbrush .nav-link img{
  height: 3em;
}
.nav-underbrush .nav-link:hover, .nav-underbrush .nav-link:focus{opacity: 1.0;}
.nav-underbrush .nav-link:hover img, .nav-underbrush .nav-link:focus img{opacity: 0.6;}
.nav-underbrush .nav-link.active:focus img{opacity: 1.0;}
.text-stroke{
  text-shadow: rgb(0, 0, 0) 3px 0px 0px, rgb(0, 0, 0) 2.83487px 0.981584px 0px, rgb(0, 0, 0) 2.35766px 1.85511px 0px, rgb(0, 0, 0) 1.62091px 2.52441px 0px, rgb(0, 0, 0) 0.705713px 2.91581px 0px, rgb(0, 0, 0) -0.287171px 2.98622px 0px, rgb(0, 0, 0) -1.24844px 2.72789px 0px, rgb(0, 0, 0) -2.07227px 2.16926px 0px, rgb(0, 0, 0) -2.66798px 1.37182px 0px, rgb(0, 0, 0) -2.96998px 0.42336px 0px, rgb(0, 0, 0) -2.94502px -0.571704px 0px, rgb(0, 0, 0) -2.59586px -1.50383px 0px, rgb(0, 0, 0) -1.96093px -2.27041px 0px, rgb(0, 0, 0) -1.11013px -2.78704px 0px, rgb(0, 0, 0) -0.137119px -2.99686px 0px, rgb(0, 0, 0) 0.850987px -2.87677px 0px, rgb(0, 0, 0) 1.74541px -2.43999px 0px, rgb(0, 0, 0) 2.44769px -1.73459px 0px, rgb(0, 0, 0) 2.88051px -0.838247px 0px;
}

/* Classe de animação */
.animate-fade-up {
    animation: fadeUp 0.6s ease-out forwards;
}

/* Keyframes da animação */
@keyframes fadeUp {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* MARQUEE */
.marquee-container {
  width: 100px;                  /* Largura da área de exibição */
  overflow: hidden;             /* Oculta o texto que sai da caixa */
  white-space: nowrap;          /* Impede que o texto quebre a linha */
  background-color: #f1f1f1;
  padding: 5px 0;
}

.marquee-text {
  display: inline-block;
  padding-left: 100%;           /* Inicia completamente fora da tela, à direita */
  animation: scroll-text 15s linear infinite; /* Define a animação */
}

/* MARQUEE Configuração do movimento */
@keyframes scroll-text {
  0% {
    transform: translate(0, 0);   /* Posição inicial */
  }
  100% {
    transform: translate(-100%, 0); /* Move todo o texto para fora, à esquerda */
  }
}

/* styles.css - Versão completa com todas as cores */

/* ============================================
   1. TEXT GLOW CLASSES PARA TODAS AS CORES
   (Incluindo básicas do Bootstrap)
   ============================================ */

/* ========== CORES DO BOOTSTRAP (básicas) ========== */

/* Primary */
.text-primary-glow {
  text-shadow: 0 0 0.5em var(--bs-primary), 0 0 0.2em var(--bs-primary);
}
.text-primary-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-primary), 0 0 0.1em var(--bs-primary);
}
.text-primary-lg-glow {
  text-shadow: 0 0 1em var(--bs-primary), 0 0 0.4em var(--bs-primary);
}

/* Secondary */
.text-secondary-glow {
  text-shadow: 0 0 0.5em var(--bs-secondary), 0 0 0.2em var(--bs-secondary);
}
.text-secondary-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-secondary), 0 0 0.1em var(--bs-secondary);
}
.text-secondary-lg-glow {
  text-shadow: 0 0 1em var(--bs-secondary), 0 0 0.4em var(--bs-secondary);
}

/* Success */
.text-success-glow {
  text-shadow: 0 0 0.5em var(--bs-success), 0 0 0.2em var(--bs-success);
}
.text-success-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-success), 0 0 0.1em var(--bs-success);
}
.text-success-lg-glow {
  text-shadow: 0 0 1em var(--bs-success), 0 0 0.4em var(--bs-success);
}

/* Danger */
.text-danger-glow {
  text-shadow: 0 0 0.5em var(--bs-danger), 0 0 0.2em var(--bs-danger);
}
.text-danger-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-danger), 0 0 0.1em var(--bs-danger);
}
.text-danger-lg-glow {
  text-shadow: 0 0 1em var(--bs-danger), 0 0 0.4em var(--bs-danger);
}

/* Warning */
.text-warning-glow {
  text-shadow: 0 0 0.5em var(--bs-warning), 0 0 0.2em var(--bs-warning);
}
.text-warning-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-warning), 0 0 0.1em var(--bs-warning);
}
.text-warning-lg-glow {
  text-shadow: 0 0 1em var(--bs-warning), 0 0 0.4em var(--bs-warning);
}

/* Info */
.text-info-glow {
  text-shadow: 0 0 0.5em var(--bs-info), 0 0 0.2em var(--bs-info);
}
.text-info-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-info), 0 0 0.1em var(--bs-info);
}
.text-info-lg-glow {
  text-shadow: 0 0 1em var(--bs-info), 0 0 0.4em var(--bs-info);
}

/* Light */
.text-light-glow {
  text-shadow: 0 0 0.5em var(--bs-light), 0 0 0.2em var(--bs-light);
}
.text-light-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-light), 0 0 0.1em var(--bs-light);
}
.text-light-lg-glow {
  text-shadow: 0 0 1em var(--bs-light), 0 0 0.4em var(--bs-light);
}

/* Dark */
.text-dark-glow {
  text-shadow: 0 0 0.5em var(--bs-dark), 0 0 0.2em var(--bs-dark);
}
.text-dark-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-dark), 0 0 0.1em var(--bs-dark);
}
.text-dark-lg-glow {
  text-shadow: 0 0 1em var(--bs-dark), 0 0 0.4em var(--bs-dark);
}

/* White */
.text-white-glow {
  text-shadow: 0 0 0.5em var(--bs-white), 0 0 0.2em var(--bs-white);
}
.text-white-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-white), 0 0 0.1em var(--bs-white);
}
.text-white-lg-glow {
  text-shadow: 0 0 1em var(--bs-white), 0 0 0.4em var(--bs-white);
}

/* Black */
.text-black-glow {
  text-shadow: 0 0 0.5em var(--bs-black), 0 0 0.2em var(--bs-black);
}
.text-black-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-black), 0 0 0.1em var(--bs-black);
}
.text-black-lg-glow {
  text-shadow: 0 0 1em var(--bs-black), 0 0 0.4em var(--bs-black);
}

/* ========== CORES EXTRAS (Body, Emphasis, etc) ========== */

/* Body */
.text-body-glow {
  text-shadow: 0 0 0.5em var(--bs-body-color), 0 0 0.2em var(--bs-body-color);
}
.text-body-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-body-color), 0 0 0.1em var(--bs-body-color);
}
.text-body-lg-glow {
  text-shadow: 0 0 1em var(--bs-body-color), 0 0 0.4em var(--bs-body-color);
}

/* Body Secondary (texto secundário) */
.text-body-secondary-glow {
  text-shadow: 0 0 0.5em var(--bs-secondary-color), 0 0 0.2em var(--bs-secondary-color);
}
.text-body-secondary-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-secondary-color), 0 0 0.1em var(--bs-secondary-color);
}
.text-body-secondary-lg-glow {
  text-shadow: 0 0 1em var(--bs-secondary-color), 0 0 0.4em var(--bs-secondary-color);
}

/* Body Tertiary */
.text-body-tertiary-glow {
  text-shadow: 0 0 0.5em var(--bs-tertiary-color), 0 0 0.2em var(--bs-tertiary-color);
}
.text-body-tertiary-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-tertiary-color), 0 0 0.1em var(--bs-tertiary-color);
}
.text-body-tertiary-lg-glow {
  text-shadow: 0 0 1em var(--bs-tertiary-color), 0 0 0.4em var(--bs-tertiary-color);
}

/* Emphasis */
.text-emphasis-glow {
  text-shadow: 0 0 0.5em var(--bs-emphasis-color), 0 0 0.2em var(--bs-emphasis-color);
}
.text-emphasis-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-emphasis-color), 0 0 0.1em var(--bs-emphasis-color);
}
.text-emphasis-lg-glow {
  text-shadow: 0 0 1em var(--bs-emphasis-color), 0 0 0.4em var(--bs-emphasis-color);
}

/* ========== CORES EXTRAS (Indigo, Purple, etc) ========== */

/* Indigo */
.text-indigo-glow {
  text-shadow: 0 0 0.5em var(--bs-indigo), 0 0 0.2em var(--bs-indigo);
}
.text-indigo-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-indigo), 0 0 0.1em var(--bs-indigo);
}
.text-indigo-lg-glow {
  text-shadow: 0 0 1em var(--bs-indigo), 0 0 0.4em var(--bs-indigo);
}

/* Purple */
.text-purple-glow {
  text-shadow: 0 0 0.5em var(--bs-purple), 0 0 0.2em var(--bs-purple);
}
.text-purple-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-purple), 0 0 0.1em var(--bs-purple);
}
.text-purple-lg-glow {
  text-shadow: 0 0 1em var(--bs-purple), 0 0 0.4em var(--bs-purple);
}

/* Pink */
.text-pink-glow {
  text-shadow: 0 0 0.5em var(--bs-pink), 0 0 0.2em var(--bs-pink);
}
.text-pink-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-pink), 0 0 0.1em var(--bs-pink);
}
.text-pink-lg-glow {
  text-shadow: 0 0 1em var(--bs-pink), 0 0 0.4em var(--bs-pink);
}

/* Orange */
.text-orange-glow {
  text-shadow: 0 0 0.5em var(--bs-orange), 0 0 0.2em var(--bs-orange);
}
.text-orange-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-orange), 0 0 0.1em var(--bs-orange);
}
.text-orange-lg-glow {
  text-shadow: 0 0 1em var(--bs-orange), 0 0 0.4em var(--bs-orange);
}

/* Teal */
.text-teal-glow {
  text-shadow: 0 0 0.5em var(--bs-teal), 0 0 0.2em var(--bs-teal);
}
.text-teal-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-teal), 0 0 0.1em var(--bs-teal);
}
.text-teal-lg-glow {
  text-shadow: 0 0 1em var(--bs-teal), 0 0 0.4em var(--bs-teal);
}

/* Cyan */
.text-cyan-glow {
  text-shadow: 0 0 0.5em var(--bs-cyan), 0 0 0.2em var(--bs-cyan);
}
.text-cyan-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-cyan), 0 0 0.1em var(--bs-cyan);
}
.text-cyan-lg-glow {
  text-shadow: 0 0 1em var(--bs-cyan), 0 0 0.4em var(--bs-cyan);
}

/* Red (já existe no Bootstrap como danger, mas incluindo para consistência) */
.text-red-glow {
  text-shadow: 0 0 0.5em var(--bs-red), 0 0 0.2em var(--bs-red);
}
.text-red-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-red), 0 0 0.1em var(--bs-red);
}
.text-red-lg-glow {
  text-shadow: 0 0 1em var(--bs-red), 0 0 0.4em var(--bs-red);
}

/* Yellow */
.text-yellow-glow {
  text-shadow: 0 0 0.5em var(--bs-yellow), 0 0 0.2em var(--bs-yellow);
}
.text-yellow-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-yellow), 0 0 0.1em var(--bs-yellow);
}
.text-yellow-lg-glow {
  text-shadow: 0 0 1em var(--bs-yellow), 0 0 0.4em var(--bs-yellow);
}

/* Green */
.text-green-glow {
  text-shadow: 0 0 0.5em var(--bs-green), 0 0 0.2em var(--bs-green);
}
.text-green-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-green), 0 0 0.1em var(--bs-green);
}
.text-green-lg-glow {
  text-shadow: 0 0 1em var(--bs-green), 0 0 0.4em var(--bs-green);
}

/* Blue */
.text-blue-glow {
  text-shadow: 0 0 0.5em var(--bs-blue), 0 0 0.2em var(--bs-blue);
}
.text-blue-sm-glow {
  text-shadow: 0 0 0.25em var(--bs-blue), 0 0 0.1em var(--bs-blue);
}
.text-blue-lg-glow {
  text-shadow: 0 0 1em var(--bs-blue), 0 0 0.4em var(--bs-blue);
}

/* ========== TEXT COLOR CLASSES PARA CORES NÃO PADRÃO ========== */

.text-indigo {
  color: var(--bs-indigo) !important;
}

.text-purple {
  color: var(--bs-purple) !important;
}

.text-pink {
  color: var(--bs-pink) !important;
}

.text-orange {
  color: var(--bs-orange) !important;
}

.text-teal {
  color: var(--bs-teal) !important;
}

.text-cyan {
  color: var(--bs-cyan) !important;
}

.text-red {
  color: var(--bs-red) !important;
}

.text-yellow {
  color: var(--bs-yellow) !important;
}

.text-green {
  color: var(--bs-green) !important;
}

.text-blue {
  color: var(--bs-blue) !important;
}

/* Hover effect para todos os glows */
.glow-hover:hover {
  text-shadow: 0 0 calc(1em * 1.2), 0 0 calc(0.4em * 1.2);
  transition: text-shadow 0.2s ease;
}

/* Versão simples */
.text-smallcaps {
  font-variant: small-caps !important;
}

/* Força todas as letras em smallcaps */
.text-all-smallcaps {
  font-variant: all-small-caps !important;
}