/*
Theme Name: Saw Child Theme
Theme URI: https://saw.themerex.net/
Description: Saw is a Premium WordPress theme that has built-in support for popular Page Builders, slider with swipe gestures, and is SEO- and Retina-ready. The unique system of inheritance and override options allows setting up individual parameters for different sections of your site and supported plugins.
Author: ThemeREX
Author URI: https://themerex.net/
Version: 1.5.0
Tested up to: 6.8
Requires at least: 5.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, e-commerce, portfolio, grid-layout, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-logo, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, footer-widgets, full-width-template, microformats, post-formats, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks
Text Domain: saw
Template: saw
*/


/* =Child-Theme customization starts here
------------------------------------------------------------ */

/* =========================================================================
   OG Cannabis — folha de estilo da marca
   Instalar em: wp-content/themes/saw-child/style.css (ou Elementor > CSS personalizado do site)
   Depende de: (1) as duas fontes em wp-content/themes/saw-child/fonts/ — os @font-face
   abaixo usam caminho RELATIVO, então esta folha precisa estar no diretório do tema filho;
   colada no painel de CSS do Elementor os caminhos quebram e nenhuma fonte carrega;
   (2) og-classes.php colado no functions.php do tema filho, para o campo de cor por produto;
   (3) Elementor > Configurações do site > Fontes globais apontando para OG Serif e OG Grot,
   e Google Fonts desativado em Configurações > Recursos. O Elementor escreve CSS por widget
   com especificidade alta: brigar com !important a partir daqui é frágil, o ponto certo de
   override são as Fontes globais.
   Sistema: Shaoyang Design, Direction 1 (2023). Serifa manda, grotesca é rótulo.
   ========================================================================= */

/* ---------- 1. Fontes ----------------------------------------------------
   OS DOIS ARQUIVOS .woff2 NÃO ACOMPANHAM ESTE PACOTE — pendência de licença, explicada em
   fonts/LEIA-ANTES-DE-USAR.md. As declarações abaixo ficam prontas: quando a OG enviar as
   faces web, basta colocá-las em saw-child/fonts/ e elas passam a valer sem tocar no CSS.
   Até lá vale a pilha de fallback (Georgia / Arial Narrow), que mantém o site legível.
   Não procurar os arquivos no pacote nem substituí-los por fontes do Google.
*/

@font-face{
  font-family:'OG Serif';                 /* Nimbus Roman D — texto e display */
  src:url('fonts/nimbus-roman.woff2') format('woff2');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'OG Grot';                  /* Grotesque MT Condensed — só rótulos */
  src:url('fonts/grotesque-condensed.woff2') format('woff2');
  font-weight:400; font-style:normal; font-display:swap;
}

/* ---------- 2. Tokens ---------------------------------------------------- */

:root{
  --og-paper:#FFFEF2;      /* fundo padrão de toda a página */
  --og-ink:#000000;        /* texto, botões, rodapé */
  --og-soft:#565343;       /* corpo de texto secundário */
  --og-faint:#8C8A78;      /* rótulos, legendas */
  --og-line:#E6E2D0;       /* filetes */

  /* Campos de cor — fundo inteiro, nunca marca-texto.
     REGRA ATUAL (set/2026): a cor do fundo é a da EMBALAGEM DAQUELE produto, não da
     categoria. Uma parede do mesmo pastel ao longo de uma linha lê pior. Cada SKU tem
     a sua, listada mais abaixo em .product-<slug>.
     O lime deixou de ser cor de linha e voltou a ser só acento de marca (a marca, o CTA). */
  --og-lime:#CDE271;       /* acento de marca — NÃO usar como fundo de produto */
  --og-lav:#E1D2E7;
  --og-sage:#D3D9D2;
  --og-blue:#C9D7DF;
  --og-shot-default:#EDEADA;   /* fundo neutro, se um SKU novo ainda não tiver cor */

  --og-pad:clamp(20px,5vw,64px);
}

/* Cores globais equivalentes no Elementor (Configurações do site > Cores globais):
   Primária   #000000   Secundária #FFFEF2   Texto #565343   Destaque #CDE271
   Remover o roxo do tema. Nenhum botão da OG é roxo.                        */

/* ---------- 3. Base ------------------------------------------------------ */

body,
.elementor-widget-text-editor,
.woocommerce{
  background:var(--og-paper);
  color:var(--og-ink);
  font-family:'OG Serif',Georgia,'Times New Roman',serif;
  font-size:17px;
  line-height:1.6;
}

