/*
Theme Name:   Fandom Mania
Theme URI:    https://fandommania.com.br
Description:  Child theme do Hello Elementor com a identidade visual da Fandom Mania (v1.0): Portais, selos tortos, botao com sombra solida e cantos bem arredondados. As cores e fontes tambem estao no kit do Elementor; aqui fica o que o Elementor nao alcanca (WooCommerce, cards, selos).
Author:       Fandom Mania
Template:     hello-elementor
Version:      1.0.23
Text Domain:  fandom-mania
*/

/* =====================================================================
   1. TOKENS — a identidade v1.0, em um lugar so.
   Mudou a marca? Muda aqui e no kit do Elementor. Em nenhum outro lugar.
   ===================================================================== */
:root{
  --fm-roxo:#6C2BD9;
  --fm-roxo-escuro:#4B18A3;
  --fm-roxo-noite:#2C0F70;
  --fm-magenta:#FF2E9F;
  --fm-magenta-fundo:#B4157A;
  --fm-amarelo:#FFC600;
  --fm-amarelo-sombra:#C79600;
  --fm-ciano:#00E5FF;
  --fm-ciano-fundo:#0089A8;
  --fm-laranja:#FF6A3D;
  --fm-laranja-fundo:#C43E12;
  --fm-verde:#2ED47A;
  --fm-verde-fundo:#0F8148;
  --fm-tinta:#16131F;
  --fm-nuvem:#FFFDF7;
  --fm-cinza:#6B6478;
  --fm-linha:#EAE4F2;

  --fm-raio:18px;
  --fm-raio-g:26px;
  --fm-sombra:0 6px 18px rgba(22,19,31,.08);
  --fm-sombra-alta:0 14px 30px rgba(22,19,31,.16);

  --fm-display:"Baloo 2", ui-rounded, "Segoe UI", sans-serif;
  --fm-grito:"Bangers", "Baloo 2", cursive;
  --fm-corpo:"Manrope", "Segoe UI", system-ui, sans-serif;
}

/* =====================================================================
   2. BASE
   ===================================================================== */