h1,h2,h3,h4,
.elementor-heading-title,
.woocommerce-loop-product__title,
.product_title{
  font-family:'OG Serif',Georgia,serif;
  font-weight:400;                       /* a serifa nunca vai a bold */
  letter-spacing:-.01em;
  line-height:1.12;
  text-wrap:balance;
}
h1,.product_title{font-size:clamp(30px,4.4vw,54px);}
h2{font-size:clamp(24px,3vw,34px);}

/* A grotesca aparece SÓ aqui: rótulos, navegação, preço, botão. */
.og-lab,
.woocommerce .price,
.wc-block-components-product-price,
.main-menu a,
.menu a,
.btn, .button, .wp-element-button,
.woocommerce a.button, .woocommerce button.button,
.woocommerce #respond input#submit{
  font-family:'OG Grot','Arial Narrow',sans-serif;
  font-weight:400;
}
.og-lab{
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:11px;
  color:var(--og-faint);
  display:block;
}

/* ---------- 4. Botões ---------------------------------------------------- */

.btn, .button, .wp-element-button,
.woocommerce a.button, .woocommerce button.button,
.woocommerce #respond input#submit,
.woocommerce .single_add_to_cart_button{
  background:var(--og-ink);
  color:var(--og-paper);
  border:none;
  border-radius:0;                       /* nada arredondado no sistema */
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:12px;
  padding:15px 30px;
}
.btn:hover, .button:hover, .woocommerce a.button:hover,
.woocommerce button.button:hover{background:#2b2b2b;color:var(--og-paper);}

/* ---------- 5. Loja: uma ficha por produto ------------------------------- */

.woocommerce ul.products{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:0;
  border-left:1px solid var(--og-line);
  margin:0;
}
.woocommerce ul.products li.product{
  width:auto; margin:0; float:none;
  border-right:1px solid var(--og-line);
  border-bottom:1px solid var(--og-line);
  display:flex; flex-direction:column;
  text-align:left;
}

/* a foto vive dentro do campo de cor da categoria */
.woocommerce ul.products li.product a img{
  aspect-ratio:4/5;
  object-fit:contain;                    /* contain: nada de produto cortado */
  margin:0;
  background:var(--og-shot-default);     /* padrão; a regra por SKU troca */
  transition:transform .5s ease;
}
.woocommerce ul.products li.product:hover a img{transform:scale(1.03);}

/* Um campo de cor por SKU.

   ATENÇÃO, LEIA ANTES: as classes abaixo NÃO existem no WordPress de fábrica. O que o
   WooCommerce gera é `postid-1234` e `post-1234`, por ID numérico, que muda de ambiente
   para ambiente. Para estas regras valerem é preciso colar o arquivo og-classes.php no
   functions.php do tema filho (dois filtros, ~20 linhas). Sem ele a tipografia e as cores
   gerais funcionam, mas o campo de cor por produto não aparece.

   OS SELETORES ABAIXO JÁ ESTÃO NOS SLUGS REAIS do ambiente, lidos do sitemap público de
   hml.ogcannabis.com.br em 08/09/2026. NÃO renomear os slugs dos produtos que já existem:
   o item 12 desta entrega (redirects 301) depende de as URLs atuais continuarem valendo.
   Os nove produtos que ainda não existem devem ser criados com os slugs exatos marcados
   como A CRIAR — foi assim que estes seletores foram escritos.

   Cor medida a partir da própria foto: matiz dominante da embalagem, puxada para o registro
   pastel da OG e afastada do produto para ele não sumir no próprio fundo. */

/* --- Fitocompleto ------------------------------------------------------- */
.product-blue-orchid-oleo-de-cbd-organico .og-shot,
.product-blue-orchid-oleo-de-cbd-organico a img{background:#BEDAE6;}
.product-oregon-sweetgum-oleo-de-cbd-organico .og-shot,
.product-oregon-sweetgum-oleo-de-cbd-organico a img{background:#E6CFBE;}
.product-sour-pineapple-oleo-cbd-organico .og-shot,
.product-sour-pineapple-oleo-cbd-organico a img{background:#E6DDBE;}
.product-white-cbg-oleo-de-cbg-organico .og-shot,
.product-white-cbg-oleo-de-cbg-organico a img{background:#BEE6DB;}

/* --- Formulados --------------------------------------------------------- */
.product-oleo-de-cbd-organico-2000mg-cbd-espectro-completo .og-shot,
.product-oleo-de-cbd-organico-2000mg-cbd-espectro-completo a img{background:#E6BEDE;}
.product-oleo-de-cbd-organico-2000mg-cbd-espectro-amplo-sem-thc .og-shot,
.product-oleo-de-cbd-organico-2000mg-cbd-espectro-amplo-sem-thc a img{background:#BEDEE6;}
.product-oleo-de-cbg-organico-2000mg-cbg-espectro-amplo-sem-thc .og-shot,
.product-oleo-de-cbg-organico-2000mg-cbg-espectro-amplo-sem-thc a img{background:#E6B9A5;}
.product-oleo-de-cbda-organico-800mg-cbd-800mg-cbda-espectro-completo .og-shot,
.product-oleo-de-cbda-organico-800mg-cbd-800mg-cbda-espectro-completo a img{background:#E6DEA5;}
.product-oleo-de-cbd-e-cbc-organico-800mg-cbd-200mg-cbc-espectro-completo .og-shot,
.product-oleo-de-cbd-e-cbc-organico-800mg-cbd-200mg-cbc-espectro-completo a img{background:#E6BECD;}
/* A CRIAR */
.product-oleo-de-cbn-e-cbd-organico-800mg-cbn-200mg-cbd-sem-thc .og-shot,
.product-oleo-de-cbn-e-cbd-organico-800mg-cbn-200mg-cbd-sem-thc a img{background:#BEC4E6;}

/* --- Hidrossolúvel ------------------------------------------------------ */
.product-cbd-drops-organico .og-shot,
.product-cbd-drops-organico a img{background:#BEE6C4;}

/* --- Tópicos · pomadas (56 g) · TODOS A CRIAR --------------------------- */
.product-pomada-cbd-organica-1000mg-cbd-espectro-completo .og-shot,
.product-pomada-cbd-organica-1000mg-cbd-espectro-completo a img{background:#E0BEE6;}
.product-pomada-cbd-organica-1000mg-cbd-sem-thc .og-shot,
.product-pomada-cbd-organica-1000mg-cbd-sem-thc a img{background:#BEDDE6;}
.product-pomada-cbg-e-cbd-organica-500mg-cbg-500mg-cbd-espectro-completo .og-shot,
.product-pomada-cbg-e-cbd-organica-500mg-cbg-500mg-cbd-espectro-completo a img{background:#E6ACA5;}
.product-pomada-cbg-e-cbd-organica-500mg-cbg-500mg-cbd-sem-thc .og-shot,
.product-pomada-cbg-e-cbd-organica-500mg-cbg-500mg-cbd-sem-thc a img{background:#E6B8A5;}

/* --- Tópicos · cremes (236 ml) · TODOS A CRIAR -------------------------- */
.product-creme-cbd-organico-3000mg-cbd-espectro-completo .og-shot,
.product-creme-cbd-organico-3000mg-cbd-espectro-completo a img{background:#CABEE6;}
.product-creme-cbd-organico-3000mg-cbd-sem-thc .og-shot,
.product-creme-cbd-organico-3000mg-cbd-sem-thc a img{background:#A5C4E6;}
.product-creme-cbg-e-cbd-organico-1500mg-cbg-1500mg-cbd-espectro-completo .og-shot,
.product-creme-cbg-e-cbd-organico-1500mg-cbg-1500mg-cbd-espectro-completo a img{background:#E6BEC7;}
.product-creme-cbg-e-cbd-organico-1500mg-cbg-1500mg-cbd-sem-thc .og-shot,
.product-creme-cbg-e-cbd-organico-1500mg-cbg-1500mg-cbd-sem-thc a img{background:#E6C9BE;}

/* Óleo 1:1 CBD:THC — permanece privado, sem página pública. Sem campo de cor. */

.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:21px;
  padding:18px 22px 0;
  margin:0;
}
.woocommerce ul.products li.product .price{
  display:block;
  font-size:17px;
  color:var(--og-ink);
  font-variant-numeric:tabular-nums;
  padding:12px 22px 22px;
  margin-top:6px;
  border-top:1px solid var(--og-line);
}
/* o botão de comprar sai da grade: a ficha leva à página do produto */
.woocommerce ul.products li.product a.add_to_cart_button{display:none;}

/* ---------- 6. Página do produto ----------------------------------------- */

.single-product div.product{
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:0;
  min-height:min(78vh,640px);
}
.single-product div.product .woocommerce-product-gallery{
  width:auto; float:none; margin:0;
  background:var(--og-shot-default);     /* trocar pelo campo do próprio SKU */
  display:flex; align-items:center; justify-content:center;
  padding:clamp(24px,4vw,56px);
}
.single-product div.product .summary{
  width:auto; float:none; margin:0;
  padding:clamp(36px,5vw,72px) var(--og-pad);
  display:flex; flex-direction:column; justify-content:center;
}
.single-product .summary .price{
  font-size:30px;
  color:var(--og-ink);
  font-variant-numeric:tabular-nums;
  padding-top:22px;
  border-top:1px solid var(--og-line);
  margin-top:34px;
}

/* micro-rótulos entre colchetes — o gesto vem da embalagem do Shaoyang.
   Usar num bloco HTML na descrição curta:
   <span class="og-brk">Planta inteira</span>                                */
.og-brk{
  font-family:'OG Grot','Arial Narrow',sans-serif;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:11px;
  border:1px solid currentColor;
  padding:5px 12px;
  display:inline-block;
  margin:0 8px 8px 0;
}

/* ficha técnica: lista de definição, não parágrafo corrido */
.og-tech{display:grid;grid-template-columns:150px 1fr;margin:0;}
.og-tech dt{
  font-family:'OG Grot',sans-serif;text-transform:uppercase;letter-spacing:.13em;
  font-size:10.5px;color:var(--og-faint);padding:14px 0;border-top:1px solid var(--og-line);
}
.og-tech dd{margin:0;padding:14px 0;border-top:1px solid var(--og-line);color:var(--og-soft);}

/* ---------- 7. Rodapé ---------------------------------------------------- */

.site-footer, .og-foot{
  background:var(--og-ink);
  color:#CFCDC2;
  padding:clamp(44px,6vw,80px) var(--og-pad);
}
.site-footer a, .og-foot a{color:#CFCDC2;}

/* ---------- 8. Responsivo ------------------------------------------------ */

@media (max-width:900px){
  .single-product div.product{grid-template-columns:1fr;}
  .og-tech{grid-template-columns:120px 1fr;}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}

/* =========================================================================
   Patch de especificidade do campo de cor por SKU — instalado em 15/09/2026
   (por Terral, sobre a folha og-brand.css do pacote de 08/09/2026)

   PROBLEMA: no pacote, cada SKU pinta a foto com `.product-<slug> a img`
   (0,1,2). A regra padrão da grade, `.woocommerce ul.products li.product a img`
   (0,3,4), é mais específica e vem ganhando — resultado: todas as fichas ficavam
   com o neutro #EDEADA e o campo de cor do SKU não aparecia.

   SOLUÇÃO: cada SKU declara a sua cor numa custom property (--og-shot) no próprio
   elemento que carrega a classe `.product-<slug>` (o <li> na grade, o <body> na
   página de produto). A regra da foto/galeria consome a variável. Assim a cor do
   SKU vale nas duas superfícies, sem repetir 19 seletores longos por superfície.
   ========================================================================= */

/* a grade e a página de produto consomem a variável; o neutro fica como padrão */
.woocommerce ul.products li.product{ --og-shot: var(--og-shot-default); }
.woocommerce ul.products li.product a img{ background: var(--og-shot); }
.single-product div.product .woocommerce-product-gallery{ background: var(--og-shot, var(--og-shot-default)); }

/* cor por SKU — a mesma classe existe no <li> da grade e no <body> da página */
.product-blue-orchid-oleo-de-cbd-organico{ --og-shot:#BEDAE6; }
.product-oregon-sweetgum-oleo-de-cbd-organico{ --og-shot:#E6CFBE; }
.product-sour-pineapple-oleo-cbd-organico{ --og-shot:#E6DDBE; }
.product-white-cbg-oleo-de-cbg-organico{ --og-shot:#BEE6DB; }
.product-oleo-de-cbd-organico-2000mg-cbd-espectro-completo{ --og-shot:#E6BEDE; }
.product-oleo-de-cbd-organico-2000mg-cbd-espectro-amplo-sem-thc{ --og-shot:#BEDEE6; }
.product-oleo-de-cbg-organico-2000mg-cbg-espectro-amplo-sem-thc{ --og-shot:#E6B9A5; }
.product-oleo-de-cbda-organico-800mg-cbd-800mg-cbda-espectro-completo{ --og-shot:#E6DEA5; }
.product-oleo-de-cbd-e-cbc-organico-800mg-cbd-200mg-cbc-espectro-completo{ --og-shot:#E6BECD; }
.product-oleo-de-cbn-e-cbd-organico-800mg-cbn-200mg-cbd-sem-thc{ --og-shot:#BEC4E6; }
.product-cbd-drops-organico{ --og-shot:#BEE6C4; }
.product-pomada-cbd-organica-1000mg-cbd-espectro-completo{ --og-shot:#E0BEE6; }
.product-pomada-cbd-organica-1000mg-cbd-sem-thc{ --og-shot:#BEDDE6; }
.product-pomada-cbg-e-cbd-organica-500mg-cbg-500mg-cbd-espectro-completo{ --og-shot:#E6ACA5; }
.product-pomada-cbg-e-cbd-organica-500mg-cbg-500mg-cbd-sem-thc{ --og-shot:#E6B8A5; }
.product-creme-cbd-organico-3000mg-cbd-espectro-completo{ --og-shot:#CABEE6; }
.product-creme-cbd-organico-3000mg-cbd-sem-thc{ --og-shot:#A5C4E6; }
.product-creme-cbg-e-cbd-organico-1500mg-cbg-1500mg-cbd-espectro-completo{ --og-shot:#E6BEC7; }
.product-creme-cbg-e-cbd-organico-1500mg-cbg-1500mg-cbd-sem-thc{ --og-shot:#E6C9BE; }

/* Correção do patch acima: a regra que definia --og-shot na <li> tinha especificidade
   (0,3,2) e vencia a regra por SKU (0,1,0), anulando a cor. Aqui a variável é declarada
   com a mesma especificidade da regra padrão e vem depois — a cor do SKU passa a valer. */
.woocommerce ul.products li.product-blue-orchid-oleo-de-cbd-organico{ --og-shot:#BEDAE6; }
.woocommerce ul.products li.product-oregon-sweetgum-oleo-de-cbd-organico{ --og-shot:#E6CFBE; }
.woocommerce ul.products li.product-sour-pineapple-oleo-cbd-organico{ --og-shot:#E6DDBE; }
.woocommerce ul.products li.product-white-cbg-oleo-de-cbg-organico{ --og-shot:#BEE6DB; }
.woocommerce ul.products li.product-oleo-de-cbd-organico-2000mg-cbd-espectro-completo{ --og-shot:#E6BEDE; }
.woocommerce ul.products li.product-oleo-de-cbd-organico-2000mg-cbd-espectro-amplo-sem-thc{ --og-shot:#BEDEE6; }
.woocommerce ul.products li.product-oleo-de-cbg-organico-2000mg-cbg-espectro-amplo-sem-thc{ --og-shot:#E6B9A5; }
.woocommerce ul.products li.product-oleo-de-cbda-organico-800mg-cbd-800mg-cbda-espectro-completo{ --og-shot:#E6DEA5; }
.woocommerce ul.products li.product-oleo-de-cbd-e-cbc-organico-800mg-cbd-200mg-cbc-espectro-completo{ --og-shot:#E6BECD; }
.woocommerce ul.products li.product-oleo-de-cbn-e-cbd-organico-800mg-cbn-200mg-cbd-sem-thc{ --og-shot:#BEC4E6; }
.woocommerce ul.products li.product-cbd-drops-organico{ --og-shot:#BEE6C4; }
.woocommerce ul.products li.product-pomada-cbd-organica-1000mg-cbd-espectro-completo{ --og-shot:#E0BEE6; }
.woocommerce ul.products li.product-pomada-cbd-organica-1000mg-cbd-sem-thc{ --og-shot:#BEDDE6; }
.woocommerce ul.products li.product-pomada-cbg-e-cbd-organica-500mg-cbg-500mg-cbd-espectro-completo{ --og-shot:#E6ACA5; }
.woocommerce ul.products li.product-pomada-cbg-e-cbd-organica-500mg-cbg-500mg-cbd-sem-thc{ --og-shot:#E6B8A5; }
.woocommerce ul.products li.product-creme-cbd-organico-3000mg-cbd-espectro-completo{ --og-shot:#CABEE6; }
.woocommerce ul.products li.product-creme-cbd-organico-3000mg-cbd-sem-thc{ --og-shot:#A5C4E6; }
.woocommerce ul.products li.product-creme-cbg-e-cbd-organico-1500mg-cbg-1500mg-cbd-espectro-completo{ --og-shot:#E6BEC7; }
.woocommerce ul.products li.product-creme-cbg-e-cbd-organico-1500mg-cbg-1500mg-cbd-sem-thc{ --og-shot:#E6C9BE; }

/* ---------------------------------------------------------------------------
   Adaptação ao markup do tema Saw/ThemeREX — instalado em 15/09/2026

   O pacote assume a marcação padrão do WooCommerce (li > a > img + título + preço).
   Neste tema a ficha é li.product > .post_item > (.post_featured + .post_data), e o
   flex que o pacote aplica na <li> espremia o conteúdo (título caindo uma letra por
   linha, foto minúscula). Aqui o layout da ficha é remontado sobre a marcação real,
   mantendo o desenho do pacote: campo de cor com a foto, nome em serifa, mg e preço,
   sem sombra e sem canto arredondado, filete de 1px separando.
   --------------------------------------------------------------------------- */
.woocommerce ul.products li.product{ display:block; width:100%; min-width:0; }
.woocommerce ul.products li.product .post_item{
  display:flex; flex-direction:column; width:100%; height:100%; min-width:0;
}
.woocommerce ul.products li.product .post_featured{ width:100%; }
.woocommerce ul.products li.product .post_featured a{ display:block; width:100%; }
.woocommerce ul.products li.product .post_featured img{
  width:100%; height:auto; aspect-ratio:4/5; object-fit:contain; display:block;
}
.woocommerce ul.products li.product .post_data,
.woocommerce ul.products li.product .post_data_inner,
.woocommerce ul.products li.product .post_header{ width:100%; min-width:0; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  width:auto; min-width:0; word-break:normal; overflow-wrap:anywhere;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title a{ width:auto; display:inline; }
.woocommerce ul.products li.product .price_wrap{ width:auto; }

/* ---------------------------------------------------------------------------
   Fim do ajuste de largura da ficha na grade — 15/09/2026

   O WooCommerce traz por padrão .woocommerce ul.products.columns-3 li.product{width:30.75%}
   (0,4,2) — mais específico que a grade do pacote. Com a lista em grid de 5 colunas, cada
   ficha ficava com 30,75% da PRÓPRIA coluna, e o conteúdo caía para a largura mínima
   (título uma letra por linha). A largura da ficha precisa ser a da coluna, então aqui ela
   é reafirmada com !important — restrito a este ponto, que é o único lugar em que a regra
   de colunas do plugin precisa ser anulada.
   --------------------------------------------------------------------------- */
.woocommerce ul.products li.product,
.woocommerce ul.products[class*="columns-"] li.product,
.woocommerce-page ul.products[class*="columns-"] li.product{
  width:auto !important;
  float:none !important;
  margin:0 !important;
  padding:0 !important;
  clear:none !important;
}

/* ---------------------------------------------------------------------------
   CTA preto — 15/09/2026

   A folha do pacote já manda botão preto sobre papel, mas a cor de destaque do tema
   (o roxo) tem especificidade maior e vencia. O pacote prevê resolver isso nas Cores
   globais do Elementor e nas opções do tema; enquanto isso não é feito, aqui o CTA é
   reafirmado na folha do filho, restrito aos botões.
   --------------------------------------------------------------------------- */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce .single_add_to_cart_button,
.woocommerce ul.products li.product .button, .wp-element-button{
  background-color:var(--og-ink) !important;
  color:var(--og-paper) !important;
  border:0 !important;
  border-radius:0 !important;
  text-transform:uppercase !important;
  letter-spacing:.16em !important;
  font-size:12px !important;
  padding:15px 30px !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #respond input#submit:hover, .woocommerce .single_add_to_cart_button:hover,
.woocommerce ul.products li.product .button:hover, .wp-element-button:hover{
  background-color:#2b2b2b !important; color:var(--og-paper) !important;
}

/* O roxo do tema não vem de arquivo: vem de CSS inline gerado pelas opções do tema, com
   `body.woocommerce a.button{background:#6538f5!important}` (0,2,2). Para o CTA preto valer,
   esta regra usa a mesma ideia com especificidade maior (html + body). O caminho definitivo
   é apagar o roxo na origem (opções do tema / Cores globais do Elementor), como o pacote
   indica na ordem de execução; enquanto isso, o CTA fica correto. */
html body.woocommerce a.button, html body.woocommerce button.button, html body.woocommerce input.button,
html body.woocommerce #respond input#submit, html body.woocommerce .single_add_to_cart_button,
html body.woocommerce-page a.button, html body.woocommerce-page button.button,
html body.wp-element-button{
  background-color:var(--og-ink) !important;
  color:var(--og-paper) !important;
  border:0 !important;
  border-radius:0 !important;
}
html body.woocommerce a.button:hover, html body.woocommerce button.button:hover,
html body.woocommerce .single_add_to_cart_button:hover{
  background-color:#2b2b2b !important; color:var(--og-paper) !important;
}

/* ---------------------------------------------------------------------------
   Roxo residual — 15/09/2026

   Existe neste ambiente um bloco inline site-wide <style id="og-global-refinements">
   que aplica o roxo #6538f5 com !important em botões, selos e no slider de preço.
   A origem desse bloco não está no tema (pai ou filho), nas Opções do Tema, no
   Customizer nem no Elementor — aparenta vir de mu-plugin ou de código no painel da
   hospedagem. Enquanto isso não é corrigido na origem, estes seletores garantem que
   nenhum elemento de marca fique roxo.
   --------------------------------------------------------------------------- */
html body.woocommerce span.onsale,
html body.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
html body.woocommerce .widget_price_filter .ui-slider .ui-slider-handle,
html body.error404 article.post_item_404 .go_home,
html body.woocommerce .added_to_cart,
html body.woocommerce .wc-block-components-button{
  background-color:var(--og-ink) !important;
  border-color:var(--og-ink) !important;
  color:var(--og-paper) !important;
}
html body.woocommerce .wc-block-components-button:hover,
html body.error404 article.post_item_404 .go_home:hover{
  background-color:#2b2b2b !important;
}

/* ---------------------------------------------------------------------------
   Blocos dos templates de produto (OG-022) — 15/09/2026
   Os blocos entram pelo hook woocommerce_after_single_product_summary, dentro do
   grid de 2 colunas do template: por isso cada bloco ocupa as duas colunas.
   --------------------------------------------------------------------------- */
.single-product div.product .og-blk{grid-column:1/-1;}
.og-blk{border-top:1px solid var(--og-line);padding:clamp(26px,3.4vw,52px) var(--og-pad);}
.og-blk h2{font-size:clamp(20px,2.4vw,30px);margin:0 0 14px;}
.og-num{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:11px;letter-spacing:.14em;border:1px solid var(--og-ink);padding:3px 8px;display:inline-block;margin-bottom:14px;}
.og-destaque{font-size:clamp(17px,1.8vw,21px);color:var(--og-ink);}
.og-nota{color:var(--og-faint);font-size:13px;line-height:1.5;}
.og-entregue{display:block;font-family:'OG Grot','Arial Narrow',sans-serif;font-size:11.5px;letter-spacing:.1em;color:var(--og-soft);text-transform:uppercase;margin-top:4px;}
.og-escada{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;max-width:640px;}
.og-escada th{font-family:'OG Grot','Arial Narrow',sans-serif;text-transform:uppercase;letter-spacing:.13em;font-size:10.5px;color:var(--og-faint);text-align:left;padding:12px 8px;border-bottom:1px solid var(--og-line);font-weight:400;}
.og-escada td{padding:12px 8px;border-bottom:1px solid var(--og-line);color:var(--og-soft);}
.og-escada td:first-child{color:var(--og-ink);}
.og-barras{display:grid;gap:10px;margin:18px 0 0;max-width:640px;}
.og-barra{display:grid;grid-template-columns:78px 1fr 86px;gap:12px;align-items:center;}
.og-barra-rot{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--og-soft);}
.og-barra-trilha{background:var(--og-line);height:10px;display:block;}
.og-barra-trilha i{display:block;height:100%;background:var(--og-ink);}
.og-barra-val{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:12px;color:var(--og-faint);text-align:right;font-variant-numeric:tabular-nums;}
.og-elos{list-style:none;counter-reset:elo;padding:0;display:grid;gap:16px;max-width:760px;margin:0;}
.og-elos li{counter-increment:elo;padding-left:46px;position:relative;}
.og-elos li:before{content:counter(elo);position:absolute;left:0;top:0;font-family:'OG Grot',sans-serif;font-size:11px;border:1px solid var(--og-ink);width:28px;height:28px;display:flex;align-items:center;justify-content:center;}
.og-elos b{display:block;}
.og-elos span{color:var(--og-soft);}
.og-ervas-lista{columns:3;list-style:none;padding:0;margin:14px 0 0;font-size:14px;color:var(--og-soft);}
.og-ervas-lista li{margin-bottom:6px;}
.og-blk.og-irmaos{padding-bottom:clamp(34px,4vw,60px);}
.og-blk.og-irmaos ul.products.og-lista{border-left:0;}
.og-blk.og-irmaos ul.og-lista li.product .price{font-size:15px;}
@media(max-width:900px){.og-ervas-lista{columns:2}.og-barra{grid-template-columns:66px 1fr 72px}}

/* Gráfico do laudo e linha de lote (OG-022) — 15/09/2026 */
.og-g-titulo{max-width:660px;}
.og-grafico{width:100%;max-width:780px;height:auto;margin-top:18px;}
.og-g-lab{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:11px;letter-spacing:.1em;text-transform:uppercase;fill:var(--og-soft);}
.og-g-tick{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:10px;letter-spacing:.1em;text-transform:uppercase;fill:var(--og-faint);}
.og-lote{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:12px;letter-spacing:.05em;color:var(--og-soft);margin:0 0 10px;}
.og-lote b{color:var(--og-ink);}

/* Curva de absorção e preço por dose (OG-022) — 15/09/2026 */
.og-curva{width:100%;max-width:780px;height:auto;margin-top:18px;}
.og-g-lab-destaque{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase;fill:var(--og-ink);}
.og-g-lab-fraca{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase;fill:#C9C6B4;}
.og-por-dose{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--og-soft);margin:6px 0 0;}

/* Linha de frete e avisos do carrinho (OG-020) — 15/09/2026 */
.og-linha-frete{font-family:'OG Grot','Arial Narrow',sans-serif;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--og-soft);border-top:1px solid var(--og-line);border-bottom:1px solid var(--og-line);padding:14px 0;margin:0 0 22px;}
.og-linha-frete b{color:var(--og-ink);font-weight:400;}
.og-frete-aviso{border-left:3px solid var(--og-ink);padding:10px 14px;background:#FAF9EE;color:var(--og-soft);font-size:14px;margin:0 0 18px;}
.og-frete-aviso.og-frete-ok{border-left-color:var(--og-lime);}

/* ===== OG-025 — soft gate da Educação (15/09/2026) ===== */
.og-gate{border-top:1px solid var(--og-line);border-bottom:1px solid var(--og-line);background:#FAF9EE;padding:clamp(24px,3vw,42px);margin:34px 0;max-width:680px;}
.og-gate-t{font-size:clamp(20px,2.2vw,27px);margin:12px 0 8px;}
.og-gate-form{display:grid;gap:10px;margin-top:16px;}
.og-gate-form input[type=text],.og-gate-form input[type=email]{border:1px solid var(--og-line);background:#fff;padding:13px 14px;font-family:'OG Serif',Georgia,serif;font-size:16px;color:var(--og-ink);border-radius:0;}
.og-gate-form .button{background:var(--og-ink);color:var(--og-paper);border:0;border-radius:0;text-transform:uppercase;letter-spacing:.16em;font-size:12px;padding:15px 30px;font-family:'OG Grot','Arial Narrow',sans-serif;cursor:pointer;text-align:center;}
.og-gate-mat{font-size:13px;color:var(--og-soft);display:flex;gap:8px;align-items:center;font-family:'OG Grot','Arial Narrow',sans-serif;letter-spacing:.04em;}
.og-hp{position:absolute;left:-9999px;width:1px;height:1px;}
.og-gate-erro{font-size:13px;color:#8C3B2E;}
.og-gate-apagado{opacity:.16;pointer-events:none;user-select:none;}

/* QA OG-024 — o menu off-canvas do tema fica posicionado fora da tela à direita e
   gerava 43px de rolagem horizontal no mobile. clip (em vez de hidden) resolve sem
   quebrar o header sticky. */
html{overflow-x:clip;}
@media (max-width:900px){ body{overflow-x:clip;} .trx-addons-mobile-menu-container{max-width:100vw;} }