body{
  background:var(--fm-nuvem);
  color:var(--fm-tinta);
  font-family:var(--fm-corpo);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6,
.woocommerce-loop-product__title,
.product_title,
.woocommerce-Price-amount{
  font-family:var(--fm-display);
  font-weight:800;
  line-height:1.15;
  text-wrap:balance;
}
a{color:var(--fm-roxo);}
a:hover{color:var(--fm-magenta);}
:focus-visible{outline:3px solid var(--fm-ciano); outline-offset:3px; border-radius:6px;}

/* =====================================================================
   3. BOTOES — sombra SOLIDA, sem blur. E a assinatura da marca.
   ===================================================================== */
.fm-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.wc-block-components-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-family:var(--fm-display);
  font-weight:700;
  font-size:15.5px;
  line-height:1.2;
  background:var(--fm-amarelo);
  color:var(--fm-tinta);
  padding:13px 26px;
  border:none;
  border-radius:100px;
  box-shadow:0 5px 0 var(--fm-amarelo-sombra);
  transition:transform .12s ease, box-shadow .12s ease;
  text-decoration:none;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.wc-block-components-button:hover{
  background:var(--fm-amarelo);
  color:var(--fm-tinta);
  transform:translateY(2px);
  box-shadow:0 3px 0 var(--fm-amarelo-sombra);
}
.woocommerce button.button:active,
.woocommerce a.button:active{
  transform:translateY(5px);
  box-shadow:0 0 0 var(--fm-amarelo-sombra);
}
.woocommerce a.button.fm-magenta,
.fm-btn--magenta{
  background:var(--fm-magenta); color:#fff; box-shadow:0 5px 0 var(--fm-magenta-fundo);
}
.woocommerce a.button.fm-tinta,
.fm-btn--tinta{
  background:var(--fm-tinta); color:#fff; box-shadow:0 5px 0 #000;
}
.woocommerce button.button:disabled,
.woocommerce button.button.disabled{
  background:#E6E0EF; color:#9D95AC; box-shadow:0 5px 0 #D3CADF; cursor:not-allowed;
}

/* =====================================================================
   4. SELOS — Bangers, inclinado, com sombra de adesivo.
   Nunca em bloco de texto: so em selo e chamada curta.
   ===================================================================== */
.fm-selo,
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale{
  font-family:var(--fm-grito);
  letter-spacing:.045em;
  background:var(--fm-amarelo);
  color:var(--fm-tinta);
  padding:4px 13px;
  border-radius:8px;
  font-size:14.5px;
  line-height:1.35;
  min-height:0;
  min-width:0;
  transform:rotate(-3deg);
  box-shadow:2px 2px 0 rgba(0,0,0,.22);
  top:12px;
  left:12px;
  right:auto;
  margin:0;
  position:absolute;
  z-index:2;
}
.fm-selo--exclusivo{background:var(--fm-magenta); color:#fff; transform:rotate(-2deg);}
.fm-selo--ultimas{background:var(--fm-laranja); color:#fff; transform:rotate(-4deg);}
.fm-selo--novo{background:var(--fm-amarelo); color:var(--fm-tinta);}
.fm-selo--ciano{background:var(--fm-ciano); color:var(--fm-tinta);}
/* selo "NOVO!" convive com o "OFERTA!" do Woo sem sobrepor */
.fm-selo--novo.fm-selo--empilhado{top:52px;}

.fm-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--fm-grito); letter-spacing:.08em; font-size:15px;
  background:var(--fm-amarelo); color:var(--fm-tinta);
  padding:6px 17px; border-radius:100px;
  transform:rotate(-2deg); box-shadow:3px 3px 0 rgba(0,0,0,.25);
}

/* =====================================================================
   5. PORTAIS — o elemento-assinatura. Sai do shortcode [fandom_portais].
   ===================================================================== */
.fm-portais{
  display:grid;
  grid-template-columns:repeat(var(--fm-colunas, 6), minmax(0,1fr));
  gap:16px;
  margin:0;
  padding:0;
  list-style:none;
}
.fm-portal{
  position:relative;
  aspect-ratio:1/1.08;
  border-radius:var(--fm-raio-g);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:14px;
  color:#fff;
  font-family:var(--fm-display);
  font-weight:700;
  font-size:16px;
  text-decoration:none;
  overflow:hidden;
  isolation:isolate;
  box-shadow:0 8px 20px rgba(22,19,31,.14);
  transition:transform .16s ease, box-shadow .16s ease;
  background:linear-gradient(160deg, var(--fm-roxo), var(--fm-roxo-escuro));
}
.fm-portal:hover{
  color:#fff;
  transform:translateY(-6px) rotate(-1deg);
  box-shadow:0 18px 30px rgba(22,19,31,.24);
}
.fm-portal::before{
  content:"";
  position:absolute;
  inset:-40%;
  z-index:-1;
  background:radial-gradient(circle at 50% 38%, rgba(255,255,255,.55), transparent 60%);
}
.fm-portal__ic{font-size:38px; line-height:1; margin-bottom:10px;}
.fm-portal__qtd{font-family:var(--fm-corpo); font-weight:600; font-size:12px; opacity:.88; margin-top:5px;}
.fm-portal__entrar{
  font-family:var(--fm-corpo); font-weight:700; font-size:11.5px;
  letter-spacing:.06em; text-transform:uppercase;
  margin-top:10px; opacity:0; transform:translateY(6px); transition:.16s;
}
.fm-portal:hover .fm-portal__entrar{opacity:.95; transform:none;}

/* as seis cores dos Portais, na ordem em que a grade renderiza */
.fm-portal--1{background:linear-gradient(160deg, var(--fm-magenta), var(--fm-magenta-fundo));}
.fm-portal--2{background:linear-gradient(160deg, var(--fm-roxo), var(--fm-roxo-escuro));}
.fm-portal--3{background:linear-gradient(160deg, #00C2E0, var(--fm-ciano-fundo));}
.fm-portal--4{background:linear-gradient(160deg, var(--fm-amarelo), #E08E00); color:var(--fm-tinta);}
.fm-portal--4:hover{color:var(--fm-tinta);}
.fm-portal--5{background:linear-gradient(160deg, var(--fm-laranja), var(--fm-laranja-fundo));}
.fm-portal--6{background:linear-gradient(160deg, var(--fm-verde), var(--fm-verde-fundo));}

/* =====================================================================
   6. CARDS DE PRODUTO (loja, categoria, relacionados)
   ===================================================================== */
.woocommerce ul.products{
  display:grid;
  grid-template-columns:repeat(var(--fm-colunas-loja, 4), minmax(0,1fr));
  gap:22px;
  margin:0;
  padding:0;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after{content:none;}
.woocommerce ul.products li.product{
  width:100%;
  margin:0;
  float:none;
  background:#fff;
  border:1px solid var(--fm-linha);
  border-radius:var(--fm-raio);
  box-shadow:var(--fm-sombra);
  overflow:hidden;
  position:relative;
  display:flex;
  flex-direction:column;
  padding:0 0 16px;
  transition:transform .15s ease, box-shadow .15s ease;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);
  box-shadow:var(--fm-sombra-alta);
}
.woocommerce ul.products li.product a img{
  margin:0 0 12px;
  aspect-ratio:1;
  object-fit:contain;
  background:linear-gradient(135deg,#F1E9FF,#FFE9F4);
  mix-blend-mode:multiply;
  padding:6%;
  transition:transform .25s ease;
}
.woocommerce ul.products li.product:hover a img{transform:scale(1.05);}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:15.5px;
  line-height:1.24;
  font-weight:700;
  padding:0 16px;
  margin:0 0 8px;
}
.woocommerce ul.products li.product .price{
  font-family:var(--fm-display);
  font-weight:800;
  font-size:21px;
  color:var(--fm-roxo);
  padding:0 16px;
  margin:auto 0 0;
  font-variant-numeric:tabular-nums;
}
.woocommerce ul.products li.product .price del{
  font-size:13px; color:var(--fm-cinza); font-weight:600; opacity:1;
}
.woocommerce ul.products li.product .price ins{text-decoration:none; background:none;}
.woocommerce ul.products li.product .button{
  margin:12px 16px 0;
  width:calc(100% - 32px);
  font-size:14px;
  padding:11px;
  box-shadow:0 4px 0 var(--fm-amarelo-sombra);
}
.woocommerce ul.products li.product .fm-parcela{
  padding:2px 16px 0;
  font-size:12px;
  color:var(--fm-cinza);
  font-weight:600;
}

/* =====================================================================
   7. PAGINA DE PRODUTO
   ===================================================================== */
.woocommerce div.product .product_title{font-size:clamp(26px,3.4vw,38px); margin-bottom:10px;}
.woocommerce div.product p.price,
.woocommerce div.product span.price{
  font-family:var(--fm-display);
  font-weight:800;
  font-size:38px;
  color:var(--fm-roxo);
  font-variant-numeric:tabular-nums;
  line-height:1.1;
}
.woocommerce div.product p.price del{font-size:17px; color:var(--fm-cinza); font-weight:600;}
.woocommerce div.product p.price ins{text-decoration:none; background:none;}
.woocommerce div.product .images img{border-radius:var(--fm-raio-g); background:linear-gradient(135deg,#F1E9FF,#FFE9F4);}
.woocommerce div.product form.cart .button{font-size:17px; padding:16px 34px; width:100%; max-width:340px;}
.woocommerce div.product .quantity .qty{
  border:2px solid var(--fm-tinta);
  border-radius:100px;
  padding:11px 8px;
  font-family:var(--fm-display);
  font-weight:800;
  text-align:center;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:none; border:none; border-bottom:3px solid transparent; border-radius:0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{content:none;}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  font-family:var(--fm-display); font-weight:700; font-size:16px; color:var(--fm-cinza);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{border-bottom-color:var(--fm-magenta);}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--fm-tinta);}

/* linha do Pix: aparece embaixo do preco na pagina do produto */
.fm-pix{
  display:inline-flex; align-items:center; gap:8px; margin-top:12px;
  background:#E8FBF1; color:var(--fm-verde-fundo); border:1px solid #B9F0D2;
  border-radius:100px; padding:7px 15px; font-size:13.5px; font-weight:700;
}
.fm-parcelamento{margin-top:8px; color:var(--fm-cinza); font-size:14px; font-weight:600;}

/* =====================================================================
   8. CARRINHO E FINALIZACAO
   ===================================================================== */
.woocommerce table.shop_table{border-radius:var(--fm-raio); border-color:var(--fm-linha); overflow:hidden;}
.woocommerce table.shop_table th{font-family:var(--fm-display); font-weight:700;}
.woocommerce-cart .cart_totals h2,
.woocommerce-checkout #order_review_heading{font-family:var(--fm-display); font-weight:800;}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text{
  border:1.5px solid var(--fm-linha);
  border-radius:11px;
  padding:11px 14px;
  background:#FCFAFF;
  font:inherit;
}
.woocommerce form .form-row input.input-text:focus{border-color:var(--fm-roxo); background:#fff; outline:none;}
.woocommerce-checkout #payment{background:#fff; border:1px solid var(--fm-linha); border-radius:var(--fm-raio-g);}
.woocommerce-checkout #payment ul.payment_methods li{padding:8px 0;}
.woocommerce-checkout #payment div.payment_box{
  background:#F5F1FA; border-radius:12px;
}
.woocommerce-checkout #payment div.payment_box::before{border-bottom-color:#F5F1FA;}
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info{border-top-color:var(--fm-roxo); border-radius:0 0 12px 12px;}
.woocommerce .woocommerce-error{border-top-color:var(--fm-magenta);}

/* =====================================================================
   9. FAIXA DE AVISO E RODAPE (blocos de cor cheia, principio 1 da identidade)
   ===================================================================== */
.fm-faixa-topo{
  background:var(--fm-tinta); color:#fff; font-size:13px; text-align:center;
  padding:9px 24px; font-weight:600;
}
.fm-faixa-topo b{color:var(--fm-amarelo);}

.fm-secao--roxa{background:linear-gradient(135deg, var(--fm-roxo), var(--fm-roxo-noite)); color:#fff;}
.fm-secao--magenta{background:linear-gradient(115deg, var(--fm-magenta), #7A0B52); color:#fff;}
.fm-secao--ciano{background:linear-gradient(120deg, var(--fm-ciano), #9CF7FF); color:var(--fm-tinta);}
.fm-secao--lilas{background:#F5F0FF;}
.fm-secao--clara{background:#fff;}
.fm-secao--roxa h1, .fm-secao--roxa h2, .fm-secao--magenta h1, .fm-secao--magenta h2{color:#fff;}

/* textura de halftone: use como classe no wrapper da secao no Elementor */
.fm-halftone{position:relative; isolation:isolate;}
.fm-halftone::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:-1;
  background-image:radial-gradient(rgba(255,255,255,.35) 1.5px, transparent 1.6px);
  background-size:16px 16px; opacity:.16;
}
.fm-halftone--escuro::after{
  background-image:radial-gradient(rgba(22,19,31,1) 1px, transparent 1.4px);
  background-size:14px 14px; opacity:.06;
}

/* =====================================================================
   10. RESPONSIVO
   ===================================================================== */
@media (max-width:1080px){
  .fm-portais{--fm-colunas:3;}
  .woocommerce ul.products{--fm-colunas-loja:3;}
}
@media (max-width:768px){
  .woocommerce div.product p.price,
  .woocommerce div.product span.price{font-size:30px;}
}
@media (max-width:640px){
  .fm-portais{--fm-colunas:2;}
  .woocommerce ul.products{--fm-colunas-loja:2;}
  .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:14px;}
  .fm-selo,
  .woocommerce span.onsale{font-size:13px; padding:3px 10px;}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important;}
}

/* =====================================================================
   11. A SECAO — o esqueleto que faltava
   As cores (.fm-secao--roxa, --magenta, --lilas, --clara) ja existiam;
   faltava quem desse respiro e largura ao conteudo dentro delas.
   ===================================================================== */
.fm-secao{
  padding:clamp(2.2rem, 1rem + 4vw, 4.2rem) 1.25rem;
  margin:0;
}
.fm-secao__interno{
  width:min(72rem, 100%);
  margin-inline:auto;
  display:flex;
  flex-direction:column;
  gap:1.1rem;
}
.fm-secao__titulo{
  font-family:var(--fm-grito, inherit);
  font-size:clamp(1.5rem, 1.1rem + 1.4vw, 2.2rem);
  margin:0 0 .3rem;
  text-wrap:balance;
}

/* o hero: mesma secao, so que mais alta e com a linha mais larga */
.fm-hero{ align-items:flex-start; gap:1rem; padding-block:clamp(1rem,.5rem+2vw,2rem); }
.fm-hero__titulo{
  font-family:var(--fm-grito, inherit);
  font-size:clamp(2rem, 1.2rem + 3.4vw, 3.4rem);
  line-height:1.05; margin:0; text-wrap:balance;
}
.fm-hero__linha{ max-width:46ch; font-size:clamp(1rem,.95rem+.3vw,1.15rem); margin:0; }

/* o botao do hero e um link, nao um <button> do WooCommerce */
a.fm-btn--magenta{
  display:inline-block; text-decoration:none; font-weight:700;
  padding:.8rem 1.5rem; border-radius:100px;
}
a.fm-btn--magenta:hover{ transform:translateY(2px); box-shadow:0 3px 0 var(--fm-magenta-fundo); }

/* no celular os portais nao cabem em 5 colunas */
@media (max-width:900px){ .fm-portais{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:560px){ .fm-portais{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* dentro do portal nada e sublinhado: o card inteiro ja e o alvo do clique */
a.fm-portal, a.fm-portal:hover, a.fm-portal:focus{ text-decoration:none; }
.fm-portal__qtd{ opacity:.85; }

/* A barra de aviso empurra a pagina, nao cobre. Nasce fixed e tapava o menu. */
.woocommerce-store-notice,
p.demo_store{
  position:relative !important;
  top:auto !important; left:auto !important; right:auto !important;
  margin:0 !important; border-radius:0;
}
body.woocommerce-demo-store{ padding-top:0 !important; }

/* =====================================================================
   12. O PALCO — a peca que flutua no hero
   A sombra e um elemento SEPARADO e fica no chao: ela encolhe enquanto a
   peca sobe. E isso que faz o olho ler altura em vez de tremor.
   ===================================================================== */
.fm-palco{ position:relative; display:grid; place-items:center; min-height:min(390px, 62vw); }
.fm-palco__brilho{
  position:absolute; width:84%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 50% 45%, rgba(0,229,255,.55), rgba(255,46,159,.30) 55%, transparent 72%);
  filter:blur(10px);
}
.fm-palco__sombra{
  position:absolute; bottom:10%; left:50%;
  width:46%; height:5%; border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(10,2,30,.55), rgba(10,2,30,0) 70%);
  animation:fm-respira 5.5s ease-in-out infinite;
}
.fm-palco__link{ position:relative; display:block; line-height:0; }
.fm-palco__peca{
  display:block; width:min(340px, 74vw); height:auto;
  filter:drop-shadow(0 8px 8px rgba(8,2,26,.45)) drop-shadow(0 34px 30px rgba(8,2,26,.40));
  animation:fm-flutua 5.5s ease-in-out infinite;
  transition:opacity .32s ease;
}
@keyframes fm-flutua{
  0%,100%{ transform:translateY(0) rotate(-1.5deg); }
  50%    { transform:translateY(-16px) rotate(1.5deg); }
}
@keyframes fm-respira{
  0%,100%{ transform:translateX(-50%) scaleX(1);   opacity:.9; }
  50%    { transform:translateX(-50%) scaleX(.82); opacity:.6; }
}
.fm-palco__preco{
  position:absolute; right:2%; bottom:6%;
  background:var(--fm-amarelo, #FFC600); color:var(--fm-tinta, #16131F);
  font-family:var(--fm-grito, inherit); font-weight:800; font-size:21px;
  padding:12px 20px; border-radius:16px; transform:rotate(-4deg);
  box-shadow:4px 4px 0 rgba(0,0,0,.28); text-align:center; line-height:1.15;
}
.fm-palco__preco small{
  display:block; font-weight:700; font-size:10.5px;
  letter-spacing:.07em; text-transform:uppercase; opacity:.72;
}

/* hero em duas colunas: texto de um lado, palco do outro */
.fm-hero--palco{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(1.5rem,1rem+2vw,3rem); align-items:center;
}
@media (max-width:860px){
  .fm-hero--palco{ grid-template-columns:1fr; }
  .fm-palco{ order:-1; min-height:min(320px, 70vw); }
}

@media (prefers-reduced-motion: reduce){
  .fm-palco__peca, .fm-palco__sombra{ animation:none; }
}

/* =====================================================================
   13. PROFUNDIDADE — luz e sombra nas fotos de produto
   Duas sombras, nao uma: a de CONTATO (curta, escura, colada na peca) da o
   peso; a AMBIENTE (larga, clara) da o ar em volta. Com uma so, o produto
   parece adesivo colado.
   drop-shadow le o recorte, entao a sombra segue a silhueta — inclusive o
   vao da asa, que agora e realmente vazado.
   ===================================================================== */
ul.products li.product img,
.wc-block-grid__product-image img,
.woocommerce-loop-product__link img{
  filter:
    drop-shadow(0 2px 2px rgba(22,19,31,.20))      /* contato */
    drop-shadow(0 14px 18px rgba(22,19,31,.16));   /* ambiente */
  transition:filter .25s ease, transform .25s ease;
}
ul.products li.product:hover img,
.wc-block-grid__product:hover img{
  filter:
    drop-shadow(0 3px 3px rgba(22,19,31,.24))
    drop-shadow(0 22px 28px rgba(22,19,31,.20));
  transform:translateY(-3px);
}

/* o "chao" de luz atras da peca: um halo quente, quase imperceptivel,
   que separa o produto do branco do card sem sujar a foto */
ul.products li.product a img,
.wc-block-grid__product-image{
  background:radial-gradient(ellipse 62% 48% at 50% 62%, rgba(255,198,0,.13), rgba(255,198,0,0) 70%);
  border-radius:10px;
}

/* pagina do produto: a peca e a estrela, entao a sombra e mais presente */
.woocommerce-product-gallery__image img,
.wp-block-woocommerce-product-image img{
  filter:
    drop-shadow(0 3px 3px rgba(22,19,31,.22))
    drop-shadow(0 26px 30px rgba(22,19,31,.20));
}
.woocommerce-product-gallery{
  background:radial-gradient(ellipse 58% 46% at 50% 64%, rgba(108,43,217,.10), rgba(108,43,217,0) 72%);
  border-radius:14px;
}

/* miniatura da galeria: sombra leve, para nao competir com a principal */
.flex-control-thumbs img, .woocommerce-product-gallery__wrapper .flex-control-nav img{
  filter:drop-shadow(0 2px 4px rgba(22,19,31,.18));
}

@media (prefers-reduced-motion: reduce){
  ul.products li.product img, .wc-block-grid__product-image img{ transition:none; }
  ul.products li.product:hover img{ transform:none; }
}

/* =====================================================================
   14. "FORMA PAR COM" — sugestao de compra do produto irmao, com foto
   ===================================================================== */
.fm-par{
  display:flex; align-items:center; gap:14px;
  margin:18px 0; padding:12px 14px;
  border:1px solid var(--fm-linha,#EAE4F2); border-radius:14px;
  background:#fff; text-decoration:none; color:inherit;
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.fm-par:hover{
  border-color:var(--fm-roxo,#6C2BD9);
  box-shadow:0 8px 22px rgba(22,19,31,.12);
  transform:translateY(-2px);
}
.fm-par__moldura{
  flex:0 0 84px; width:84px; height:84px; border-radius:10px;
  display:grid; place-items:center; overflow:hidden;
  background:radial-gradient(ellipse 70% 60% at 50% 62%, rgba(255,198,0,.16), rgba(255,198,0,0) 72%);
}
.fm-par__foto{ width:100%; height:auto; filter:drop-shadow(0 3px 5px rgba(22,19,31,.22)); }
.fm-par__texto{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.fm-par__rotulo{
  font-size:.72rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--fm-cinza,#6B6478);
}
.fm-par__nome{ font-size:1rem; line-height:1.25; }
.fm-par__preco{ font-size:.95rem; }
.fm-par__cta{ font-size:.9rem; font-weight:700; color:var(--fm-roxo,#6C2BD9); margin-top:2px; }

@media (max-width:420px){
  .fm-par{ gap:10px; padding:10px; }
  .fm-par__moldura{ flex-basis:64px; width:64px; height:64px; }
}

/* =====================================================================
   15. fm-conserto-grade — a vitrine no celular
   O item da lista nao pode flutuar nem carregar largura propria quando a
   lista e uma grade: ele ficava com 48% de uma coluna de 159px = 76px.
   ===================================================================== */
.woocommerce ul.products{ display:grid; gap:18px; margin:0; padding:0; }
.woocommerce ul.products::before,
.woocommerce ul.products::after{ content:none; }

.woocommerce ul.products li.product{
  float:none !important;
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
  clear:none !important;
  display:flex; flex-direction:column;
}

/* quantas colunas, por largura de tela */
@media (max-width:479px){
  .woocommerce ul.products{ grid-template-columns:1fr !important; }
}
@media (min-width:480px) and (max-width:767px){
  .woocommerce ul.products{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (min-width:768px) and (max-width:1023px){
  .woocommerce ul.products{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (min-width:1024px){
  .woocommerce ul.products{ grid-template-columns:repeat(4,minmax(0,1fr)) !important; }
}

/* o card por dentro: nada pode transbordar da coluna */
.woocommerce ul.products li.product > *{ min-width:0; max-width:100%; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:1rem; line-height:1.3; overflow-wrap:anywhere;
}
.woocommerce ul.products li.product .price{
  font-size:1.25rem; line-height:1.25; white-space:nowrap;
}
/* NAO definir largura aqui: o tema ja define calc(100% - 32px) para casar
   com o recuo de 16px. Se eu puser 100%, o botao transborda o card. */
.woocommerce ul.products li.product a.button{
  white-space:nowrap; text-align:center;
}
.woocommerce ul.products li.product img{ width:100%; height:auto; }

/* uma coluna: foto menor e centralizada, texto na largura inteira.
   (o titulo e o preco moram DENTRO do link da imagem — nao da para
   coloca-los ao lado dela sem mexer no template do WooCommerce) */
@media (max-width:479px){
  .woocommerce ul.products li.product{ text-align:center; padding-bottom:14px; }
  .woocommerce ul.products li.product a img,
  .woocommerce ul.products li.product img{
    max-width:58%;
    display:block;                        /* sem isto o auto nao centraliza */
    margin-left:auto !important;          /* o CSS do WooCommerce zera a margem */
    margin-right:auto !important;
  }
  .woocommerce ul.products li.product .woocommerce-loop-product__title{
    font-size:1.05rem; padding-inline:10px;
  }
  .woocommerce ul.products li.product .price{ font-size:1.35rem; }
  .woocommerce ul.products li.product a.button{
    display:inline-block; margin-top:8px;   /* largura fica com o tema */
  }
}

/* =====================================================================
   16. BUSCA no cabecalho + instrucoes de retirada
   ===================================================================== */
.fm-busca{ list-style:none; display:flex; align-items:center; }
.fm-busca__form{
  display:flex; align-items:center; gap:4px;
  border:1.5px solid var(--fm-linha,#EAE4F2); border-radius:100px;
  padding:3px 4px 3px 12px; background:#fff;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.fm-busca__form:focus-within{
  border-color:var(--fm-roxo,#6C2BD9);
  box-shadow:0 0 0 3px rgba(108,43,217,.14);
}
.fm-busca__campo{
  border:0; outline:0; background:transparent;
  font:inherit; font-size:.92rem; width:9.5rem; min-width:0; padding:4px 0;
}
.fm-busca__botao{
  border:0; cursor:pointer; display:grid; place-items:center;
  width:30px; height:30px; border-radius:100px;
  background:var(--fm-roxo,#6C2BD9); color:#fff;
}
.fm-busca__botao:hover{ background:var(--fm-roxo-escuro,#4B18A3); }

@media (max-width:900px){
  .fm-busca{ width:100%; padding:8px 0; }
  .fm-busca__form{ width:100%; }
  .fm-busca__campo{ width:100%; }
}

.fm-retirada{
  margin:16px 0; padding:12px 14px;
  border-left:3px solid var(--fm-amarelo,#FFC600);
  background:rgba(255,198,0,.12); border-radius:0 10px 10px 0;
  line-height:1.5;
}

/* ============================================================
   17. CABECALHO ESCURO — a identidade "portal de luz" (24/08/2026)
   A marca e brilho sobre preto: em fundo claro o rastro do F some e a
   luminaria vira mancha. So a BARRA fica escura; o conteudo segue claro,
   porque as 25 fotos de produto foram feitas em fundo claro.
   ============================================================ */
.site-header,
header.site-header {
  background: #01000A;
  border-bottom: 1px solid #2A1060;
}
.site-header a,
.site-header .site-title,
.site-header .site-description { color: #EDE6FF; }
.site-header .menu a:hover,
.site-header .menu .current-menu-item > a { color: #FDE060; }

/* a logo no lugar do texto */
.site-header .custom-logo,
.site-header .site-branding img { max-height: 54px; width: auto; display: block; }
@media (max-width: 600px) {
  .site-header .custom-logo,
  .site-header .site-branding img { max-height: 40px; }
}

/* a caixa de busca precisa acompanhar o escuro, senao fica um retangulo
   branco gritando no meio da barra */
.site-header .fm-busca__campo {
  background: #160B33;
  border-color: #3A1A78;
  color: #EDE6FF;
}
.site-header .fm-busca__campo::placeholder { color: #9C8CC9; }
.site-header .fm-busca__botao { color: #EDE6FF; }

/* o menu sanfona do celular tambem e do cabecalho */
.site-header .site-navigation-toggle,
.site-header .menu-toggle { color: #EDE6FF; }

/* --- 17b. ajustes vistos na tela, nao supostos ---------------------------
   1. A logo em 54px deixava "MANIA" com menos de 8px de altura: ilegivel.
      Subiu para 66px, que e onde a palavra le.
   2. A descricao do site embaixo da logo empurrava o menu para outra linha e
      deixava a barra alta demais. Ela sai do cabecalho (continua no <title>,
      na busca do Google e no rodape).
   3. A tarja roxa clara em cima e o aviso da loja do WooCommerce. Do jeito que
      estava, brigava com o preto do cabecalho.
   ---------------------------------------------------------------------- */
.site-header .custom-logo,
.site-header .site-branding img { max-height: 66px; }
@media (max-width: 600px) {
  .site-header .custom-logo,
  .site-header .site-branding img { max-height: 46px; }
}
.site-header .site-description { display: none; }

.woocommerce-store-notice,
p.demo_store {
  background: #160B33;
  color: #EDE6FF;
  border-bottom: 1px solid #2A1060;
}
.woocommerce-store-notice a,
p.demo_store a { color: #FDE060; }

/* ============================================================
   18. FAIXA DO PORTAL e RODAPE ESCURO (24/08/2026)
   O rodape era TRANSPARENTE: mostrava o creme do corpo, e a marca (que e
   brilho sobre preto) lavava — a borda da arte virava um corte reto na tela.
   Nao era imagem cortada, era fundo errado.
   ============================================================ */
.site-footer,
.site-footer .footer-inner { background: #01000A; color: #C9BCEC; }
.site-footer a { color: #EDE6FF; }
.site-footer a:hover { color: #FDE060; }
.site-footer img { max-height: 88px; width: auto; }
.site-footer .copyright,
.site-footer .site-description { color: #8E7EC0; }

.fm-faixa {
  background:
    radial-gradient(120% 100% at 20% 10%, #2A1160 0%, rgba(10,4,32,0) 60%),
    radial-gradient(100% 90% at 85% 90%, #4A138F 0%, rgba(10,4,32,0) 62%),
    #05010F;
  color: #EDE6FF;
  padding: 64px 20px 72px;
  overflow: hidden;
}
.fm-faixa__interno {
  max-width: 1040px; margin: 0 auto;
  display: flex; align-items: center; gap: 56px; flex-wrap: wrap;
  justify-content: center;
}

/* ---- o portal ---- */
.fm-giro {
  position: relative; width: 300px; height: 300px; flex: none;
  display: grid; place-items: center;
}
.fm-giro__emblema { width: 190px; height: auto; position: relative; z-index: 3; }

.fm-giro__halo, .fm-giro__aro, .fm-giro__faisca {
  position: absolute; border-radius: 50%; pointer-events: none;
}
.fm-giro__halo {
  width: 260px; height: 260px; z-index: 1;
  background: radial-gradient(circle, rgba(155,47,255,.55) 0%, rgba(123,26,245,.16) 45%, rgba(0,0,0,0) 70%);
  animation: fm-pulsa 4.2s ease-in-out infinite;
}
.fm-giro__aro {
  width: 236px; height: 236px; z-index: 2;
  border: 2px solid rgba(155,47,255,.55);
  border-top-color: #FDE060;
  border-right-color: rgba(123,26,245,.15);
  animation: fm-gira 9s linear infinite;
}
.fm-giro__aro--2 {
  width: 274px; height: 274px;
  border-color: rgba(123,26,245,.30);
  border-bottom-color: #9B2FFF;
  animation: fm-gira 14s linear infinite reverse;
}
.fm-giro__faisca {
  width: 8px; height: 8px; z-index: 4; background: #FDE060;
  box-shadow: 0 0 10px 3px rgba(253,224,96,.75);
  transform-origin: 4px 4px;
  animation: fm-orbita 7s linear infinite;
}

/* ---- o selo redondo da prancha, girando ---- */
.fm-giro__selo {
  position: absolute; width: 300px; height: 300px; z-index: 2;
  animation: fm-gira 26s linear infinite;
}
.fm-giro__selo text {
  font-family: "Manrope", system-ui, sans-serif;
  font-size: 13px; font-weight: 700; letter-spacing: 4.7px;
  fill: #8E7EC0; text-transform: uppercase;
}

@keyframes fm-gira  { to { transform: rotate(360deg); } }
@keyframes fm-pulsa { 0%,100% { transform: scale(1); opacity: .85; }
                      50%     { transform: scale(1.09); opacity: 1; } }
@keyframes fm-orbita{ from { transform: rotate(0deg) translateX(122px); }
                      to   { transform: rotate(360deg) translateX(122px); } }

/* Movimento continuo incomoda de verdade quem tem enxaqueca ou vertigem.
   Quem pediu menos movimento no sistema recebe a faixa PARADA. */
@media (prefers-reduced-motion: reduce) {
  .fm-giro__halo, .fm-giro__aro, .fm-giro__faisca, .fm-giro__selo { animation: none; }
}

/* ---- o texto ao lado ---- */
.fm-faixa__texto { max-width: 420px; }
.fm-faixa__olho {
  margin: 0; font-size: 13px; letter-spacing: 3px; text-transform: uppercase;
  color: #8E7EC0; font-weight: 700;
}
.fm-faixa__titulo {
  margin: 6px 0 0; font-size: clamp(28px, 5vw, 42px); line-height: 1.06;
  letter-spacing: .5px; color: #FFFFFF; font-weight: 800;
}
.fm-faixa__titulo span { color: #FDE060; }
.fm-faixa__lista { list-style: none; padding: 0; margin: 22px 0 0; }
.fm-faixa__lista li {
  display: flex; align-items: center; gap: 12px; margin-bottom: 10px;
  font-size: 15px; letter-spacing: .4px;
}
.fm-faixa__lista li::before {
  content: ""; width: 8px; height: 8px; border-radius: 50%;
  background: #FDE060; flex: none; box-shadow: 0 0 8px rgba(253,224,96,.6);
}
.fm-faixa__botao {
  display: inline-block; margin-top: 26px; padding: 14px 30px;
  background: linear-gradient(135deg, #9B2FFF, #7B1AF5);
  color: #FFFFFF !important; text-decoration: none;
  border-radius: 999px; font-weight: 700; letter-spacing: .5px;
  box-shadow: 0 10px 26px rgba(123,26,245,.42);
  transition: transform .18s ease, box-shadow .18s ease;
}
.fm-faixa__botao:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(155,47,255,.55);
}

@media (max-width: 780px) {
  .fm-faixa { padding: 44px 18px 52px; }
  .fm-faixa__interno { gap: 30px; }
  .fm-giro { width: 240px; height: 240px; }
  .fm-giro__emblema { width: 150px; }
  .fm-giro__halo { width: 206px; height: 206px; }
  .fm-giro__aro { width: 188px; height: 188px; }
  .fm-giro__aro--2 { width: 220px; height: 220px; }
  .fm-giro__selo { width: 240px; height: 240px; }
  .fm-giro__selo text { font-size: 15px; }
  @keyframes fm-orbita { from { transform: rotate(0deg) translateX(98px); }
                         to   { transform: rotate(360deg) translateX(98px); } }
  .fm-faixa__texto { text-align: center; }
  .fm-faixa__lista li { justify-content: center; }
}

/* ============================================================
   19. TEMA ESCURO — preto e dourado no corpo da loja (24/08/2026)
   ============================================================ */
:root{
  --fm-nuvem:#0A0518;          /* fundo da pagina */
  --fm-tinta:#EDE6FF;          /* texto */
  --fm-cinza:#9C8CC9;          /* texto secundario */
  --fm-linha:#2A1060;          /* bordas */
  --fm-carta:#130827;          /* fundo de cartao/caixa */
  --fm-carta-alta:#1B0C3F;     /* cartao em destaque / hover */
  --fm-ouro:#FDE060;
  --fm-amarelo:#FDE060;
  --fm-amarelo-sombra:#C9A93A;
  --fm-roxo:#7B1AF5;
  --fm-roxo-escuro:#4A138F;
  --fm-roxo-noite:#160B33;
  --fm-sombra:0 6px 20px rgba(0,0,0,.55);
  --fm-sombra-alta:0 16px 38px rgba(0,0,0,.68);
}

body{ background:var(--fm-nuvem); color:var(--fm-tinta); }
h1,h2,h3,h4,h5{ color:#FFFFFF; }
a{ color:var(--fm-ouro); }
a:hover{ color:#FFFFFF; }
hr{ border-color:var(--fm-linha); }

/* --- caixas que eram brancas na mao --- */
.fm-par,
.fm-secao--clara,
.woocommerce-checkout #payment,
.woocommerce .cart_totals,
.woocommerce-info, .woocommerce-message, .woocommerce-error{
  background:var(--fm-carta) !important;
  color:var(--fm-tinta);
  border-color:var(--fm-linha) !important;
}
.fm-par:hover{ background:var(--fm-carta-alta); }
.fm-busca__form{ background:#160B33; }

/* --- cartao de produto na grade --- */
.woocommerce ul.products li.product,
.wc-block-grid__product{
  background:var(--fm-carta);
  border:1px solid var(--fm-linha);
  border-radius:var(--fm-raio-g);
  overflow:hidden;
}
.woocommerce ul.products li.product:hover{
  border-color:var(--fm-roxo);
  box-shadow:var(--fm-sombra-alta);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-grid__product-title{ color:#FFFFFF !important; }
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price{ color:var(--fm-ouro) !important; }
.woocommerce ul.products li.product .price del{ color:#8E7EC0 !important; }

/* --- A PLACA DA FOTO CONTINUA CLARA. Ver o cabecalho deste arquivo:
       as capas sao recortadas e muitas pecas sao PRETAS; sobre fundo preto
       elas sumiriam. --- */
.woocommerce ul.products li.product img,
.wc-block-grid__product-image img,
.woocommerce div.product .images img{
  background:linear-gradient(135deg,#F3ECFF,#FFE9F4);
  border-radius:var(--fm-raio);
}

/* --- textos e miudezas --- */
.fm-parcela, .woocommerce-result-count, .woocommerce-breadcrumb,
.woocommerce div.product .woocommerce-tabs .panel{ color:var(--fm-cinza); }
.woocommerce-breadcrumb a{ color:var(--fm-cinza); }
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:var(--fm-carta); border-color:var(--fm-linha);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{
  background:var(--fm-carta-alta); border-bottom-color:var(--fm-carta-alta);
}

/* --- formularios --- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.wc-block-components-text-input input,
input[type=text], input[type=email], input[type=tel], input[type=number],
input[type=search], input[type=password], textarea, select{
  background:#160B33 !important;
  color:var(--fm-tinta) !important;
  border-color:var(--fm-linha) !important;
}
input::placeholder, textarea::placeholder{ color:#7E6DAF !important; }
.woocommerce form .form-row input.input-text:focus{ background:#1E1046 !important; }
label, .wc-block-components-checkbox__label{ color:var(--fm-tinta); }

/* --- tabelas (carrinho, pedido) --- */
.woocommerce table.shop_table,
.woocommerce table.shop_table td,
.woocommerce table.shop_table th,
.wc-block-components-totals-item{
  background:var(--fm-carta); color:var(--fm-tinta);
  border-color:var(--fm-linha) !important;
}
.woocommerce table.shop_table thead th{ background:var(--fm-carta-alta); }

/* --- botoes: o ouro da identidade, texto escuro --- */
.woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit,
.wc-block-components-button{
  background:linear-gradient(135deg,#FDE060,#E8C23F) !important;
  color:#16131F !important;
  border:none !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .wc-block-components-button:hover{
  background:linear-gradient(135deg,#FFEC8B,#FDE060) !important;
  color:#16131F !important;
}
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt,
.woocommerce button.button.alt{
  background:linear-gradient(135deg,#9B2FFF,#7B1AF5) !important;
  color:#FFFFFF !important;
}

/* --- as faixas claras do tema viram noite --- */
.fm-secao{ background:transparent; }
.fm-secao--clara{ background:var(--fm-carta) !important; }

/* --- 19b. o multiply TEM de sair no escuro -------------------------------
   Ver comentario do gerador: multiplicar por quase-preto da quase-preto, e as
   pecas sumiam. As capas sao recortadas (alfa 0 medido), entao nao ha halo
   branco para o multiply esconder.
   ---------------------------------------------------------------------- */
.woocommerce ul.products li.product img,
.wc-block-grid__product-image img,
.woocommerce-loop-product__link img,
ul.products li.product img,
.woocommerce div.product .images img,
.woocommerce-product-gallery__image img,
.wp-block-woocommerce-product-image img{
  mix-blend-mode: normal !important;
  background: linear-gradient(135deg,#F6F0FF,#FFE9F4) !important;
  border-radius: var(--fm-raio);
}

/* --- 19c. a caixa de simulacao de frete (plugin) -------------------------
   Ela traz CSS proprio, fundo cinza claro, e o rotulo herdou a cor clara do
   tema: texto claro sobre fundo claro, ilegivel na pagina que vende.
   ---------------------------------------------------------------------- */
.containerCalculator,
.calculatorRow,
.containerCalculator .row{
  background:#130827 !important;
  color:#EDE6FF !important;
  border-color:#2A1060 !important;
}
.containerCalculator *,
.calculatorRow *{ color:#EDE6FF !important; }
.containerCalculator input,
.calculatorRow input,
input.iptCep{
  background:#160B33 !important;
  color:#EDE6FF !important;
  border:1px solid #2A1060 !important;
}
.containerCalculator input::placeholder,
input.iptCep::placeholder{ color:#7E6DAF !important; }
.containerCalculator button,
.calculatorRow button{
  background:linear-gradient(135deg,#9B2FFF,#7B1AF5) !important;
  color:#FFFFFF !important; border:none !important;
}
.containerCalculator a, .calculatorRow a{ color:#FDE060 !important; }

/* --- 19d. restos do tema claro no topo ----------------------------------- */
.fm-faixa-topo{
  background:#130827 !important;
  color:#C9BCEC !important;
  border-bottom:1px solid #2A1060;
}
.fm-faixa-topo strong, .fm-faixa-topo b{ color:#FDE060 !important; }
.fm-faixa-topo a{ color:#FDE060 !important; }

/* cards de portais: sem arco-iris, com fio dourado */
.fm-portal--1, .fm-portal--2, .fm-portal--3, .fm-portal--4, .fm-portal--5{
  background:linear-gradient(160deg,#1B0C3F,#0C0522) !important;
  border:1px solid #2A1060;
}
.fm-portal{ box-shadow:none; }
.fm-portal:hover{ border-color:#FDE060; box-shadow:0 14px 34px rgba(0,0,0,.6); }
.fm-portal__nome, .fm-portal__titulo{ color:#FFFFFF !important; }
.fm-portal__qtd{ color:#9C8CC9 !important; }
.fm-portal__entrar{ color:#FDE060 !important; }

/* --- 19e. botao dourado do hero ----------------------------------------- */
a.fm-btn--ouro{
  display:inline-block; text-decoration:none; font-weight:800;
  padding:.8rem 1.6rem; border-radius:100px; letter-spacing:.3px;
  background:linear-gradient(135deg,#FDE060,#E8C23F);
  color:#16131F;
  box-shadow:0 5px 0 #A9862A;
  transition:transform .12s ease, box-shadow .12s ease, filter .2s ease;
}
a.fm-btn--ouro:hover{ filter:brightness(1.06); color:#16131F; }
a.fm-btn--ouro:active{ transform:translateY(3px); box-shadow:0 2px 0 #A9862A; }

/* --- 19f. TEXTO ESCURO EM TODA SUPERFICIE CLARA --------------------------
   Fundo dourado/ciano/verde pede texto escuro. No tema claro isso vinha de
   var(--fm-tinta); ao inverter a variavel, virou claro sobre claro.
   Medido no "NOVO!": #FDE060 no fundo, #EDE6FF no texto -- contraste 12.
   ---------------------------------------------------------------------- */
.fm-selo,
.fm-selo--novo,
.fm-selo--ciano,
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale,
.fm-eyebrow,
.fm-palco__preco,
.fm-portal--4,
.fm-portal--4 .fm-portal__nome,
.fm-portal--4 .fm-portal__qtd{
  color:#16131F !important;
}
.fm-eyebrow *, .fm-selo *, .fm-palco__preco *{ color:#16131F !important; }
.fm-palco__preco small{ color:#3A3350 !important; }