@font-face{font-family:"Hubot Sans";font-weight:200 900;font-display:swap;src:url(../fonts/HubotSans-VF-latin.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hubot Sans";font-weight:200 900;font-display:swap;src:url(../fonts/HubotSans-VF-latin-ext.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+0300-036F,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0}
:root{
  --br:#FFFFFF; --ink:#1A1813; --line:rgba(26,24,19,.16); --mute:rgba(26,24,19,.62);
  --box:#F4F4F4; --wash:rgba(26,24,19,.05);
  --pto:#0A0908; --oliva:#728050; --marrom:#68533E; --cream:#FFFFFF;
  --sans:"Hubot Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  --gut:clamp(16px,4vw,48px);
  /* escala tipografica: passos curtos no texto de interface, largos no display */
  --t1:10.5px; --t2:12px; --t3:13.5px; --t4:15px; --t5:17px; --t6:21px;
  --t7:clamp(27px,3.2vw,38px); --t8:clamp(38px,6vw,62px);
  /* pesos: a Hubot e variavel 200-900, entao da para ter degrau de peso */
  --w4:400; --w5:500; --w6:600; --w7:700; --w8:850;
}
*{box-sizing:border-box;margin:0;padding:0}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
body{background:var(--br);color:var(--ink);font-family:var(--sans);font-weight:400;font-size:14px;
  line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
button,a{font:inherit;color:inherit;background:none;border:none;text-decoration:none;cursor:pointer}
:focus-visible{outline:2px solid var(--oliva);outline-offset:2px}
.in{max-width:1320px;margin:0 auto;padding-inline:var(--gut)}
h2.tt{font-size:var(--t7);font-weight:var(--w8);letter-spacing:.015em;
  text-transform:uppercase;line-height:.96;text-wrap:balance}
.sub{font-size:var(--t2);font-weight:var(--w6);color:var(--mute);letter-spacing:.13em;text-transform:uppercase}
.sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 24px;
  flex-wrap:wrap;border-top:1px solid var(--line);padding-top:20px;margin-bottom:28px}
.sec{padding-block:clamp(44px,5.5vw,76px)}
.selos + .sec .sec-h{border-top:none;padding-top:0}
.btn-p{display:inline-block;background:var(--pto);color:#fff;font-weight:900;font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;padding:13px 22px}
.btn-o{display:inline-block;border:1.5px solid var(--ink);font-weight:900;font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;padding:11.5px 20px}
.dia{color:var(--oliva);font-weight:900}

/* header */
header.hd{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--br)}
.hd-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;
  padding-block:16px;max-width:1320px;margin:0 auto;padding-inline:var(--gut)}
.hd nav{display:flex;gap:26px;font-size:var(--t3);font-weight:var(--w7);letter-spacing:.1em;text-transform:uppercase}
.hd nav a{position:relative;padding-block:4px}
.hd nav a[aria-expanded="true"]::after,.hd nav a:hover::after{content:"";position:absolute;
  left:0;right:0;bottom:-2px;height:2px;background:var(--ink)}
.hd .brand img{height:32px;width:auto}
.hd .tools{display:flex;justify-content:flex-end;gap:6px;align-items:center}
.ti{position:relative;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  color:var(--ink);transition:background .16s ease,color .16s ease}
.ti svg{width:21px;height:21px}
.ti:hover{background:var(--wash)}
.ti:focus-visible{outline:2px solid var(--oliva);outline-offset:2px}
.ti b{position:absolute;top:2px;right:0;background:var(--oliva);color:#fff;font-size:9px;font-weight:900;
  min-width:15px;height:15px;border-radius:50%;display:grid;place-items:center;line-height:1}
/* display:grid vence o [hidden] do navegador: o contador zerado precisa desta linha */
.ti b[hidden]{display:none}
/* salvo entra preenchido, sem login */
.fav.on{color:var(--marrom)}
.fav.on svg{fill:currentColor}
.fav b{background:var(--marrom)}
/* mega */
.mega{display:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--br)}
.mega.open{display:block}
.mega-in{max-width:1320px;margin:0 auto;padding-inline:var(--gut);padding-block:26px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.mega h4{font-size:9px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;
  color:var(--mute);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.mega ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.mega li a{display:flex;justify-content:space-between;font-size:12.5px}
.mega li em,.gav li em{display:none}
.mega .blk{background:var(--pto);margin:-26px calc(var(--gut)*-1) -26px 0;padding:26px var(--gut) 26px 26px}
.mega .blk h4{color:rgba(255,255,255,.52);border-color:rgba(255,255,255,.16)}
.mega .blk li a{color:#fff}
.mega .blk li em{color:var(--oliva)}

/* hero */
/* hero mais baixo, com barras pretas em cima e embaixo (letterbox de cinema) */
.hero{position:relative;background:var(--pto);overflow:hidden;--lb:clamp(16px,2.4vw,34px);padding-block:var(--lb);
  --hero-h:clamp(380px,calc(72svh - var(--hdr,67px)),600px)}
@media(max-width:820px){.hero{--hero-h:clamp(340px,54svh,520px);--lb:14px}}
.hero .slides{display:flex;transition:transform .5s cubic-bezier(.4,0,.2,1)}
.hero .slide{flex:0 0 100%;height:var(--hero-h)}
.hero .slide img{width:100%;height:100%;object-fit:cover}
.hero .dots{position:absolute;left:0;right:0;bottom:calc(var(--lb) + 18px);display:flex;gap:7px;justify-content:center}
.hero .dots button{width:26px;height:3px;background:rgba(255,255,255,.45)}
.hero .dots button[aria-current="true"]{background:#fff}
.hero .arw{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;
  background:rgba(255,255,255,.88);display:grid;place-items:center;font-weight:900;font-size:15px}
.hero .arw.l{left:12px}.hero .arw.r{right:12px}

/* selos */
.selos{border-bottom:1px solid var(--line)}
.selos-in{display:grid;grid-template-columns:repeat(4,1fr);max-width:1320px;margin:0 auto;
  padding-inline:var(--gut)}
.selo{display:flex;align-items:flex-start;gap:14px;padding:18px 22px;border-left:1px solid var(--line)}
.selo:first-child{border-left:none;padding-left:0}
.selo:last-child{padding-right:0}
.sl-ic{flex:none;color:var(--ink);display:block}
.sl-ic svg{width:30px;height:30px;display:block}
.sl-tx b{display:block;font-size:var(--t2);font-weight:var(--w8);letter-spacing:.11em;
  text-transform:uppercase;line-height:1.35}
.sl-tx em{display:block;font-style:normal;font-size:var(--t3);color:var(--mute);
  margin-top:6px;line-height:1.55}

/* carrossel de categorias */
.carr{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;
  scrollbar-width:thin}
.cat{flex:0 0 clamp(150px,20vw,204px);scroll-snap-align:start;position:relative;aspect-ratio:4/5;
  overflow:hidden;background:var(--wash);display:block}
.cat img{width:100%;height:100%;object-fit:cover}
.cat .lay{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,9,8,.72) 0%,rgba(10,9,8,0) 52%)}
.cat b{position:absolute;left:14px;right:14px;bottom:13px;color:#fff;font-size:12px;font-weight:900;
  letter-spacing:.09em;text-transform:uppercase;line-height:1.3}

/* grade de produtos */
.grade{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px 12px}
@media(max-width:1280px){.grade{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1000px){.grade{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:780px){.grade{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:530px){.grade{grid-template-columns:minmax(0,1fr)}}
.card{position:relative;min-width:0}
.card-foto{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--wash)}
.card-foto>img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.card:hover .card-foto>img{transform:scale(1.035)}
.card-rot{position:absolute;top:0;left:0;background:var(--ink);color:#fff;font-size:8.5px;font-weight:900;
  letter-spacing:.13em;text-transform:uppercase;padding:5px 9px;z-index:4}
.card-rot.cl{background:var(--pto)}
.card-rot.cl s{text-decoration:none;color:var(--oliva)}
.card-heart{position:absolute;top:7px;right:8px;z-index:5;width:28px;height:28px;
  display:grid;place-items:center;color:#fff;filter:drop-shadow(0 1px 4px rgba(10,9,8,.55))}
.card-heart svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;
  transition:fill .18s ease,transform .18s ease}
.card-heart:hover svg{transform:scale(1.12)}
.card-heart.on svg{fill:#fff}
/* legenda embaixo da foto: nome (marca abaixo, em caixa baixa) e preco a direita; a foto fica limpa */
.card-leg{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:10px 1px 0;line-height:1.3}
.card-leg .lg-t{display:flex;flex-direction:column;gap:3px;min-width:0}
.card-leg .lg-t b{font-size:var(--t2);font-weight:var(--w7);letter-spacing:.04em;text-transform:uppercase;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.2}
.card-leg .lg-t small{font-size:var(--t1);font-weight:var(--w5);color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card-leg .lg-p{font-style:normal;font-size:var(--t2);font-weight:var(--w6);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none;padding-top:1px}
.card-leg .lg-p del{color:var(--mute);font-weight:var(--w4);margin-right:5px}
.card--esg .card-leg .lg-t b,.card--esg .card-leg .lg-p{color:var(--mute);font-weight:var(--w5)}
/* hover: veu creme sobre a foto com a ficha curta e um unico botao no rodape */
.card-hover{position:absolute;inset:0;background:rgba(255,255,255,.84);
  -webkit-backdrop-filter:blur(10px) saturate(1.05);backdrop-filter:blur(10px) saturate(1.05);
  padding:40px 13px 12px;z-index:3;display:flex;flex-direction:column;
  overflow:hidden;opacity:0;transition:opacity .22s ease}
.card:hover .card-hover,.card:focus-within .card-hover{opacity:1}
.hv-fi{display:flex;flex-direction:column;gap:0}
.hv-fi div{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  padding:5px 0;border-bottom:1px solid rgba(26,24,19,.1)}
.hv-fi div:last-child{border-bottom:0}
.hv-fi dt{font-size:8.5px;font-weight:var(--w6);letter-spacing:.1em;text-transform:uppercase;
  color:rgba(26,24,19,.55);flex:none}
.hv-fi dd{font-size:var(--t1);font-weight:var(--w6);text-align:right;line-height:1.3}
.hv-fi dd.na{font-weight:var(--w4);color:var(--mute)}
.hv-foot{margin-top:auto;display:flex;align-items:stretch}
.card--janela .card-foto{border:2px solid var(--pto);outline:1px solid var(--pto);outline-offset:3px}
.card--esg .card-foto>img{opacity:.55;filter:grayscale(.65)}
.hv-bt{display:block;flex:1;text-align:center;background:transparent;color:var(--ink);border:1px solid var(--ink);font-size:9px;font-weight:var(--w7);letter-spacing:.16em;
  text-transform:uppercase;padding:11px 10px;transition:background .18s ease,color .18s ease}
.hv-bt:hover{background:var(--ink);color:var(--cream)}
.card--esg .hv-bt{border-color:rgba(26,24,19,.35);color:var(--mute)}
.card--esg .hv-bt:hover{background:transparent;color:var(--ink);border-color:var(--ink)}
a.card,a.dest,a.art{color:inherit}
a.card{display:block}

/* breeder em destaque */
.dest-br{background:var(--pto);color:var(--cream);overflow:hidden}
.db-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:stretch}
.db-foto{position:relative;min-height:clamp(420px,54vw,640px)}
.db-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.db-foto figcaption{position:absolute;left:0;bottom:0;background:rgba(10,9,8,.72);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#FFFFFF;
  font-size:var(--t1);font-weight:var(--w6);letter-spacing:.12em;text-transform:uppercase;padding:9px 14px}
.db-txt{padding:clamp(34px,4.5vw,64px) var(--gut) clamp(34px,4.5vw,64px) clamp(28px,4vw,56px);
  display:flex;flex-direction:column;justify-content:center;min-width:0}
.db-eye{display:block;font-size:var(--t2);font-weight:var(--w7);letter-spacing:.24em;
  text-transform:uppercase;color:var(--oliva);margin-bottom:22px}
/* a marca entra pelo logo, no tamanho de titulo; o nome fica so para leitor de tela */
.db-marca{display:block;margin-bottom:22px}
.db-marca img{height:clamp(48px,6vw,80px);width:auto;max-width:min(100%,380px);display:block}
.db-marca span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.db-p{font-size:var(--t4);color:rgba(255,255,255,.62);line-height:1.75;max-width:52ch}
.db-num{display:flex;gap:26px;flex-wrap:wrap;margin:24px 0 26px}
.db-num div b{display:block;font-size:var(--t6);font-weight:var(--w8);line-height:1;
  font-variant-numeric:tabular-nums;color:var(--cream)}
.db-num div em{display:block;font-style:normal;font-size:var(--t2);font-weight:var(--w5);
  color:rgba(255,255,255,.48);letter-spacing:.1em;text-transform:uppercase;margin-top:7px}
.db-carr{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;
  margin-right:calc(var(--gut) * -1);padding-right:var(--gut)}
.db-carr .card{flex:0 0 clamp(156px,17vw,188px);scroll-snap-align:start}
/* o card e claro: nao pode herdar o creme do bloco preto */
.dest-br .card,.dest-br .card *{color:var(--ink)}
/* no bloco escuro a legenda vira creme; a foto e o hover seguem iguais */
.dest-br .card-leg .lg-t b,.dest-br .card-leg .lg-p,.dest-br .card-leg .lg-p *{color:var(--cream)}
.dest-br .card-leg .lg-t small,.dest-br .card-leg .lg-p del{color:rgba(255,255,255,.55)}
.dest-br .card--esg .card-leg .lg-t b,.dest-br .card--esg .card-leg .lg-p{color:rgba(255,255,255,.55)}
.db-cta{margin-top:20px;display:inline-flex;align-items:center;gap:10px;align-self:flex-start;
  color:var(--cream);border-bottom:1.5px solid rgba(255,255,255,.5);padding-bottom:3px;
  font-size:var(--t2);font-weight:var(--w7);letter-spacing:.13em;text-transform:uppercase}
.db-cta:hover{border-bottom-color:var(--cream)}
.db-cta span{transition:transform .2s ease}
.db-cta:hover span{transform:translateX(4px)}
@media(max-width:900px){
  .db-grid{grid-template-columns:1fr}
  .db-foto{min-height:300px}
  .db-txt{padding-inline:var(--gut)}
}

/* jornada — paineis que abrem; o passo aberto ocupa metade da largura */
.jornada{background:var(--pto);color:var(--cream);padding-block:clamp(44px,5.2vw,74px)}
.jn-h{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:12px 48px;align-items:end;
  border-top:1px solid rgba(255,255,255,.18);padding-top:20px;margin-bottom:26px}
.jn-eye{font-size:var(--t2);font-weight:var(--w7);letter-spacing:.24em;text-transform:uppercase;
  color:var(--oliva);margin-bottom:9px}
.jn-sub{font-size:var(--t4);color:rgba(255,255,255,.55);line-height:1.7;max-width:42ch;justify-self:end}

.jn-p{display:flex;gap:6px;height:clamp(300px,31vw,392px)}
.jn-c{position:relative;flex:1 1 0;min-width:0;overflow:hidden;cursor:pointer;outline:none;
  background:#0f0e0c;transition:flex-grow .55s cubic-bezier(.4,0,.2,1)}
.jn-c::before{content:"";position:absolute;inset:0;background-image:var(--bg);
  background-size:cover;background-position:center;transform:scale(1.06);
  filter:brightness(.26) saturate(.45);transition:filter .55s ease,transform .7s ease}
.jn-c::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(10,9,8,.94) 0%,rgba(10,9,8,.62) 30%,rgba(10,9,8,.08) 72%)}
.jn-c.on{flex-grow:4}
.jn-c.on::before{filter:brightness(.56) saturate(.9);transform:scale(1)}
.jn-c:focus-visible{box-shadow:inset 0 0 0 2px var(--oliva)}

.jn-n{position:absolute;top:18px;left:20px;z-index:3;font-size:var(--t2);font-weight:var(--w7);
  letter-spacing:.16em;color:var(--oliva);font-variant-numeric:tabular-nums}
/* titulo na vertical enquanto o painel esta fechado */
.jn-tv{position:absolute;left:0;bottom:22px;z-index:3;padding-left:20px;
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-size:var(--t3);font-weight:var(--w7);letter-spacing:.13em;text-transform:uppercase;
  transition:opacity .26s ease}
.jn-c.on .jn-tv{opacity:0;pointer-events:none}
.jn-c.on .jn-n{color:var(--cream)}

.jn-bd{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:0 24px 24px;
  opacity:0;transform:translateY(12px);pointer-events:none;
  transition:opacity .42s ease .14s,transform .42s ease .14s}
.jn-c.on .jn-bd{opacity:1;transform:none;pointer-events:auto}
.jn-bd h3{font-size:var(--t6);font-weight:var(--w8);text-transform:uppercase;line-height:1.02;
  letter-spacing:.01em;margin-bottom:10px}
.jn-bd p{font-size:var(--t3);color:rgba(255,255,255,.76);line-height:1.62;max-width:36ch;margin-bottom:14px}
.jn-go{display:inline-flex;align-items:center;gap:9px;font-size:var(--t1);font-weight:var(--w7);
  letter-spacing:.14em;text-transform:uppercase;border-bottom:1.5px solid rgba(255,255,255,.55);
  padding-bottom:3px}
.jn-go em{font-style:normal;transition:transform .2s ease}
.jn-c:hover .jn-go em{transform:translateX(4px)}

@media(max-width:900px){
  .jn-h{grid-template-columns:1fr}
  .jn-sub{justify-self:start}
}
@media(max-width:760px){
  .jn-p{flex-direction:column;height:auto;gap:6px}
  .jn-c{flex:none;height:74px;transition:height .45s cubic-bezier(.4,0,.2,1)}
  .jn-c.on{height:212px}
  .jn-tv{display:none}
  .jn-n{left:auto;right:20px}
  .jn-bd{top:0;bottom:auto;padding:20px 24px 0;opacity:1;transform:none;pointer-events:auto}
  .jn-bd h3{font-size:var(--t5);padding-right:46px}
  .jn-bd p,.jn-go{opacity:0;transition:opacity .3s ease}
  .jn-c.on .jn-bd p,.jn-c.on .jn-go{opacity:1}
}
@media(prefers-reduced-motion:reduce){
  .jn-c,.jn-c::before,.jn-bd{transition-duration:.01ms}
}

/* marcas */
.marcas{display:grid;grid-template-columns:repeat(10,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.marcas a{background:var(--br);aspect-ratio:1;display:grid;place-items:center;padding:14px}
.marcas img{max-height:100%;width:auto;object-fit:contain;filter:grayscale(1);opacity:.62}
.marcas a:hover img{filter:none;opacity:1}

/* blog */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.post{border:1px solid var(--line);display:flex;flex-direction:column}
.post .cap{aspect-ratio:16/9;background:var(--wash);position:relative}
.post .bd{padding:16px;display:flex;flex-direction:column;gap:9px;flex:1}
.kk{display:flex;gap:6px;flex-wrap:wrap}
.kk span{font-size:8.5px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;
  border:1px solid var(--line);padding:3px 6px;color:var(--mute)}
.post h3{font-size:13.5px;font-weight:900;line-height:1.35;text-transform:uppercase}
.by{margin-top:auto;font-size:9.5px;color:var(--mute);letter-spacing:.06em;text-transform:uppercase}
.post--club{background:var(--pto);border-color:var(--pto)}
.post--club .cap{background:rgba(255,255,255,.05)}
.post--club h3{color:#fff}
.post--club .by{color:rgba(255,255,255,.52)}
.post--club .kk span{color:rgba(255,255,255,.52);border-color:rgba(255,255,255,.16)}

/* educacao: imagem tematica de fundo, texto no pe */
.edu{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.edu-a{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/5;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:15px 15px 13px;color:var(--cream);isolation:isolate;background:var(--pto)}
.edu-a::before{content:"";position:absolute;inset:0;z-index:0;background-image:var(--img);
  background-size:cover;background-position:center;
  filter:brightness(.66) contrast(1.02);transform:scale(1.02);
  transition:filter .4s ease,transform .6s cubic-bezier(.4,0,.2,1)}
.edu-a:hover::before{filter:brightness(.8) contrast(1.02);transform:scale(1.06)}
.edu-a::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top,rgba(10,9,8,.9) 2%,rgba(10,9,8,.45) 42%,rgba(10,9,8,.12) 78%)}
.edu-a>*{position:relative;z-index:2}
.edu-a .ic{position:absolute;top:15px;left:15px;color:var(--cream);display:block;
  opacity:.9;filter:drop-shadow(0 1px 4px rgba(10,9,8,.6))}
.edu-a .ic svg{width:26px;height:26px}
.edu-a h3{font-size:var(--t3);font-weight:var(--w8);text-transform:uppercase;letter-spacing:.05em;
  line-height:1.16;margin-bottom:7px}
.edu-a p{font-size:var(--t2);color:rgba(255,255,255,.78);line-height:1.6;margin:0}
@media(max-width:1060px){.edu{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.edu{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.edu{grid-template-columns:1fr}.edu-a{aspect-ratio:16/10}}

/* artigos */
.verall{font-size:var(--t2);font-weight:var(--w7);letter-spacing:.09em;text-transform:uppercase;border-bottom:1.5px solid var(--ink);padding-bottom:2px}
.chip{font-size:var(--t1);font-weight:var(--w6);letter-spacing:.08em;padding:4px 8px;display:inline-block;line-height:1.3}
.chip--cat{background:var(--wash);color:var(--marrom)}
.chip--n1{background:var(--oliva);color:#fff}
.chip--n2{background:var(--marrom);color:#fff}
.chip--n3{background:var(--pto);color:#fff}
.meta{font-size:var(--t2);font-weight:var(--w5);color:var(--mute);font-variant-numeric:tabular-nums}
/* capa do artigo: foto real, mesmo tratamento dos cards de educacao */
.art-cap{background:var(--pto);position:relative;overflow:hidden}
.art-cap.sem-img{background:var(--box)}
.art-cap.sem-img::before{background-image:none}
.art-cap::before{content:"";position:absolute;inset:0;background-image:var(--img);
  background-size:cover;background-position:center;
  filter:brightness(.92) contrast(1.02);transition:transform .6s cubic-bezier(.4,0,.2,1),filter .4s ease}
.dest:hover .art-cap::before,.art:hover .art-cap::before{transform:scale(1.05);filter:brightness(1) contrast(1.02)}
.av{width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;
  font-size:11px;font-weight:900;flex:none}

.dest{display:grid;grid-template-columns:320px 1fr;border:1px solid var(--line);margin-bottom:14px}
.dest .art-cap{aspect-ratio:1}
.dest .bd{padding:clamp(20px,3vw,34px);display:flex;flex-direction:column;gap:14px;justify-content:center}
.dest .hd-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.dest h3{font-size:var(--t6);font-weight:var(--w7);line-height:1.22;text-wrap:balance}
.dest p{font-size:14px;color:var(--mute);line-height:1.7;max-width:62ch}
.dest .by-row{display:flex;align-items:center;gap:11px;font-size:12.5px}

.art3{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.art{border:1px solid var(--line);display:flex;flex-direction:column}
.art .art-cap{aspect-ratio:16/10}
.art .bd{padding:14px;display:flex;flex-direction:column;gap:11px;flex:1}
.art h3{font-size:var(--t3);font-weight:var(--w7);line-height:1.35}
.art .ft{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;
  border-top:1px solid var(--line);padding-top:12px}
.art--club{background:var(--pto);border-color:var(--pto)}
.art--club .art-cap{border-bottom:1px solid rgba(255,255,255,.16)}
.art--club .art-cap::before{filter:brightness(.5) contrast(1.05)}
.art--club .art-cap::after{content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(10,9,8,.86) 6%,rgba(10,9,8,0) 58%)}

.art--club .art-cap b{position:absolute;bottom:12px;left:0;right:0;z-index:2;text-align:center;color:var(--oliva);
  font-size:9.5px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.art--club h3{color:#fff}
.art--club .ft{border-color:rgba(255,255,255,.16);color:rgba(255,255,255,.52)}
.art--club .meta{color:rgba(255,255,255,.52)}
.art--club .av{background:var(--marrom)}

/* parceiros */
.pc-top{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px 24px;
  border-top:1px solid var(--line);padding-top:20px;margin-bottom:28px}
.pc-top>h2{grid-column:1;grid-row:1;align-self:center}
.pc-fil{grid-column:2;grid-row:1;align-self:center}
.pc-todos{grid-column:2;grid-row:2;justify-self:end}
.pc-fil{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.pc-fil button{border:1px solid var(--line);border-radius:8px;padding:9px 16px;font-size:var(--t3);
  font-weight:var(--w6);letter-spacing:.04em;color:var(--mute)}
.pc-fil button:hover{border-color:var(--ink);color:var(--ink)}
.pc-fil button[aria-pressed="true"]{background:var(--pto);border-color:var(--pto);color:#fff}
.pc-todos{font-size:var(--t2);font-weight:var(--w7);letter-spacing:.13em;text-transform:uppercase;
  border-bottom:1.5px solid var(--ink);padding-bottom:2px;justify-self:end}
.pc-todos:hover{color:var(--marrom);border-color:var(--marrom)}

/* card do parceiro: 5 por linha; em repouso so o essencial, no hover a ficha cresce por cima da grade */
.pcs{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.pc{position:relative;display:block;border-radius:13px;background:var(--box);
  aspect-ratio:1/1.28;isolation:isolate;
  transition:transform .28s cubic-bezier(.4,0,.2,1),z-index 0s .28s}
.pc:hover,.pc:focus-within{z-index:20;transition:transform .28s cubic-bezier(.4,0,.2,1),z-index 0s}
.pc:hover{transform:translateY(-2px)}
.pc[hidden]{display:none}
.pc::after{content:"";position:absolute;inset:0;border-radius:13px;pointer-events:none;
  box-shadow:inset 0 0 0 1px var(--line)}
.pc.club::after{box-shadow:inset 0 0 0 1.5px var(--pto)}
.pc:focus-visible{outline:2px solid var(--oliva);outline-offset:2px}

/* o logo original da marca, com o fundo do arquivo recortado */
/* caixa do logo e sempre um quadrado de 70% da largura do card: a arte padrao e 1000 x 1000 px,
   fundo transparente, e entra inteira, sem corte e sem sobra */
.pc-mk{position:absolute;top:7%;left:15%;width:70%;aspect-ratio:1/1;z-index:0;border-radius:12px;
  background-image:var(--mk);background-repeat:no-repeat;background-position:50% 50%;
  background-size:contain;transition:transform .4s cubic-bezier(.4,0,.2,1)}
.pc:hover .pc-mk{transform:scale(1.04)}
.pc.sem-logo .pc-mk{display:grid;place-items:center;text-align:center;padding:10%}
.pc.sem-logo .pc-mk i{font-style:normal;font-size:var(--t5);font-weight:var(--w8);letter-spacing:.02em;line-height:1.1;text-transform:uppercase}
.pc .loc em.na{font-style:normal;color:rgba(255,255,255,.42)}
/* marca de arte clara nao apareceria no creme: ganha uma placa escura */
/* logo vindo do cadastro: fundo branco do arquivo some sobre o creme */
.pc:not(.mk-claro) .pc-mk{mix-blend-mode:multiply}
.pc.mk-claro .pc-mk{background-color:var(--pto);border-radius:10px;
  background-size:76% auto;background-origin:content-box;padding:10px}

/* o painel cresce para baixo, passando do card, e ganha sombra para descolar da grade */
.pc-pn{position:absolute;left:0;right:0;top:66%;height:34%;z-index:2;
  border-radius:0 0 13px 13px;overflow:hidden;
  background:rgba(10,9,8,.86);-webkit-backdrop-filter:blur(10px) saturate(1.05);
  backdrop-filter:blur(10px) saturate(1.05);color:var(--cream);
  padding:10px 12px 9px;display:flex;flex-direction:column;
  transition:top .34s cubic-bezier(.4,0,.2,1),height .34s cubic-bezier(.4,0,.2,1),
             border-radius .34s ease,box-shadow .34s ease,background .3s ease}
.pc:hover .pc-pn,.pc:focus-within .pc-pn{top:0;height:300px;border-radius:13px;
  background:rgba(10,9,8,.95);box-shadow:0 18px 44px rgba(10,9,8,.34)}

.pc-hd{min-width:0;flex:none;order:1}
.pc-hd h3{font-size:var(--t3);font-weight:var(--w7);line-height:1.2;
  display:flex;align-items:center;flex-wrap:wrap;gap:5px}
.pc-d{text-decoration:none;background:var(--oliva);color:var(--pto);font-size:8.5px;
  padding:2px 5px;border-radius:4px;flex:none;line-height:1.2}
.pc .loc{display:flex;align-items:center;gap:5px;font-size:var(--t1);
  color:rgba(255,255,255,.62);margin-top:3px}
.pc .fl{text-decoration:none;font-size:12px;line-height:1;flex:none}
.pc .fl.sem{font-size:8.5px;letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.24);border-radius:4px;padding:1px 4px}

.pc-mini{order:2;margin-top:auto;border-top:1px solid rgba(255,255,255,.2);padding-top:6px;
  display:grid;grid-template-columns:repeat(3,1fr);text-align:center;flex:none;
  transition:opacity .2s ease,max-height .34s cubic-bezier(.4,0,.2,1);overflow:hidden;max-height:64px}
.pc-mini>span{display:block;border-left:1px solid rgba(255,255,255,.2);padding:0 2px}
.pc-mini>span:first-child{border-left:none}
.pc-mini b{display:block;font-size:var(--t3);font-weight:var(--w8);line-height:1;
  font-variant-numeric:tabular-nums;color:var(--cream)}
.pc-mini b.na{color:rgba(255,255,255,.42);font-weight:var(--w4)}
.pc-mini em{display:block;font-style:normal;font-size:8px;font-weight:var(--w5);
  letter-spacing:.02em;color:rgba(255,255,255,.55);margin-top:3px}
.pc:hover .pc-mini,.pc:focus-within .pc-mini{opacity:0;max-height:0;padding-top:0;
  border-top-width:0;margin-top:0}

.pc-det{order:3;overflow:hidden;max-height:0;opacity:0;display:flex;flex-direction:column;gap:7px;
  transition:max-height .34s cubic-bezier(.4,0,.2,1),opacity .2s ease}
.pc:hover .pc-det,.pc:focus-within .pc-det{max-height:none;flex:1;opacity:1;
  transition-delay:0s,.12s;margin-top:9px}
.pc-det dl{margin:0}
.pc-det dl>div{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  padding:1.5px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.pc-det dt{font-size:8px;font-weight:var(--w6);letter-spacing:.07em;text-transform:uppercase;
  color:rgba(255,255,255,.5);flex:none}
.pc-det dd{margin:0;font-size:9.5px;font-weight:var(--w6);text-align:right;line-height:1.28;
  color:var(--cream);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pc-det dd.na{color:rgba(255,255,255,.38);font-weight:var(--w4)}
.pc-go{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:7px;
  font-size:9px;font-weight:var(--w7);letter-spacing:.13em;text-transform:uppercase;
  border-bottom:1.5px solid rgba(255,255,255,.5);padding-bottom:2px}
.pc-go em{font-style:normal;transition:transform .2s ease}
.pc:hover .pc-go em{transform:translateX(4px)}

.pc-vazio{grid-column:1/-1;border:1px dashed var(--line);border-radius:12px;padding:22px;
  font-size:var(--t3);color:var(--mute);line-height:1.6}

@media(max-width:1180px){.pcs{grid-template-columns:repeat(4,1fr)}}
@media(max-width:980px){.pcs{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.pcs{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.pcs{grid-template-columns:1fr}}
@media(hover:none){
  /* sem cursor nao ha hover: o card cresce e mostra tudo */
  .pc{aspect-ratio:auto}
  .pc-mk{position:relative;display:block;top:auto;left:auto;width:70%;aspect-ratio:1/1;
    max-width:150px;margin:16px auto 4px}
  .pc-pn{position:relative;top:auto;height:auto;border-radius:0 0 13px 13px;
    background:rgba(10,9,8,.94);box-shadow:none}
  .pc-mini{display:none}
  .pc-det{max-height:none;opacity:1;margin-top:10px}
}

/* o circulo */
.clube{background:var(--pto);color:var(--cream);position:relative;overflow:hidden;isolation:isolate}
.clube .in{position:relative;z-index:1;padding-block:clamp(48px,5.4vw,82px);
  display:flex;flex-direction:column;align-items:center;text-align:center}
/* os dois blocos pretos ficam vizinhos: costura visivel entre eles */
.dest-br + .clube .in{border-top:1px solid rgba(255,255,255,.16)}

/* o eclipse. o aro ocupa 55% do arquivo e o miolo preto 52%, entao a imagem
   entra bem maior que o aro que se ve. mix-blend-mode:screen apaga o preto do
   arquivo: nao existe borda de imagem, em fundo nenhum */
.cl-anel{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:0;pointer-events:none;
  width:clamp(420px,60vw,850px);aspect-ratio:1;
  background:var(--ecl) center/contain no-repeat;
  mix-blend-mode:screen}

.cl-eye{font-size:var(--t2);font-weight:var(--w6);letter-spacing:.32em;text-transform:uppercase;
  color:rgba(255,255,255,.42);margin:0}
.clube .cl-h{font-weight:var(--w8);font-size:clamp(30px,4.6vw,62px);text-transform:uppercase;
  line-height:.92;letter-spacing:.005em;margin:14px 0 0}
.cl-logo{height:26px;width:auto;margin:20px 0 0;filter:brightness(0) invert(1)}
.cl-acoes{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:14px 26px;margin-top:clamp(22px,2.4vw,30px)}
.cl-b1{background:var(--cream);color:var(--pto);padding:14px 32px;
  font-size:var(--t2);font-weight:var(--w7);letter-spacing:.16em;text-transform:uppercase;
  transition:background .2s ease,color .2s ease}
.cl-b1:hover{background:var(--oliva);color:var(--cream)}
.cl-b2{color:rgba(255,255,255,.78);padding-bottom:3px;
  border-bottom:1.5px solid rgba(255,255,255,.38);
  font-size:var(--t2);font-weight:var(--w7);letter-spacing:.16em;text-transform:uppercase;
  transition:color .2s ease,border-color .2s ease}
.cl-b2:hover{color:var(--cream);border-bottom-color:var(--cream)}
/* versao enorme: so na pagina do Circulo. mesma estrutura, escala maior */
.clube--xl .in{min-height:calc(100svh - var(--hdr,72px));justify-content:center;padding-block:clamp(72px,9vw,140px)}
.clube--xl .cl-anel{width:clamp(520px,92vw,1280px)}
.clube--xl .cl-h{font-size:clamp(44px,9vw,132px);margin-top:18px}
.clube--xl .cl-logo{height:38px;margin-top:26px}
.clube--xl .cl-b1{padding:18px 44px}
@media(max-width:560px){
  .clube--xl .cl-anel{width:min(170vw,760px)}
  .cl-anel{width:min(132vw,560px)}
  .cl-acoes{flex-direction:column;align-items:stretch;gap:14px}
  .cl-b1{text-align:center}
}

/* instagram */
.ig{border-top:1px solid var(--line)}
.ig .in{padding-block:clamp(28px,3.1vw,44px)}
.ig-top{display:flex;align-items:center;justify-content:space-between;gap:10px 24px;
  flex-wrap:wrap;margin-bottom:clamp(12px,1.5vw,17px)}
.ig-top h2{font-weight:var(--w8);font-size:var(--t6);text-transform:uppercase;
  letter-spacing:.015em;line-height:1;margin:0}
.ig-top a{color:var(--marrom);border-bottom:1.5px solid var(--line)}
.ig-top a:hover{border-color:var(--ink)}
.ig-wrap{position:relative}
.ig-carr{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding-bottom:4px;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut)}
.ig-carr::-webkit-scrollbar{height:0}
.ig-post{position:relative;flex:0 0 clamp(120px,12.4vw,152px);aspect-ratio:4/5;scroll-snap-align:start;
  border-radius:12px;overflow:hidden;background:var(--wash);display:block}
.ig-post img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease,filter .35s ease}
.ig-post::after{content:"";position:absolute;inset:0;background:rgba(10,9,8,.42);
  opacity:0;transition:opacity .3s ease}
.ig-post:hover img{transform:scale(1.06)}
.ig-post:hover::after{opacity:1}
.ig-post i{position:absolute;inset:0;z-index:2;display:grid;place-items:center;
  opacity:0;transform:scale(.88);transition:.3s ease;color:#fff}
.ig-post:hover i{opacity:1;transform:none}
.ig-post i svg{width:30px;height:30px}
.ig-setas{display:flex;gap:8px;flex:none}
.ig-nav{width:32px;height:32px;border-radius:50%;background:var(--br);border:1px solid var(--line);
  display:grid;place-items:center;font-size:16px;font-weight:var(--w7);color:var(--ink);transition:.2s ease}
.ig-nav:hover{border-color:var(--ink);background:var(--wash)}
@media(max-width:620px){.ig-setas{display:none}}

/* rodape preto: newsletter e rodape viram um bloco so */
.pe-wrap{background:var(--pto);color:#FFFFFF}
.news{border-bottom:1px solid rgba(255,255,255,.12)}
.news .in{padding-block:clamp(34px,4vw,54px);display:flex;align-items:flex-end;
  justify-content:space-between;gap:30px;flex-wrap:wrap}
.news h2{font-weight:var(--w8);font-size:clamp(24px,2.9vw,38px);text-transform:uppercase;
  letter-spacing:.015em;line-height:1;color:#fff}
.news .sub{display:block;font-size:var(--t4);font-weight:var(--w4);color:rgba(255,255,255,.55);
  letter-spacing:0;text-transform:none;margin-top:14px;line-height:1.7;max-width:46ch}
.news form{display:flex;min-width:min(100%,400px);flex:1;max-width:520px;
  border:1px solid rgba(255,255,255,.34)}
.news input{flex:1;min-width:0;border:none;padding:15px 16px;font:inherit;font-size:var(--t4);
  outline:none;background:transparent;color:#FFFFFF}
.news input::placeholder{color:rgba(255,255,255,.42)}
.news form:focus-within{border-color:#FFFFFF}
.news button{background:#FFFFFF;color:var(--pto);padding:0 24px;font-size:var(--t2);
  font-weight:var(--w7);letter-spacing:.13em;text-transform:uppercase;flex:none}
.news button:hover{background:#fff}

.pe{padding-block:clamp(40px,5vw,62px) 30px;display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:30px}
.pe img.lg{height:30px;width:auto;margin-bottom:16px;filter:brightness(0) invert(1)}
.pe p{font-size:var(--t3);color:rgba(255,255,255,.55);line-height:1.85;max-width:38ch}
.pe h4{font-size:var(--t2);font-weight:var(--w7);letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.42);margin-bottom:14px}
.pe ul{list-style:none;display:flex;flex-direction:column;gap:10px;font-size:var(--t3)}
.pe ul a{color:rgba(255,255,255,.80)}
.pe ul a:hover{color:#fff}
.pe-bot{border-top:1px solid rgba(255,255,255,.12);padding-block:20px;display:flex;justify-content:flex-end;
  gap:16px;flex-wrap:wrap;font-size:var(--t2);color:rgba(255,255,255,.42)}
.pe-bot .soc{display:flex;gap:18px;font-weight:var(--w7);letter-spacing:.06em}
.pe-bot .soc a{color:#FFFFFF}
.pe-bot .soc a:hover{color:var(--oliva)}

/* etiqueta de leitura do modelo */
.tag18{position:fixed;right:12px;bottom:12px;z-index:60;background:var(--pto);color:#fff;
  font-size:9.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;padding:8px 12px;
  max-width:min(92vw,330px);line-height:1.6}
.tag18 b{color:var(--oliva)}

@media(max-width:1060px){
  .marcas{grid-template-columns:repeat(5,1fr)}
  .edu,.art3{grid-template-columns:repeat(3,1fr)}
  .mega-in{grid-template-columns:repeat(2,1fr)}
  .mega .blk{margin:0;padding:22px}
}
@media(max-width:820px){
  .hd-in{grid-template-columns:auto auto auto}
  .hd nav{gap:15px;font-size:10.5px}
  .hd .tools{gap:12px;font-size:10px}
  .pc-top{grid-template-columns:1fr}
  .pc-top>h2,.pc-fil,.pc-todos{grid-column:1}
  .pc-fil{grid-row:2;justify-content:flex-start}
  .pc-todos{grid-row:3;justify-self:start}
  .selos-in{grid-template-columns:repeat(2,1fr)}
  .selo{padding:22px 18px}
  .selo:nth-child(3){border-left:none;padding-left:0}
  .selo:nth-child(n+3){border-top:1px solid var(--line)}
  .posts,.art3,.edu{grid-template-columns:repeat(2,1fr)}
  .edu{grid-template-columns:repeat(2,1fr)}
  .dest{grid-template-columns:1fr}
  .dest .art-cap{aspect-ratio:16/7}
  .arv{grid-template-columns:1fr}
  .op{justify-items:start;justify-content:start}
  .pe{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .posts,.art3,.edu{grid-template-columns:1fr}
  .marcas{grid-template-columns:repeat(4,1fr)}
  .hd .hd-in nav a:nth-child(n+3){display:none}
  .pe{grid-template-columns:1fr}
  .tag18{display:none}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* menu do celular: botao so aparece em tela estreita; a gaveta lista os links e o mega menu inteiro */
.hb{display:none}
.gav{display:none;position:fixed;inset:var(--hdr,67px) 0 0 0;z-index:49;background:var(--br);overflow:auto;
  padding:18px var(--gut) 40px;border-top:1px solid var(--line)}
.gav.open{display:block}
.gav-nav{display:flex;flex-direction:column;margin-bottom:22px}
.gav-nav a{padding:14px 0;border-bottom:1px solid var(--line);font-size:var(--t5);font-weight:var(--w7);letter-spacing:.06em;text-transform:uppercase;
  display:flex;justify-content:space-between;align-items:center}
.gav-nav a em{font-style:normal;color:var(--mute)}
.gav h4{font-size:9px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin:18px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.gav ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px}
.gav li a{display:flex;justify-content:space-between;font-size:13.5px;padding:6px 0}
.gav li em{font-style:normal;color:var(--mute);font-size:11px;font-variant-numeric:tabular-nums}
.gav-conta{margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gav-conta a{border:1px solid var(--ink);padding:13px;text-align:center;font-size:var(--t2);font-weight:var(--w7);letter-spacing:.1em;text-transform:uppercase}
.gav-conta a.b1{background:var(--pto);color:#fff;border-color:var(--pto)}
body.sc-gav-on{overflow:hidden}
@media(max-width:820px){
  .hb{display:grid}
  .hb .x{display:none}
  .hb[aria-expanded="true"] .x{display:block}
  .hb[aria-expanded="true"] .l{display:none}
  .hd .hd-in nav{display:none}
  .hd-in{grid-template-columns:auto 1fr auto}
  .hd .brand{justify-self:center}
  .mega{display:none!important}
}

/* busca no header (compartilhada por todas as paginas) */
.sc-busca{display:none;border-top:1px solid var(--line);background:var(--br)}
.sc-busca.open{display:block}
.sc-busca .in{display:flex;padding-block:12px}
.sc-busca input{flex:1;min-width:0;border:1px solid var(--line);border-right:0;padding:12px 14px;font:inherit;font-size:var(--t4);
  outline:none;background:transparent;color:var(--ink)}
.sc-busca input:focus{border-color:var(--ink)}
.sc-busca button{background:var(--pto);color:#fff;padding:0 20px;font-size:var(--t2);font-weight:var(--w7);
  letter-spacing:.12em;text-transform:uppercase}
a.ti{display:grid}


/* Pular para o conteudo: invisivel ate receber foco pelo teclado */
.sc-skip {
  position: absolute;
  left: 12px;
  top: -60px;
  z-index: 100000;
  padding: 12px 18px;
  background: var(--pto);
  color: var(--cream);
  font-family: var(--sans);
  font-size: var(--t2);
  font-weight: var(--w7);
  letter-spacing: 1.2px;
  text-transform: uppercase;
  text-decoration: none;
  transition: top .15s ease;
}
.sc-skip:focus { top: 12px; outline: 2px solid var(--oliva); outline-offset: 2px; }
main#conteudo { display: block; }
main#conteudo:focus { outline: none; }


/* Newsletter ligada ao Seed Club — Mail: o form agora vem dentro de .news-form */
.news .news-form { flex: 1; min-width: min(100%, 400px); max-width: 520px; }
.news .news-form form { width: 100%; min-width: 0; max-width: none; }
.news .news-msg { margin: 12px 0 0; font-size: var(--t4); line-height: 1.5; color: #FFFFFF; }
.news .news-lgpd { margin: 10px 0 0; font-size: var(--t2); line-height: 1.5; color: rgba(255,255,255,.55); }

/* REGRA 21/09/2026 (Artur): sem eyebrow (sobretitulo) em nenhuma pagina do site.
   Fica no home.css porque e o unico CSS que carrega em todas as paginas do site novo.
   Onde o eyebrow era o proprio H1 (blog, marca, Sobre nos), o H1 continua no HTML
   para o Google e para leitor de tela, apenas invisivel na tela. */
.pg-eye, .db-eye, .jn-eye, .mk-eye, .bg-eye, .bh-eye, .po-eye { display: none !important; }

h1.pg-eye, h1.bh-h1s, h1.mk-h1s {
  display: block !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* PADRAO DE BANNER (21/09/2026, Artur): todo topo de pagina interna com a mesma
   altura e o mesmo tamanho de titulo, titulo sempre embaixo. Fica no home.css porque
   e o unico CSS que carrega em todas as paginas. Fora do padrao, de proposito:
   a home (carrossel), o blog (topo e a materia em destaque, nao um banner)
   e O Circulo (banner grande original, decisao do Artur em 21/09/2026). */
:root {
  /* 23/09/2026 (Artur): topo mais baixo, para o primeiro produto subir na tela */
  --sc-topo-h: clamp(190px, 17vw, 260px);
  --sc-topo-t: clamp(34px, 5.6vw, 76px);
}

/* faixa padrao: loja, busca, categorias, marcas, sacola, checkout, conta, institucionais */
section.pg-topo {
  min-height: var(--sc-topo-h);
  display: flex;
  align-items: flex-end;
  box-sizing: border-box;
}
section.pg-topo > .in { width: 100%; padding-block: clamp(22px, 2.8vw, 40px); }
section.pg-topo .pg-h1 { font-size: var(--sc-topo-t); margin-top: 8px; }
section.pg-topo .sb-manch { font-size: var(--sc-topo-t); }

/* hero da marca (colagem) */
section.mk:not(.mk--arte) { height: var(--sc-topo-h); }
section.mk .mk-h1 { font-size: var(--sc-topo-t); }


/* banner de fotos em toda faixa de topo (21/09/2026): as seis fotos curadas das
   categorias da home, lado a lado, com a mesma sombra do banner da loja. So CSS,
   vale para todos os templates. A loja e a busca ja montam o banner no HTML
   (.pg-topo--banner) e ficam de fora. Cada foto ocupa 1/6 da largura, sem distorcer. */
section.pg-topo:not(.pg-topo--banner) {
  background-color: var(--pto);
  background-image: linear-gradient(to top, rgba(10,9,8,.9) 0%, rgba(10,9,8,.55) 50%, rgba(10,9,8,.3) 100%), url(../img/cat_categoria-hibridas.jpg), url(../img/cat_categoria-feminizadas.jpg), url(../img/cat_categoria-indica-v3.jpg), url(../img/cat_categoria-alto-rendimento.jpg), url(../img/cat_categoria-regulares.jpg), url(../img/cat_categoria-sativa-v2.jpg);
  background-repeat: no-repeat;
  background-size: 100% 100%, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%;
  background-position: 0 0, calc(0 * 100vw / 6) 0, calc(1 * 100vw / 6) 0, calc(2 * 100vw / 6) 0, calc(3 * 100vw / 6) 0, calc(4 * 100vw / 6) 0, calc(5 * 100vw / 6) 0;
}
@media (max-width: 700px) {
  section.pg-topo:not(.pg-topo--banner) {
    background-image: linear-gradient(to top, rgba(10,9,8,.9) 0%, rgba(10,9,8,.55) 50%, rgba(10,9,8,.3) 100%), url(../img/cat_categoria-feminizadas.jpg), url(../img/cat_categoria-indica-v3.jpg), url(../img/cat_categoria-sativa-v2.jpg);
    background-size: 100% 100%, auto 100%, auto 100%, auto 100%;
    background-position: 0 0, calc(0 * 100vw / 3) 0, calc(1 * 100vw / 3) 0, calc(2 * 100vw / 3) 0;
  }
}

/* O Circulo: pagina so com o banner grande; sem o bloco de corpo vazio embaixo */
body.sc-circulo main.pg > .pg-corpo:has(.pg-txt:empty) { display: none; }

/* AVISOS E RESUMO DO WOOCOMMERCE (21/09/2026): sem caixa creme (regra de 20/09),
   fundo branco, linha fina, texto na cor da tinta e link legivel.
   Vale para checkout, sacola e conta. */
.woocommerce-info,
.woocommerce-message,
.woocommerce-error {
  background: #fff !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-left: 3px solid var(--ink) !important;
  box-shadow: none !important;
}
.woocommerce-error { border-left-color: var(--marrom) !important; }
.woocommerce-info strong, .woocommerce-info b,
.woocommerce-message strong, .woocommerce-message b { color: var(--ink) !important; }
.woocommerce-info a, .woocommerce-message a, .woocommerce-info .showcoupon {
  color: var(--ink) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* resumo do pedido no checkout */
.woocommerce-checkout-review-order-table,
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  background: #fff !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
.woocommerce-checkout-review-order-table thead th {
  font-size: var(--t1);
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--mute) !important;
}
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
  font-weight: var(--w8);
  font-size: var(--t5);
  border-top: 2px solid var(--ink) !important;
}

/* CHECKOUT NO PADRAO DO SITE (22/09/2026, Artur): tudo alinhado a esquerda na mesma
   margem, sem bloco centralizado, sem verde e sem passos numerados do Pix, tabela com
   linhas alinhadas nas duas colunas, Complemento com rotulo como os outros campos,
   seta do Estado desenhada, botao no tamanho dos CTAs do site. */

/* Complemento: o WooCommerce esconde esse rotulo; aqui ele aparece igual aos outros */
.woocommerce-checkout #billing_address_2_field label.screen-reader-text,
.woocommerce-checkout #shipping_address_2_field label.screen-reader-text {
  position: static !important;
  clip: auto !important;
  clip-path: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  white-space: normal !important;
}

/* seta do Estado (select2): o icone original nao carrega e vira um quadrado */
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow b { display: none !important; }
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__arrow {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231A1813' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat center;
  width: 40px;
  height: 100%;
  top: 0;
  right: 0;
}

/* resumo do pedido: uma linha por item, bordas batendo nas duas colunas, valor a direita */
.woocommerce-checkout-review-order-table { border: 0 !important; border-collapse: collapse !important; width: 100%; }
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  padding: 14px 0 !important;
  vertical-align: top;
  text-align: left;
}
.woocommerce-checkout-review-order-table tr > :last-child { text-align: right; }
.woocommerce-checkout-review-order-table thead th { border-bottom: 1px solid var(--ink) !important; }
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td { border-top: 2px solid var(--ink) !important; border-bottom: 0 !important; }
.woocommerce-checkout-review-order-table ul#shipping_method { margin: 0; padding: 0; list-style: none; }

/* pagamento: mesma margem da tabela, sem caixa cinza, sem ilustracao e sem passos numerados */
.woocommerce-checkout #payment,
.woocommerce-checkout #payment ul.payment_methods { background: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; }
.woocommerce-checkout #payment ul.payment_methods li { padding: 18px 0 0 !important; margin: 0 !important; list-style: none; }
.woocommerce-checkout #payment .wc_payment_method > label { padding: 0 !important; margin: 0 !important; font-weight: var(--w7); }
.woocommerce-checkout #payment .wc_payment_method > label img { display: none !important; }
.woocommerce-checkout #payment div.payment_box { background: none !important; padding: 8px 0 0 !important; margin: 0 !important; text-align: left !important; }
.woocommerce-checkout #payment div.payment_box::before { display: none !important; }
.payment_method_wc_piggly_pix_gateway .pix-por-piggly--img,
.payment_method_wc_piggly_pix_gateway .pix-por-piggly--wrapper { display: none !important; }
.payment_method_wc_piggly_pix_gateway .pix-por-piggly--description {
  font-style: normal !important;
  text-align: left !important;
  margin: 0 !important;
  color: var(--mute) !important;
  font-size: var(--t3);
}
.woocommerce-checkout #payment .place-order { padding: 24px 0 0 !important; margin: 0 !important; }

/* botao: o mesmo desenho dos CTAs do site, na largura da coluna */
.woocommerce-checkout #place_order {
  width: 100%;
  padding: 18px 44px !important;
  font-size: var(--t2) !important;
  font-weight: var(--w7) !important;
  letter-spacing: 1.92px !important;
  text-transform: uppercase;
  background: var(--pto) !important;
  color: var(--cream) !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* ajuste fino do checkout (22/09/2026): especificidade maior que as regras do tema
   para a tabela ter a mesma linha nas duas colunas; sem o icone quebrado do Estado;
   descricao do Pix sem recuo */
body .woo table.woocommerce-checkout-review-order-table th,
body .woo table.woocommerce-checkout-review-order-table td,
body table.woocommerce-checkout-review-order-table th,
body table.woocommerce-checkout-review-order-table td {
  padding: 14px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
body .woo table.woocommerce-checkout-review-order-table thead th,
body table.woocommerce-checkout-review-order-table thead th { border-bottom: 1px solid var(--ink) !important; }
body .woo table.woocommerce-checkout-review-order-table .order-total th,
body .woo table.woocommerce-checkout-review-order-table .order-total td,
body table.woocommerce-checkout-review-order-table .order-total th,
body table.woocommerce-checkout-review-order-table .order-total td {
  border-top: 2px solid var(--ink) !important;
  border-bottom: 0 !important;
}
.woocommerce-checkout .select2-container .select2-selection__arrow::after,
.woocommerce-checkout .select2-container .select2-selection__arrow::before { content: none !important; display: none !important; }
.woocommerce-checkout #payment div.payment_box > div { margin-left: 0 !important; padding-left: 0 !important; }
body .woo table.woocommerce-checkout-review-order-table,
body table.woocommerce-checkout-review-order-table { border: 0 !important; }
body .woo table.woocommerce-checkout-review-order-table th,
body .woo table.woocommerce-checkout-review-order-table td { border-left: 0 !important; border-right: 0 !important; }
body table.woocommerce-checkout-review-order-table thead,
body table.woocommerce-checkout-review-order-table tbody,
body table.woocommerce-checkout-review-order-table tfoot,
body table.woocommerce-checkout-review-order-table tr { border-left: 0 !important; border-right: 0 !important; }

/* CHECKOUT COMPACTO (22/09/2026, Artur: "extremamente espacado"). Grade de 6 colunas,
   na ordem brasileira: Nome+Sobrenome / CPF+Telefone / E-mail / CEP+Endereco /
   Numero+Complemento / Bairro+Cidade+Estado. Campos de 44 px, 14 px entre linhas.
   No celular, um campo por linha. */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
  align-items: end;
}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper > .form-row {
  grid-column: span 6;
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* pares de metade */
#billing_first_name_field, #billing_last_name_field,
#shipping_first_name_field, #shipping_last_name_field,
#brasil_id_field, #billing_phone_field, #shipping_phone_field { grid-column: span 3 !important; }
/* CEP e Numero estreitos, Endereco e Complemento largos */
#billing_postcode_field, #billing_number_field,
#shipping_postcode_field, #shipping_number_field { grid-column: span 2 !important; }
#billing_address_1_field, #billing_address_2_field,
#shipping_address_1_field, #shipping_address_2_field { grid-column: span 4 !important; }
/* Bairro, Cidade e Estado na mesma linha (o bairro tem nomes diferentes no hml e na producao) */
#billing_bairro_field, #billing__field, #billing_neighborhood_field, #billing_city_field, #billing_state_field,
#shipping_bairro_field, #shipping__field, #shipping_neighborhood_field, #shipping_city_field, #shipping_state_field { grid-column: span 2 !important; }

/* rotulo colado no campo, campo mais baixo */
.woocommerce-checkout .form-row label { margin: 0 0 5px !important; line-height: 1.3 !important; }
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select { height: 44px !important; padding: 10px 12px !important; }
.woocommerce-checkout .select2-container .select2-selection--single { height: 44px !important; box-sizing: border-box !important; display: flex; align-items: center; }
.woocommerce-checkout .form-row textarea { min-height: 88px; padding: 10px 12px !important; }

/* titulos e blocos do formulario com menos ar */
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout #order_review_heading { margin: 0 0 16px !important; }
.woocommerce-checkout #ship-to-different-address { margin: 22px 0 12px !important; font-size: var(--t3) !important; }
.woocommerce-checkout .woocommerce-additional-fields { margin-top: 18px !important; }
.woocommerce-checkout .woocommerce-additional-fields h3 { display: none; }

@media (max-width: 700px) {
  .woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row,
  .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper > .form-row { grid-column: span 6 !important; }
}
/* Complemento: mesmo corpo de rotulo dos outros campos, para a linha ficar alinhada */
.woocommerce-checkout #billing_address_2_field label,
.woocommerce-checkout #shipping_address_2_field label {
  font-size: 10.5px !important;
  line-height: 1.3 !important;
  letter-spacing: 1.26px !important;
  text-transform: uppercase !important;
  font-weight: var(--w7) !important;
  color: var(--mute) !important;
}
/* Pix: sem vao depois da frase */
.woocommerce-checkout #payment div.payment_box { padding-bottom: 0 !important; }
.woocommerce-checkout #payment div.payment_box p:last-child { margin-bottom: 0 !important; }
.woocommerce-checkout #payment div.payment_box > div:empty { display: none !important; }
.woocommerce-checkout .woocommerce-privacy-policy-text { margin-top: 18px !important; }
.woocommerce-checkout .woocommerce-privacy-policy-text p { margin: 0 !important; }
.woocommerce-checkout .form-row .woocommerce-input-wrapper,
.woocommerce-checkout .form-row .select2-container { display: block !important; vertical-align: top; }

/* SACOLA NO PADRAO DO CHECKOUT (22/09/2026): sem caixa no resumo, tabelas com a mesma
   linha nas duas colunas, cabecalho no corpo dos rotulos, botoes - e + desenhados,
   cupom sem moldura sobrando, "Atualizar sacola" como botao de contorno. */
body.woocommerce-cart .cart_totals {
  border: 0 !important;
  padding: 0 !important;
  background: none !important;
}
body.woocommerce-cart .cart_totals h2 { margin: 0 0 16px !important; font-size: 14px !important; font-weight: 900 !important; text-transform: uppercase; letter-spacing: 0; }

/* tabelas: produtos e resumo */
body.woocommerce-cart table.shop_table,
body.woocommerce-cart table.shop_table thead,
body.woocommerce-cart table.shop_table tbody,
body.woocommerce-cart table.shop_table tr { border: 0 !important; border-collapse: collapse !important; }
body.woocommerce-cart table.shop_table th,
body.woocommerce-cart table.shop_table td {
  border: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  padding: 14px 8px 14px 0 !important;
  background: none !important;
  vertical-align: middle;
}
body.woocommerce-cart table.shop_table thead th {
  font-size: 10.5px !important;
  letter-spacing: 1.26px !important;
  text-transform: uppercase;
  font-weight: var(--w7) !important;
  color: var(--mute) !important;
  border-bottom: 1px solid var(--ink) !important;
}
body.woocommerce-cart table.shop_table td.product-price,
body.woocommerce-cart table.shop_table td.product-subtotal { font-weight: var(--w4) !important; }
body.woocommerce-cart .cart_totals table.shop_table tr > :last-child { text-align: right; }
body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td {
  border-top: 2px solid var(--ink) !important;
  border-bottom: 0 !important;
  font-weight: var(--w8) !important;
  font-size: var(--t5);
}

/* quantidade: o tema pai usava um icone que nao carrega */
body.woocommerce-cart .nova-minicart-qty-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 36px;
  cursor: pointer;
  user-select: none;
  color: var(--ink);
  font-size: 16px;
  line-height: 1;
}
body.woocommerce-cart .nova-minicart-qty-button.decrease::before { content: "\2212"; }
body.woocommerce-cart .nova-minicart-qty-button.increase::before { content: "+"; }

/* cupom: campo e botao colados, sem moldura em volta */
body.woocommerce-cart .actions .coupon {
  display: inline-flex !important;
  align-items: stretch;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
body.woocommerce-cart .actions .coupon label { position: absolute !important; clip: rect(0 0 0 0); width: 1px; height: 1px; overflow: hidden; }
body.woocommerce-cart .actions .coupon input.input-text { height: 44px !important; width: 180px !important; margin: 0 !important; }
body.woocommerce-cart .actions .coupon .button { height: 44px !important; margin: 0 !important; }

/* botoes da sacola */
body.woocommerce-cart button[name="update_cart"] {
  background: #fff !important;
  color: var(--ink) !important;
  border: 1px solid var(--ink) !important;
  height: 44px;
  padding: 0 22px !important;
}
body.woocommerce-cart button[name="update_cart"]:disabled { opacity: .35; cursor: default; }
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
  display: block;
  width: 100%;
  padding: 18px 44px !important;
  font-size: var(--t2) !important;
  font-weight: var(--w7) !important;
  letter-spacing: 1.92px !important;
  text-transform: uppercase;
  text-align: center;
  background: var(--pto) !important;
  color: var(--cream) !important;
  border-radius: 0 !important;
}

/* ajuste fino da sacola (22/09/2026): celulas do resumo esticam na coluna inteira,
   rotulo TOTAL no corpo dos rotulos (so o valor cresce), cupom sem o recheio que o
   tema reservava para o botao dentro do campo */
body.woocommerce-cart .cart_totals table.shop_table { width: 100% !important; table-layout: auto; }
body.woocommerce-cart .cart_totals table.shop_table tr { display: table-row !important; }
body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td { display: table-cell !important; width: auto !important; }
body.woocommerce-cart .cart_totals table.shop_table th { width: 40% !important; }
body.woocommerce-cart .cart_totals .order-total th {
  font-size: 10.5px !important;
  letter-spacing: 1.26px !important;
  font-weight: var(--w7) !important;
}
body.woocommerce-cart table.shop_table .amount { font-weight: inherit !important; }
body.woocommerce-cart .actions .coupon input.input-text { padding: 0 12px !important; width: 220px !important; }
body.woocommerce-cart .cart_totals table.shop_table tbody { display: table-row-group !important; }

/* O que o HTML marca como escondido fica escondido (22/09/2026). Varias classes do tema
   forcam display e venciam o atributo hidden: na pagina Salvos o aviso "Nada salvo
   ainda" aparecia junto com os produtos salvos. */
[hidden] { display: none !important; }

/* aviso de lista vazia sem moldura (regra das caixas, 22/09/2026) */
.lt-vazio { border: 0 !important; background: none !important; }

/* INSTITUCIONAIS NO PADRAO (22/09/2026) */
/* Sobre nos: os quatro pilares sem caixa creme, como a faixa de garantias da home */
.sb-pil-g > div {
  background: none !important;
  border: 0 !important;
  border-top: 1px solid var(--line) !important;
  padding: 20px 0 0 !important;
  border-radius: 0 !important;
}

/* Contato: campos com respiro igual ao checkout (antes colados, a zero de distancia) */
.page-template-page-contato-seedclub .wpcf7-form .wpcf7-form-control-wrap { display: block; margin: 0 0 14px; }
.page-template-page-contato-seedclub .wpcf7-form input.wpcf7-form-control:not([type=submit]),
.page-template-page-contato-seedclub .wpcf7-form textarea { height: 44px; padding: 10px 12px !important; box-sizing: border-box; width: 100%; }
.page-template-page-contato-seedclub .wpcf7-form textarea { height: 160px; }
.page-template-page-contato-seedclub .wpcf7-form input[type=submit] {
  padding: 18px 44px !important;
  font-size: var(--t2) !important;
  font-weight: var(--w7) !important;
  letter-spacing: 1.92px !important;
  text-transform: uppercase;
  background: var(--pto) !important;
  color: var(--cream) !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* Contato: atalhos como lista de links numa linha so, sem botoes quebrando em duas linhas */
.ct-atalhos { display: flex !important; flex-wrap: wrap; gap: 8px 24px !important; }
.ct-atalhos a {
  border: 0 !important;
  padding: 0 !important;
  background: none !important;
  font-size: var(--t3) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-weight: var(--w7) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* BANNERS TEMATICOS (22/09/2026): cada pagina com a sua imagem. A imagem vem primeiro;
   as seis fotos curadas ficam por baixo como reserva, entao se o arquivo faltar
   o banner continua com fotos e nada quebra. Posicao 67% 50% segura o sujeito
   no terco direito tambem no celular. */
body.error404 section.pg-topo:not(.pg-topo--banner) {
  /* v2 (plano aberto, semente a 80% da largura) por cima; v1 e as seis fotos de reserva */
  background-image: linear-gradient(90deg, rgba(10,9,8,.72) 0%, rgba(10,9,8,.45) 40%, rgba(10,9,8,.08) 72%, rgba(10,9,8,0) 100%), url(/wp-content/uploads/2026/09/Banner404_SeedClub-v2.webp), url(/wp-content/uploads/2026/09/Banner404_SeedClub.webp), url(../img/cat_categoria-hibridas.jpg), url(../img/cat_categoria-feminizadas.jpg), url(../img/cat_categoria-indica-v3.jpg), url(../img/cat_categoria-alto-rendimento.jpg), url(../img/cat_categoria-regulares.jpg), url(../img/cat_categoria-sativa-v2.jpg);
  background-size: 100% 100%, cover, cover, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%;
  background-position: 0 0, 80% 50%, 67% 50%, calc(0 * 100vw / 6) 0, calc(1 * 100vw / 6) 0, calc(2 * 100vw / 6) 0, calc(3 * 100vw / 6) 0, calc(4 * 100vw / 6) 0, calc(5 * 100vw / 6) 0;
}

/* 404 NO PADRAO DO SITE (22/09/2026): titulo na escala dos banners e numa linha,
   frase no corpo de texto, busca compacta como acao principal, atalhos como links.
   O banner volta a altura padrao e a imagem respira. */
body.error404 section.pg-topo > .in { padding-block: clamp(22px, 2.8vw, 40px) !important; }
body.error404 .nf-h1 {
  font-size: var(--sc-topo-t) !important;
  line-height: 1 !important;
  letter-spacing: -.015em !important;
  margin: 0 0 12px !important;
}
body.error404 .nf-h1 span { display: inline !important; }
body.error404 section.pg-topo .pg-lead {
  font-size: var(--t4) !important;
  line-height: 1.5 !important;
  max-width: 52ch;
  margin: 0 0 20px !important;
  color: rgba(255,255,255,.78) !important;
}
body.error404 .nf-busca { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; width: 100%; max-width: 520px; margin: 0 0 16px !important; }
body.error404 .nf-busca input[type=search] {
  flex: 1;
  min-width: 0;
  height: 44px !important;
  padding: 0 14px !important;
  font-size: var(--t4) !important;
  background: rgba(10,9,8,.35) !important;
  border: 1px solid rgba(255,255,255,.45) !important;
  border-right: 0 !important;
  border-radius: 0 !important;
  color: var(--cream) !important;
}
body.error404 .nf-busca input[type=search]::placeholder { color: rgba(255,255,255,.6); }
body.error404 .nf-busca button {
  height: 44px !important;
  padding: 0 22px !important;
  font-size: var(--t2) !important;
  font-weight: var(--w7) !important;
  letter-spacing: 1.92px !important;
  text-transform: uppercase;
  background: var(--cream) !important;
  color: var(--pto) !important;
  border: 0 !important;
  border-radius: 0 !important;
}
body.error404 .nf-links { display: flex !important; flex-wrap: wrap; gap: 8px 22px !important; margin: 0 !important; }
body.error404 .nf-links a {
  border: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  background: none !important;
  color: var(--cream) !important;
  font-size: var(--t3) !important;
  font-weight: var(--w7) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* FUNDO ABAIXO DO RODAPE (22/09/2026): pagina curta nao deixa faixa branca embaixo;
   o que sobrar da janela continua na cor do rodape. */
html { background: var(--pto); }
body { background: #fff; }

/* FAVORITAR PADRAO NO SITE (22/09/2026, Artur): vermelho, contorno vazado;
   preenche ao passar o mouse e quando ja esta salvo (para a pessoa saber o que salvou).
   Vale para o botao da pagina de produto, os coracoes dos cards e o do cabecalho. */
:root { --vermelho: #D12B20; }
.pd-btn2.sc-salvar {
  background: #fff !important;
  color: var(--vermelho) !important;
  border: 1px solid var(--vermelho) !important;
}
.pd-btn2.sc-salvar:hover,
.pd-btn2.sc-salvar.on {
  background: var(--vermelho) !important;
  color: #fff !important;
  border-color: var(--vermelho) !important;
}
.pd-btn2.sc-salvar svg { fill: transparent !important; stroke: currentColor !important; stroke-width: 1.8px; }
.pd-btn2.sc-salvar:hover svg,
.pd-btn2.sc-salvar.on svg { fill: currentColor !important; }

.card-heart,
a.ti.fav { color: var(--vermelho) !important; }
.card-heart svg,
a.ti.fav svg { fill: transparent !important; stroke: var(--vermelho) !important; stroke-width: 1.8px; }
.card-heart svg { filter: drop-shadow(0 0 2px rgba(0,0,0,.45)); }
.card-heart:hover svg,
.card-heart.on svg,
.card-heart[aria-pressed="true"] svg,
a.ti.fav:hover svg { fill: var(--vermelho) !important; }

/* CONTADORES DO CABECALHO (22/09/2026, Artur): todos preto com numero branco;
   so o do coracao e vermelho com numero branco (antes: marrom no coracao, oliva na sacola). */
header .ti b,
header .sc-cart-n { background: var(--pto) !important; color: #fff !important; }
header #favN { background: var(--vermelho) !important; color: #fff !important; }

/* banner tematico das categorias (22/09/2026): "a selecao" — sementes separadas por tom.
   Mesmo modelo da 404: sombra da esquerda para a direita, sujeito a 80%, fotos de reserva por baixo. */
body.tax-product_cat section.pg-topo:not(.pg-topo--banner) {
  background-image: linear-gradient(90deg, rgba(10,9,8,.72) 0%, rgba(10,9,8,.45) 40%, rgba(10,9,8,.08) 72%, rgba(10,9,8,0) 100%), url(/wp-content/uploads/2026/09/BannerCategoria_SeedClub.webp), url(../img/cat_categoria-hibridas.jpg), url(../img/cat_categoria-feminizadas.jpg), url(../img/cat_categoria-indica-v3.jpg), url(../img/cat_categoria-alto-rendimento.jpg), url(../img/cat_categoria-regulares.jpg), url(../img/cat_categoria-sativa-v2.jpg);
  background-size: 100% 100%, cover, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%;
  background-position: 0 0, 80% 50%, calc(0 * 100vw / 6) 0, calc(1 * 100vw / 6) 0, calc(2 * 100vw / 6) 0, calc(3 * 100vw / 6) 0, calc(4 * 100vw / 6) 0, calc(5 * 100vw / 6) 0;
}

/* 404 EM TELA CHEIA (22/09/2026, Artur): o banner ocupa a tela inteira e o rodape so
   aparece rolando. Duas imagens: horizontal (computador e tablet deitado) e vertical
   (celular e tablet em pe). Cada uma tem a anterior por baixo como reserva. */
body.error404 section.pg-topo {
  min-height: calc(100svh - var(--hdr, 72px)) !important;
  align-items: center !important;
}
body.error404 section.pg-topo:not(.pg-topo--banner) {
  background-image: linear-gradient(90deg, rgba(10,9,8,.72) 0%, rgba(10,9,8,.45) 40%, rgba(10,9,8,.08) 72%, rgba(10,9,8,0) 100%), url(/wp-content/uploads/2026/09/Banner404_SeedClub-tela.webp), url(/wp-content/uploads/2026/09/Banner404_SeedClub-v2.webp), url(../img/cat_categoria-hibridas.jpg), url(../img/cat_categoria-feminizadas.jpg), url(../img/cat_categoria-indica-v3.jpg), url(../img/cat_categoria-alto-rendimento.jpg), url(../img/cat_categoria-regulares.jpg), url(../img/cat_categoria-sativa-v2.jpg);
  background-size: 100% 100%, cover, cover, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%;
  background-position: 0 0, 80% 50%, 80% 50%, calc(0 * 100vw / 6) 0, calc(1 * 100vw / 6) 0, calc(2 * 100vw / 6) 0, calc(3 * 100vw / 6) 0, calc(4 * 100vw / 6) 0, calc(5 * 100vw / 6) 0;
}
/* em pe: imagem vertical, semente no terco de cima, texto embaixo sobre a sombra */
@media (orientation: portrait) and (max-width: 1024px) {
  body.error404 section.pg-topo { align-items: flex-end !important; }
  body.error404 section.pg-topo:not(.pg-topo--banner) {
    background-image: linear-gradient(to top, rgba(10,9,8,.92) 0%, rgba(10,9,8,.7) 38%, rgba(10,9,8,.15) 65%, rgba(10,9,8,0) 100%), url(/wp-content/uploads/2026/09/Banner404_SeedClub-vertical.webp), url(/wp-content/uploads/2026/09/Banner404_SeedClub-tela.webp), url(/wp-content/uploads/2026/09/Banner404_SeedClub-v2.webp), url(../img/cat_categoria-hibridas.jpg), url(../img/cat_categoria-feminizadas.jpg), url(../img/cat_categoria-indica-v3.jpg), url(../img/cat_categoria-alto-rendimento.jpg), url(../img/cat_categoria-regulares.jpg), url(../img/cat_categoria-sativa-v2.jpg);
    background-size: 100% 100%, cover, cover, cover, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%, auto 100%;
    background-position: 0 0, 50% 30%, 80% 50%, 80% 50%, calc(0 * 100vw / 6) 0, calc(1 * 100vw / 6) 0, calc(2 * 100vw / 6) 0, calc(3 * 100vw / 6) 0, calc(4 * 100vw / 6) 0, calc(5 * 100vw / 6) 0;
  }
}

/* FAIXA DO CAMINHO (22/09/2026): o caminho do cliente fica logo abaixo do banner,
   igual em todas as paginas, e nao herda o respiro grande do conteudo. */
main .in.sc-crumb-bar { padding-top: 14px !important; padding-bottom: 0 !important; }
main .in.sc-crumb-bar .lt-crumb { margin: 0 !important; }
main .in.sc-crumb-bar .lt-crumb,
main .in.sc-crumb-bar .lt-crumb a { color: var(--mute) !important; }
main .in.sc-crumb-bar .lt-crumb a:hover { color: var(--ink) !important; }
section.pg-topo .lt-crumb, section.mk .lt-crumb { display: none !important; }

/* ESPACAMENTO COMPACTO (22/09/2026, Artur): mesmo respiro entre blocos no site todo,
   mais apertado do que o do tema. */
:root { --sc-bloco: clamp(32px, 3.6vw, 56px); }
main.lt > .in, main.pg > .in { padding-bottom: var(--sc-bloco) !important; }
section.pg-topo + .in, section.mk + .in { padding-top: 16px !important; }
.sc-crumb-bar + .in { padding-top: 10px !important; }
.lt-corpo { padding-top: 10px !important; }

/* AJUSTE FINAL DA FAIXA DO CAMINHO (22/09/2026): vem depois das regras de espacamento
   para nao herdar nem o respiro do conteudo nem o do topo. */
main .in.sc-crumb-bar,
main.lt > .in.sc-crumb-bar,
main.pg > .in.sc-crumb-bar,
section.pg-topo + .in.sc-crumb-bar,
section.mk + .in.sc-crumb-bar { padding-top: 14px !important; padding-bottom: 0 !important; }
main .in.sc-crumb-bar .lt-crumb { padding: 0 !important; margin: 0 !important; }

/* QUINTA COLUNA DO MENU (22/09/2026): a coluna Descobrir entra na mesma linha;
   so a ultima coluna (Descobrir) fica no bloco escuro, Marcas volta ao claro. */
.mega .mega-in { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
.mega .mega-in > .blk { background: none !important; margin: 0 !important; padding: 0 !important; }
.mega .mega-in > .blk h4 { color: var(--mute) !important; }
.mega .mega-in > .blk li a { color: var(--ink) !important; }
.mega .mega-in > .mega-descobrir {
  background: var(--pto) !important;
  margin: -26px calc(var(--gut) * -1) -26px 0 !important;
  padding: 26px var(--gut) 26px 26px !important;
}
.mega .mega-in > .mega-descobrir h4 { color: rgba(255,255,255,.55) !important; }
.mega .mega-in > .mega-descobrir li a { color: #fff !important; }
.mega .mega-in > .mega-descobrir li em { display: inline !important; font-style: normal; opacity: .5; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
@media (max-width: 1100px) { .mega .mega-in { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } .mega .mega-in > .mega-descobrir { margin: 0 !important; padding: 20px !important; } }

/* GAVETA EM SANFONA (22/09/2026, Artur): no celular o menu abre todo recolhido e
   a pessoa vai abrindo nivel por nivel; mesma ordem da versao de computador. */
.gav .gav-sec { border-bottom: 1px solid var(--line); }
.gav .gav-sec > summary,
.gav .gav-lnk {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 0; cursor: pointer; list-style: none;
  font-size: 15px; font-weight: var(--w7); letter-spacing: .04em; text-transform: uppercase;
  color: var(--ink);
}
.gav .gav-lnk { border-bottom: 1px solid var(--line); text-decoration: none; }
.gav .gav-sec > summary::-webkit-details-marker { display: none; }
.gav .gav-sec > summary::after { content: '+'; font-size: 18px; font-weight: 400; opacity: .55; }
.gav .gav-sec[open] > summary::after { content: '\2212'; }
.gav .gav-sub { padding: 0 0 14px; }
.gav .gav-sub2 { border-top: 1px solid var(--line); }
.gav .gav-sub2 > summary {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 0 12px 12px; cursor: pointer; list-style: none;
  font-size: 10.5px; font-weight: var(--w7); letter-spacing: .16em; text-transform: uppercase; color: var(--mute);
}
.gav .gav-sub2 > summary::-webkit-details-marker { display: none; }
.gav .gav-sub2 > summary::after { content: '+'; font-size: 15px; letter-spacing: 0; }
.gav .gav-sub2[open] > summary::after { content: '\2212'; }
.gav .gav-sub ul { list-style: none; margin: 0 0 8px; padding: 0 0 0 12px; display: grid; gap: 2px; }
.gav .gav-sub li a { display: flex; justify-content: space-between; padding: 9px 0; font-size: 14px; color: var(--ink); }
.gav .gav-sub li em { display: inline !important; font-style: normal; color: var(--mute); font-size: 11px; }
.gav .gav-todos { display: flex; justify-content: space-between; padding: 12px 12px 12px 12px; font-size: 13px; font-weight: var(--w7); }
.gav .gav-clube-txt { color: var(--mute); font-size: 12.5px; line-height: 1.5; margin: 6px 12px 10px; }
.gav .dia { display: none !important; }

/* GAVETA ITENS (22/09/2026): os itens dentro da sanfona sao lista simples, em uma coluna,
   sem caixa-alta herdada da gaveta antiga. */
.gav .gav-sub ul { grid-template-columns: 1fr !important; }
.gav .gav-sub li a {
  text-transform: none !important;
  font-weight: var(--w5, 500) !important;
  letter-spacing: 0 !important;
  font-size: 14px !important;
  border: 0 !important;
}
.gav .gav-todos { text-transform: none !important; letter-spacing: 0 !important; font-size: 13.5px !important; }

/* REVISAO MOBILE 22/09 (Artur): cards em duas colunas como na loja, ficha so no
   computador, hero sem cortar a arte e sacola empilhada. */

/* 1. aparelho sem mouse: a ficha que abria no hover nao aparece sozinha */
@media (hover: none), (pointer: coarse) {
  .card .card-hover { display: none !important; }
}

/* 2. grade da home igual a da loja no celular */
@media (max-width: 700px) {
  .grade { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
  .card .card-hover { display: none !important; }
  .grade > * { min-width: 0; }
}

/* 3. hero da home: a arte tem texto dentro, entao no celular aparece inteira em vez de cortada */
@media (max-width: 700px) {
  .slide, .slide a { height: auto !important; }
  .slide img { height: auto !important; aspect-ratio: 1200 / 516; object-fit: contain !important; }
}

/* 4. sacola no celular: cada linha vira um cartao empilhado, sem posicao absoluta */
@media (max-width: 700px) {
  .woocommerce-cart-form table.shop_table,
  .woocommerce-cart-form table.shop_table tbody,
  .woocommerce-cart-form table.shop_table tr,
  .woocommerce-cart-form table.shop_table td { display: block !important; width: 100% !important; }
  .woocommerce-cart-form table.shop_table thead { display: none !important; }
  .woocommerce-cart-form tr.cart_item,
  .woocommerce-cart-form tr.woocommerce-cart-form__cart-item {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 84px 1fr;
    grid-template-areas: 'foto nome' 'foto preco' 'qtd total';
    gap: 4px 14px;
    align-items: center;
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
  }
  .woocommerce-cart-form td.product-thumbnail { grid-area: foto; }
  .woocommerce-cart-form td.product-thumbnail img { width: 84px !important; height: 84px; object-fit: cover; }
  .woocommerce-cart-form td.product-name { grid-area: nome; }
  .woocommerce-cart-form td.product-price { grid-area: preco; }
  .woocommerce-cart-form td.product-quantity { grid-area: qtd; position: static !important; width: auto !important; }
  .woocommerce-cart-form td.product-subtotal { grid-area: total; text-align: right; font-weight: var(--w7); }
  .woocommerce-cart-form td.product-remove { position: absolute !important; top: 16px; right: 0; width: auto !important; }
  .woocommerce-cart-form td.actions { display: grid !important; gap: 10px; padding: 16px 0 !important; }
  .woocommerce-cart-form td.actions .coupon { display: grid !important; grid-template-columns: 1fr auto; gap: 8px; width: 100% !important; }
  .woocommerce-cart-form td.actions .coupon input { width: 100% !important; }
  .woocommerce-cart-form td.actions button[name="update_cart"] { width: 100% !important; margin: 0 !important; }
  .cart_totals { margin-top: 8px; }
}

/* MOBILE PARTE 2 (22/09): menu da conta que passava da largura, e checkout com
   campos largos o suficiente para digitar. */
@media (max-width: 700px) {
  .woocommerce-MyAccount-navigation ul {
    display: flex !important;
    gap: 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
  }
  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
  .woocommerce-MyAccount-navigation li { flex: 0 0 auto; }
  .woocommerce-MyAccount-navigation li a { white-space: nowrap; }

  /* checkout: so nome/sobrenome e CEP/numero dividem a linha */
  .woocommerce-billing-fields__field-wrapper,
  .woocommerce-shipping-fields__field-wrapper { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .woocommerce-billing-fields__field-wrapper > .form-row,
  .woocommerce-shipping-fields__field-wrapper > .form-row { grid-column: span 2 !important; }
  #billing_first_name_field, #billing_last_name_field,
  #shipping_first_name_field, #shipping_last_name_field,
  #billing_postcode_field, #billing_number_field,
  #shipping_postcode_field, #shipping_number_field { grid-column: span 1 !important; }
}

/* MOBILE CHECKOUT POR ID (22/09): no celular quase tudo ocupa a linha inteira;
   so nome/sobrenome e CEP/numero dividem. Escrito por id para vencer o desenho do computador. */
@media (max-width: 700px) {
  #billing_first_name_field,
  #billing_last_name_field,
  #brasil_id_field,
  #billing_phone_field,
  #billing_email_field,
  #billing_postcode_field,
  #billing_address_1_field,
  #billing_number_field,
  #billing_address_2_field,
  #billing_bairro_field,
  #billing_city_field,
  #billing_state_field,
  #shipping_first_name_field,
  #shipping_last_name_field,
  #shipping_postcode_field,
  #shipping_address_1_field,
  #shipping_number_field,
  #shipping_address_2_field,
  #shipping_bairro_field,
  #shipping_city_field,
  #shipping_state_field { grid-column: 1 / -1 !important; }
  #billing_first_name_field,
  #billing_last_name_field,
  #billing_postcode_field,
  #billing_number_field,
  #shipping_first_name_field,
  #shipping_last_name_field,
  #shipping_postcode_field,
  #shipping_number_field { grid-column: span 1 !important; }
}

/* BLOCOS DA HOME 22/09 (Artur): parceiros sem caixa (logo e informacao abaixo),
   educacao e artigos mais compactos, destaque de marca com foto menor. */

/* Parceiros: cartao vira logo + nome + pais + numeros, sem moldura e sem ficha */
.pcs .pc {
  background: none !important;
  border: 0 !important;
  border-top: 1px solid var(--line) !important;
  border-radius: 0 !important;
  padding: 16px 0 0 !important;
  box-shadow: none !important;
  min-height: 0 !important;
}
.pcs .pc .pc-mk {
  display: block !important;
  position: static !important;
  width: 100% !important;
  box-sizing: border-box !important;
  height: 64px !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  margin: 0 0 12px !important;
  filter: none !important;
}
.pcs .pc .pc-det { display: none !important; }
.pcs .pc h3 { font-size: 14px !important; margin: 0 0 2px !important; }
.pcs .pc .loc { font-size: 11.5px !important; color: var(--mute) !important; }
.pcs .pc .pc-mini { display: flex !important; gap: 14px !important; margin-top: 10px !important; }
.pcs .pc .pc-mini b { font-size: 15px !important; }
.pcs .pc .pc-mini em { font-size: 10px !important; letter-spacing: .1em; text-transform: uppercase; color: var(--mute); }

/* Destaque de marca: foto deixa de dominar a tela */
.dest-br .db-foto img { max-height: 420px !important; object-fit: cover; width: 100%; }

@media (max-width: 700px) {
  .pcs { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px 16px !important; }
  .pcs .pc .pc-mk { height: 44px !important; }
  .pcs .pc .pc-mini { gap: 10px !important; }
  .edu { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
  .art3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
  .art3 > *, .edu > * { min-width: 0; }
  .dest-br .db-foto img { max-height: 240px !important; }
  .dest-br .db-grid { gap: 14px !important; }
}

/* DESTAQUE DE MARCA 22/09: a moldura da foto tinha altura fixa e sobrava um vazio
   abaixo da imagem; no celular a foto e o carrossel ficam menores. */
.dest-br .db-foto { height: auto !important; }
@media (max-width: 700px) {
  .dest-br .db-foto img { max-height: 200px !important; }
  .dest-br .db-carr .card { width: 132px !important; flex: 0 0 132px !important; }
}

/* PARCEIROS SEM MOLDURA (22/09, Artur): o cartao tinha foto de fundo com altura fixa e
   um painel escuro por cima. Agora e logo, nome, pais e numeros, em fluxo, sem caixa. */
.pcs .pc {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  background-image: none !important;
  overflow: visible !important;
}
.pcs .pc::before, .pcs .pc::after { display: none !important; }
.pcs .pc .pc-pn {
  position: static !important;
  background: none !important;
  backdrop-filter: none !important;
  padding: 0 !important;
  margin: 10px 0 0 !important;
  inset: auto !important;
  display: block !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}
.pcs .pc .pc-pn h3, .pcs .pc .pc-pn .pc-mini b { color: var(--ink) !important; }
.pcs .pc .pc-pn .loc, .pcs .pc .pc-pn .pc-mini em { color: var(--mute) !important; }

/* SELOS NO CELULAR (22/09, Artur): rotulo curto e sem subtitulo; quatro em duas linhas,
   com o icone ao lado do texto. */
.selo .sl-curto { display: none; }
@media (max-width: 700px) {
  .selo .sl-longo { display: none; }
  .selo .sl-curto { display: inline; }
  .selo .sl-tx em { display: none !important; }
  .selos-in { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .selo { display: flex !important; align-items: center !important; gap: 10px !important; padding: 14px 12px !important; min-height: 0 !important; }
  .selo .sl-ic { flex: 0 0 auto; }
  .selo .sl-ic svg { width: 22px !important; height: 22px !important; }
  .selo .sl-tx b { font-size: 11px !important; line-height: 1.25 !important; letter-spacing: .06em; }
}

/* ESCALA DO CELULAR 22/09 (Artur): tres cards por linha como na loja do Telegram e
   todos os blocos proporcionalmente menores. */
@media (max-width: 700px) {
  :root { --sc-bloco: 26px; --gut: 14px; }

  /* cards de produto: tres por linha */
  .grade, .lt-grade { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; }
  .card .card-nome, .card h3 { font-size: 11.5px !important; line-height: 1.25 !important; }
  .card .card-marca, .card .marca { font-size: 9.5px !important; }
  .card .card-preco, .card .preco { font-size: 11.5px !important; }
  .card-heart { width: 26px !important; height: 26px !important; }
  .card-heart svg { width: 15px !important; height: 15px !important; }

  /* titulos de secao e cabecalhos mais contidos */
  .sec .tt, .tt { font-size: 21px !important; letter-spacing: -.01em !important; }
  .sec-h, .pc-top { margin-bottom: 12px !important; }

  /* parceiros, educacao e artigos acompanham a mesma escala */
  .pcs { gap: 14px 12px !important; }
  .pcs .pc { padding-top: 12px !important; }
  .pcs .pc .pc-mk { height: 38px !important; }
  .pcs .pc h3 { font-size: 12.5px !important; }
  .pcs .pc .loc { font-size: 10.5px !important; }
  .pcs .pc .pc-mini b { font-size: 13px !important; }
  .pcs .pc .pc-mini em { font-size: 9px !important; }
  .edu, .art3 { gap: 12px !important; }
  .edu h3, .art3 h3 { font-size: 12.5px !important; line-height: 1.3 !important; }
  .art3 p, .edu p { font-size: 11.5px !important; }

  /* categorias em carrossel e jornada tambem encolhem */
  .carr .cat { width: 132px !important; }
  .jn-c { min-height: 0 !important; }
  .jn-c .jn-tv { font-size: 12.5px !important; }
}

/* LEGENDA DO CARD NO CELULAR (22/09): com tres por linha, nome e preco nao cabem
   lado a lado; o preco desce para a linha de baixo. */
@media (max-width: 700px) {
  .card .card-leg { flex-direction: column !important; align-items: flex-start !important; gap: 2px !important; }
  .card .card-leg > * { width: 100% !important; }
  .card .card-leg .lg-t b { font-size: 11px !important; line-height: 1.2 !important; }
  .card .card-leg .lg-t small { font-size: 9.5px !important; }
  .card .card-leg .preco, .card .card-leg .lg-p, .card .card-leg .woocommerce-Price-amount { font-size: 11.5px !important; font-weight: var(--w7) !important; }
}

/* CELULAR: PARCEIROS, DESTAQUE E RODAPE (22/09, Artur) */
@media (max-width: 700px) {
  /* Parceiros viram linhas: logo a esquerda, nome e pais a direita, numeros embaixo */
  .pcs { grid-template-columns: 1fr !important; gap: 0 !important; }
  .pcs .pc {
    display: grid !important;
    grid-template-columns: 56px 1fr;
    grid-template-areas: 'logo nome' 'logo num';
    gap: 2px 14px;
    align-items: center;
    padding: 12px 0 !important;
  }
  .pcs .pc .pc-mk { grid-area: logo; height: 40px !important; width: 56px !important; margin: 0 !important; background-position: center !important; }
  .pcs .pc .pc-pn { grid-area: nome; margin: 0 !important; }
  .pcs .pc .pc-mini { grid-area: num; margin: 4px 0 0 !important; gap: 16px !important; }
  .pcs .pc .pc-mini span { display: flex !important; align-items: baseline; gap: 4px; white-space: nowrap; }
  .pcs .pc .pc-mini em { font-size: 9.5px !important; }
  .pcs .pc .pc-mini span:last-child { display: none !important; }

  /* Destaque de marca: sem o vazio entre a foto e o texto */
  .dest-br .db-grid { gap: 10px !important; }
  .dest-br .db-txt { padding: 0 !important; gap: 8px !important; }
  .dest-br .db-txt > * { margin: 0 !important; }
  .dest-br .db-marca { margin: 2px 0 !important; }
  .dest-br .db-marca img { max-height: 30px !important; width: auto !important; }
  .dest-br .db-p { font-size: 12.5px !important; line-height: 1.5 !important; }
  .dest-br .db-num { gap: 14px !important; margin-top: 6px !important; }
  .dest-br .db-foto figcaption { font-size: 10.5px !important; padding: 6px 0 !important; }

  /* Rodape: duas colunas e linhas mais juntas */
  footer .ft-cols, footer .ft-in > div, footer nav { --x: 0; }
  footer ul { display: grid !important; gap: 6px !important; }
  footer li a { padding: 4px 0 !important; font-size: 13px !important; }
  footer h4, footer .ft-h { font-size: 10px !important; margin: 14px 0 6px !important; }
  footer p { font-size: 12px !important; line-height: 1.5 !important; }
}

/* AJUSTE FINO CELULAR 22/09: margem lateral do destaque (que eu tinha zerado) e
   rodape em duas colunas para nao virar uma coluna interminavel. */
@media (max-width: 700px) {
  .dest-br .db-grid { padding-inline: var(--gut) !important; }
  .dest-br .db-txt { padding-inline: 0 !important; }
  .dest-br .db-foto { margin-inline: calc(var(--gut) * -1) !important; }
  .dest-br .db-foto figcaption { padding-inline: var(--gut) !important; }

  footer .pe { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 4px 16px !important; align-items: start; }
  footer .pe > *:first-child { grid-column: 1 / -1 !important; margin-bottom: 8px; }
  footer .pe-bot { flex-wrap: wrap; gap: 10px 16px; }
}

/* PARCEIROS ALINHADOS 22/09 (Artur): logo numa caixa de altura fixa e linhas
   alinhadas entre cartoes; a coluna vazia de drops nao aparece. */
.pcs { align-items: start !important; }
.pcs .pc {
  display: grid !important;
  grid-template-rows: 56px auto auto;
  align-content: start;
  row-gap: 10px;
}
.pcs .pc .pc-mk {
  height: 56px !important;
  background-position: left center !important;
  background-size: contain !important;
  align-self: center;
}
.pcs .pc .pc-pn { display: block !important; }
.pcs .pc h3 { font-size: 14px !important; line-height: 1.2 !important; margin: 0 0 2px !important; }
.pcs .pc .loc { font-size: 11px !important; display: block !important; }
.pcs .pc .pc-mini { margin-top: 8px !important; gap: 18px !important; }
.pcs .pc .pc-mini b { font-size: 14px !important; line-height: 1.1 !important; }
.pcs .pc .pc-mini em { font-size: 9px !important; letter-spacing: .1em !important; }
/* esconde qualquer numero sem dado (o tema marca com a classe na) */
.pcs .pc .pc-mini span:has(b.na) { display: none !important; }

@media (max-width: 700px) {
  .pcs .pc {
    grid-template-rows: auto auto !important;
    grid-template-columns: 56px 1fr !important;
    grid-template-areas: 'logo nome' 'logo num' !important;
    row-gap: 2px !important;
  }
  .pcs .pc .pc-mk { height: 40px !important; align-self: center; }
}

/* BANDEIRA DO PARCEIRO (22/09): a bandeira e um emoji em imagem; sem tamanho fixo
   ela ocupava a largura toda do cartao. */
.pcs .pc .loc { display: flex !important; align-items: center; gap: 5px; }
.pcs .pc .loc img, .pcs .pc .loc img.emoji, .pcs .pc .loc .fl img {
  width: 14px !important;
  height: 14px !important;
  min-width: 0 !important;
  max-width: 14px !important;
  display: inline-block !important;
  margin: 0 !important;
}
.pcs .pc .loc .fl { display: inline-flex !important; width: auto !important; }

/* SEM PARCEIROS NO CELULAR (22/09, Artur): a secao de parceiros nao aparece no celular;
   no computador segue igual. */
@media (max-width: 700px) {
  main > section:has(.pcs) { display: none !important; }
  .pcs, .pc-top { display: none !important; }
}

/* AJUSTES 22/09 NOITE (Artur): parceiros centralizados no computador, destaque de
   marca alinhado no topo e artigos compactos no celular. */

/* 1. parceiros: tudo no mesmo eixo, logo maior */
@media (min-width: 701px) {
  .pcs .pc { text-align: center; justify-items: center; grid-template-rows: 72px auto auto; }
  .pcs .pc .pc-mk { height: 72px !important; width: 100% !important; background-position: center center !important; }
  .pcs .pc .pc-pn { text-align: center; width: 100%; }
  .pcs .pc .loc { justify-content: center; }
  .pcs .pc .pc-mini { justify-content: center; }
}

/* 2. destaque de marca: a moldura da foto esticava ate a altura do texto e jogava a
   legenda para o rodape do bloco */
.dest-br .db-grid { align-items: start !important; }
.dest-br .db-foto { align-self: start !important; }

/* 3. artigos no celular: capa mais baixa, sem o resumo */
@media (max-width: 700px) {
  .art3 article img, .art3 a img { aspect-ratio: 4 / 3 !important; height: auto !important; object-fit: cover; }
  .art3 p { display: none !important; }
  .art3 h3 { font-size: 12.5px !important; line-height: 1.3 !important; }
  .art3 .chip, .art3 time, .art3 .meta { font-size: 9.5px !important; }
}

/* MOLDURA DA FOTO DO DESTAQUE (22/09): a imagem e posicionada dentro de uma moldura
   com altura propria; limitar a imagem deixava preto sobrando. Limito a moldura. */
.dest-br .db-foto { height: 480px !important; aspect-ratio: auto !important; }
.dest-br .db-foto img { max-height: none !important; height: 100% !important; width: 100% !important; object-fit: cover !important; }
@media (max-width: 700px) {
  .dest-br .db-foto { height: 260px !important; }
  .dest-br .db-foto img { max-height: none !important; }
}

/* ARTIGOS NO CELULAR 22/09 (Artur): a materia em destaque ocupava 436px sozinha.
   Capa mais baixa, resumo em duas linhas e assinatura enxuta. */
@media (max-width: 700px) {
  .sec .dest .art-cap { height: 120px !important; }
  .sec .dest .bd { padding: 12px 0 0 !important; gap: 6px !important; }
  .sec .dest h3 { font-size: 15px !important; line-height: 1.25 !important; }
  .sec .dest p {
    font-size: 12.5px !important;
    line-height: 1.45 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .sec .dest .by-row { display: none !important; }
  .sec .dest .meta, .sec .dest .chip { font-size: 9.5px !important; }
  .art3 .art-cap { height: 92px !important; }
  .art3 .bd { padding: 10px 0 0 !important; }
}

/* FOTO PREENCHE O QUADRANTE (22/09): no computador a foto tinha altura fixa menor que
   a coluna e sobrava uma faixa preta embaixo. */
@media (min-width: 701px) {
  .dest-br .db-grid { align-items: stretch !important; }
  .dest-br .db-foto { height: 100% !important; align-self: stretch !important; min-height: 480px; }
}

/* RECENTES NO CELULAR (22/09): tres por linha deixaria uma sobrando na quarta linha;
   o decimo card sai no celular para fechar tres linhas certas. */

/* LINHAS CHEIAS NO CELULAR (22/09, Artur): com tres por linha, o decimo card ficaria
   sozinho na quarta linha; ele sai no celular em qualquer grade de produtos. */
@media (max-width: 700px) {
  .grade > *:nth-child(10) { display: none !important; }
}

/* CABECALHO DO DESTAQUE (22/09, Artur): o bloco estava sem titulo porque o unico
   rotulo era um sobretitulo, que saiu com a regra dos eyebrows. */
.dest-br { padding-top: clamp(28px, 3vw, 44px); }
.dest-br .db-cab { padding-bottom: 18px; }
.dest-br .db-cab .tt { color: #fff !important; }
.dest-br .db-cab .sub { color: rgba(255,255,255,.75) !important; }
.dest-br .db-marca span { display: inline-block !important; color: #fff !important; font-size: 18px !important; }
.dest-br .db-marca { display: flex !important; align-items: center; gap: 12px; }
.dest-br .db-marca img { max-height: 40px !important; width: auto !important; }

@media (max-width: 700px) {
  .dest-br .db-cab { padding-bottom: 12px; }
  .dest-br .db-cab .tt { font-size: 21px !important; }
  .dest-br .db-foto { height: 220px !important; }
  .dest-br .db-marca span { font-size: 15px !important; }
  .dest-br .db-marca img { max-height: 30px !important; }
  .dest-br .db-num b, .dest-br .db-num strong { font-size: 18px !important; }
  .dest-br .db-num { gap: 18px !important; }
}

/* NOME DA MARCA NO DESTAQUE (22/09): o nome existia so para leitor de tela (1x1 e
   recortado); com o bloco tendo titulo proprio, ele passa a aparecer ao lado do logo. */
.dest-br .db-marca span {
  position: static !important;
  clip: auto !important;
  clip-path: none !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  white-space: normal !important;
}

/* SEM NUMERACAO NO COMECAR DO ZERO (22/09, Artur): os 01..05 saem no computador e no celular. */
.jn-c .jn-n { display: none !important; }

/* SEM ENCAIXE NO CARROSSEL (22/09): o scroll-snap puxava a faixa de volta a cada
   micro-movimento e impedia o carrossel de andar sozinho. */
.carr { scroll-snap-type: none !important; scroll-behavior: auto !important; }
.carr > * { scroll-snap-align: none !important; }

/* TITULOS EM CAIXA NORMAL (22/09, Artur): titulo comeca com maiuscula e segue em
   minuscula. Vale para titulos e nomes; rotulos, botoes e menu seguem em caixa-alta. */
h1, h2, h3, h4.tt,
.tt, .pg-h1, .nf-h1,
.card-leg .lg-t b,
.cat b,
.post h3, .edu-a h3, .art3 h3, .sec .dest h3,
.jn-bd h3, .jn-tv,
.ig-top h2,
.db-marca span, .db-foto figcaption,
.pc h3, .mk-h1, .pd-h1 {
  text-transform: none !important;
}

/* SEXTO CARD DE EDUCACAO (22/09, Artur): so no celular, para fechar as tres linhas de
   dois; no computador a grade e de cinco e ele sobraria sozinho. */
.edu .edu-todos { display: none; }
@media (max-width: 700px) {
  .edu .edu-todos {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    background: var(--pto) !important;
    color: #fff !important;
    padding: 16px !important;
    min-height: 0;
    text-decoration: none;
  }
  .edu .edu-todos h3 { color: #fff !important; font-size: 13px !important; margin: 0 !important; }
  .edu .edu-todos p { color: rgba(255,255,255,.7) !important; font-size: 11.5px !important; line-height: 1.4 !important; margin: 0 !important; }
  .edu .edu-todos em { font-style: normal; }
}

/* ESPACAMENTO DA HOME NA MESMA REGRA (22/09, Artur): as secoes da home usavam 76px
   (44 no celular) do tema e ficavam de fora do valor unico do site. Sem !important
   para nao anular os padding-top:0 escritos no proprio template. */
main section.sec,
main section.jornada,
main section.dest-br,
main section.ig { padding-block: var(--sc-bloco); }
main section.selos { padding-block: 0; }

/* TESTE CARD DE CATEGORIA LARGO (22/09, Artur): card mais baixo e largo, o nome
   manda e a foto vira fundo. Para voltar, apague este bloco. */
.carr .cat {
  width: 320px !important;
  flex: 0 0 320px !important;
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
}
.carr .cat img { filter: brightness(.62) !important; } /* 22/09: sem preto e branco — foto de planta colorida */
.carr .cat b {
  font-size: 34px !important;
  letter-spacing: -.01em !important;
  line-height: 1.1 !important;
  inset-inline-start: 20px !important;
  bottom: 16px !important;
}
@media (max-width: 700px) {
  .carr .cat { width: 240px !important; flex: 0 0 240px !important; }
  .carr .cat b { font-size: 24px !important; inset-inline-start: 14px !important; bottom: 12px !important; }
}

/* FOCO NOS ROSTOS (22/09, Artur): as tres imagens de retrato sao verticais e o corte
   16:9 pegava o peito; o ponto de foco sobe para o rosto aparecer. */
.carr .cat img[src*="tipo1"],
.carr .cat img[src*="tipo2"],
.carr .cat img[src*="tipo3"] { object-position: center 20% !important; }

/* TOPO DO BUD (22/09, Artur): o corte central cortava a ponta da flor. Nos cards de
   categoria e de produto o enquadramento sobe; os retratos mantem o foco no rosto. */
.carr .cat img { object-position: center 18% !important; }
.card .card-foto img { object-position: center 20% !important; }
.db-carr .card .card-foto img { object-position: center 18% !important; }
.carr .cat img[src*="tipo1"],
.carr .cat img[src*="tipo2"],
.carr .cat img[src*="tipo3"] { object-position: center 20% !important; }

/* TOPO DO BUD NO HERO (22/09, Artur): os banners da home cortavam a ponta da flor. */
.hero .slide img { object-position: center top !important; }
@media (max-width: 700px) { .hero .slide img { object-position: center top !important; } }

/* SEM LINHA NO COMECAR DO ZERO (22/09, Artur) */
.jornada .jn-h { border-top: 0 !important; padding-top: 0 !important; }

/* TEXTO NO TOPO DO CARD DE EDUCACAO (23/09, Artur): titulo e linha sobem para o alto;
   o icone sai do canto superior e vai para o rodape do card. */
.edu .edu-a { justify-content: flex-start !important; padding-top: 18px !important; }
.edu .edu-a h3 { font-size: 19px !important; line-height: 1.15 !important; margin-bottom: 6px !important; }
@media (max-width: 700px) { .edu .edu-a h3 { font-size: 15px !important; } }
.edu .edu-a .ic { top: auto !important; bottom: 15px !important; }

/* RETRATOS MAIS CLAROS (23/09, Artur): Indica, Sativa e Canabinoides usam retrato em
   preto e branco, ja escuro na origem; com o escurecimento padrao ficavam ilegiveis. */
.carr .cat img[src*="tipo1"],
.carr .cat img[src*="tipo3"] {
  filter: brightness(1.05) contrast(1.06) !important;
}
/* Indica (tipo2) e o mais escuro dos tres na origem */
.carr .cat img[src*="tipo2"] {
  filter: brightness(1.28) contrast(1.04) !important;
}

/* SEM NUMEROS NO BREEDER EM DESTAQUE (23/09, Artur): tira a linha de genéticas,
   em estoque e a partir de, nos dois formatos. */
.db-num { display: none !important; }

/* SEM CONTAGEM NOS MENUS (23/09, Artur): a casa nao expoe numero de itens; o menu
   mostra so o nome da categoria e da marca, no celular e no computador. */
.gav a em,
.gav li em,
.gav .gav-sub li em,
.gav .gav-nav a em,
.mega a em,
.mega li em,
.mega .blk li em,
.mega .mega-in > .mega-descobrir li em { display: none !important; }

/* VER TODOS UMA VEZ SO (23/09, Artur): no celular o bloco Educacao mostrava o link no
   cabecalho e o card "Todos os assuntos"; no celular fica so o card. */
@media (max-width: 700px) {
  .sec:has(.edu) .sec-h .verall { display: none !important; }
}

/* TEXTO SO PARA LEITOR DE TELA (24/09, Artur): produto com pack variavel imprimia
   "Faixa de preco: X atraves Y" na tela, junto do preco. O texto e do WooCommerce e
   deve ficar so para leitor de tela. Sem essa regra, aparece em card, ficha e busca. */
.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ===== SC 05/10/2026: Pix legivel e sacola no celular ===== */
/* Pix por Piggly: a folha do plugin pinta o texto de branco (era para fundo escuro). No tema novo o fundo e branco. */
#pix-por-piggly{color:var(--ink,#1A1813);max-width:460px;line-height:1.35}
#pix-por-piggly .pix-por-piggly-logo{color:var(--pto,#0A0908);fill:var(--pto,#0A0908)}
#pix-por-piggly p,#pix-por-piggly strong{color:var(--ink,#1A1813);line-height:1.5}
#pix-por-piggly .pix-por-piggly--label{color:var(--mute,rgba(26,24,19,.62));font-size:11px;letter-spacing:.08em;text-transform:uppercase}
#pix-por-piggly .pix-por-piggly--data,#pix-por-piggly .pix-por-piggly--data span{color:var(--pto,#0A0908)}
#pix-por-piggly .pix-por-piggly--data{background:var(--box,#F4F4F4);border-radius:0}
#pix-por-piggly .pix-por-piggly--copy,#pix-por-piggly .pix-por-piggly--button{background:var(--pto,#0A0908) !important;color:#fff !important;border:1px solid var(--pto,#0A0908);border-radius:0}
#pix-por-piggly .pix-por-piggly--button span,#pix-por-piggly .pix-por-piggly--button svg{color:inherit}
#pix-por-piggly .pix-por-piggly--copy:hover,#pix-por-piggly .pix-por-piggly--button:hover{background:#fff !important;color:var(--pto,#0A0908) !important}
#pix-por-piggly .pix-por-piggly--or span{background:#fff;color:var(--mute,rgba(26,24,19,.62));border:1px solid var(--line,rgba(26,24,19,.16))}
.sc-pix-aviso{max-width:460px;margin:18px auto 0;text-align:center;font-size:var(--t4,15px);line-height:1.5;color:var(--ink,#1A1813)}
.sc-pix-aviso strong{color:var(--pto,#0A0908)}
/* Sacola: os totais flutuavam para fora da area da pagina e caiam sobre o rodape preto no celular. */
.woocommerce-cart .woocommerce{display:flow-root}
@media(max-width:820px){.woocommerce-cart .cart-collaterals,.woocommerce-cart .cart-collaterals .cart_totals{float:none;width:100%}}

/* ===== SC 05/10/2026 (2): pagina do Pix redesenhada e checkout no computador ===== */
/* --- Pagina do Pix. No celular: copiar o codigo vem primeiro (ninguem escaneia a propria tela).
       No computador: QR Code a esquerda, copia e cola e comprovante a direita. --- */
.woocommerce:has(#pix-por-piggly) > ul.order_details{display:none}
.sc-pix-topo{max-width:880px;margin:0 auto 28px;text-align:center}
.sc-pix-tit{font-size:var(--t7,30px);font-weight:var(--w8,850);line-height:1.1;margin:0 0 12px;color:var(--pto,#0A0908)}
.sc-pix-valor{font-size:clamp(34px,5vw,48px);font-weight:var(--w8,850);line-height:1;margin:0 0 14px;color:var(--pto,#0A0908)}
.sc-pix-topo .sc-pix-aviso{max-width:none;margin:0 0 6px;font-size:var(--t4,15px)}
.sc-pix-ped{font-size:var(--t3,13.5px);color:var(--mute,rgba(26,24,19,.62));margin:0}
#pix-por-piggly{display:grid;grid-template-columns:minmax(0,1fr);gap:0;width:100%;max-width:440px;margin:0 auto;text-align:left;line-height:1.4}
#pix-por-piggly > .pix-por-piggly-logo,
#pix-por-piggly > .pix-por-piggly-title,
#pix-por-piggly > .pix-por-piggly--review,
#pix-por-piggly > .pix-por-piggly--row:not(.pix-por-piggly--review):not(.pix-por-piggly--qrcode):not(.pix-por-piggly--manual){display:none}
#pix-por-piggly > .pix-por-piggly--row{display:block;width:auto;margin:0;padding:22px 0;border-top:1px solid var(--line,rgba(26,24,19,.16));text-align:left}
#pix-por-piggly .pix-por-piggly--column,#pix-por-piggly .pix-por-piggly--item{display:block;width:auto;max-width:none;margin:0 !important;padding:0 !important;float:none}
#pix-por-piggly > .pix-por-piggly--row::before{display:block;font-size:var(--t5,17px);font-weight:var(--w7,700);color:var(--pto,#0A0908);margin:0 0 6px}
#pix-por-piggly > .pix-por-piggly--qrcode{order:2}
#pix-por-piggly > .pix-por-piggly--qrcode::before{content:"QR Code"}
#pix-por-piggly > .pix-por-piggly--qrcode ~ .pix-por-piggly--manual{order:1;border-top:0;padding-top:0}
#pix-por-piggly > .pix-por-piggly--qrcode ~ .pix-por-piggly--manual::before{content:"Pix copia e cola"}
/* os dois botoes de comprovante ficam num div sem classe, filho direto do bloco */
#pix-por-piggly > div:not([class]){order:3;display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:22px 0;border-top:1px solid var(--line,rgba(26,24,19,.16));text-align:left}
#pix-por-piggly > div:not([class])::before{content:"J\00E1  pagou? Envie o comprovante";flex:0 0 100%;font-size:var(--t5,17px);font-weight:var(--w7,700);color:var(--pto,#0A0908);margin:0 0 2px;text-align:left}
#pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual{order:4;border-top:1px solid var(--line,rgba(26,24,19,.16));padding-top:22px}
#pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual::before{content:"Ou digite a chave no seu banco";margin-bottom:12px}
#pix-por-piggly p{text-align:left;font-size:var(--t3,13.5px);color:var(--mute,rgba(26,24,19,.62));margin:0 0 12px}
#pix-por-piggly .pix-por-piggly--label{display:block;margin:0 0 6px}
#pix-por-piggly .pix-por-piggly--data{display:block;height:auto;max-width:none;padding:14px 16px;font-size:var(--t4,15px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pix-por-piggly .pix-por-piggly--data span{font-size:inherit}
#pix-por-piggly > .pix-por-piggly--qrcode ~ .pix-por-piggly--manual .pix-por-piggly--data{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px}
#pix-por-piggly .pix-por-piggly--copy{display:block;width:100%;min-height:52px;margin:10px 0 0;padding:0 16px;font-size:var(--t4,15px);font-weight:var(--w7,700);line-height:1.2;cursor:pointer}
#pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual .pix-por-piggly--item + .pix-por-piggly--item{margin-top:20px !important}
#pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual .pix-por-piggly--data + .pix-por-piggly--label{margin-top:12px}
#pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual .pix-por-piggly--copy,
#pix-por-piggly .pix-por-piggly--button{background:#fff !important;color:var(--pto,#0A0908) !important;border:1px solid var(--pto,#0A0908)}
#pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual .pix-por-piggly--copy{min-height:46px;font-size:var(--t3,13.5px)}
#pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual .pix-por-piggly--copy:hover,
#pix-por-piggly .pix-por-piggly--button:hover{background:var(--pto,#0A0908) !important;color:#fff !important}
#pix-por-piggly .pix-por-piggly--button{flex:1 1 auto;white-space:nowrap;border:1px solid var(--pto,#0A0908) !important;border-radius:0 !important;box-shadow:none !important;display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;margin:0;padding:0 14px;font-size:var(--t3,13.5px);font-weight:var(--w6,600);line-height:1.2;text-align:center;text-decoration:none}
#pix-por-piggly .pix-por-piggly--button svg{width:18px;height:18px;flex:none}
#pix-por-piggly .pix-por-piggly--button svg [id^="comp_"] *{fill:currentColor}
#pix-por-piggly .pix-por-piggly--qrcode img{display:block;width:100%;max-width:240px;height:auto;margin:4px auto 0}
@media(min-width:900px){
  #pix-por-piggly{max-width:880px;grid-template-columns:300px minmax(0,1fr);grid-template-rows:auto 1fr auto;column-gap:64px}
  #pix-por-piggly > .pix-por-piggly--qrcode{grid-column:1;grid-row:1 / span 2;border-top:0;padding-top:0}
  #pix-por-piggly > .pix-por-piggly--qrcode::before{content:"Aponte a c\00E2 mera do app do banco"}
  #pix-por-piggly .pix-por-piggly--qrcode img{max-width:300px;margin-left:0}
  #pix-por-piggly > .pix-por-piggly--qrcode ~ .pix-por-piggly--manual{grid-column:2;grid-row:1}
  #pix-por-piggly > .pix-por-piggly--qrcode ~ .pix-por-piggly--manual::before{content:"Ou copie o c\00F3 digo Pix"}
  #pix-por-piggly > div:not([class]){grid-column:2;grid-row:2;align-self:start;margin-top:22px}
  #pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual{grid-column:1 / -1;grid-row:3;margin-top:22px}
  #pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual::before{content:"Ou digite a chave no seu banco"}
  #pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual .pix-por-piggly--column{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;align-items:start}
  #pix-por-piggly > .pix-por-piggly--manual ~ .pix-por-piggly--manual .pix-por-piggly--item + .pix-por-piggly--item{margin-top:0 !important}
}
/* --- Checkout no computador: o formulario ocupava metade da tela. Duas colunas na largura da pagina,
       resumo do pedido fixo a direita enquanto o cliente preenche. --- */
@media(min-width:900px){
  body.woocommerce-checkout .woocommerce form.checkout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:clamp(32px,5vw,80px);align-items:start;max-width:1120px}
  body.woocommerce-checkout .woocommerce form.checkout > *{grid-column:1 / -1}
  body.woocommerce-checkout .woocommerce form.checkout > .woocommerce-NoticeGroup{grid-row:1}
  body.woocommerce-checkout .woocommerce form.checkout > .col2-set{grid-column:1;grid-row:2 / span 2;width:auto;float:none;padding-right:0}
  body.woocommerce-checkout .woocommerce form.checkout > #order_review_heading{grid-column:2;grid-row:2;width:auto;float:none}
  body.woocommerce-checkout .woocommerce form.checkout > #order_review{grid-column:2;grid-row:3;width:auto;float:none;position:sticky;top:calc(var(--hdr,67px) + 16px)}
}
/* ===== SC 05/10/2026 (3): aviso de produto adicionado, linha da ficha no iPhone, Pix sem newsletter ===== */
/* Aviso "foi adicionado": o botao era um link em linha, preto com texto escuro, e caia por cima do texto. */
.woocommerce-message p.with-button,.woocommerce-info p.with-button,.woocommerce-error p.with-button{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:0;width:100%}
.woocommerce-message .button.wc-forward,.woocommerce-info .button.wc-forward{display:inline-flex;align-items:center;justify-content:center;flex:none;float:none;min-height:40px;margin:0;padding:0 16px;background:var(--pto,#0A0908) !important;color:#fff !important;font-size:12px;font-weight:var(--w7,700);letter-spacing:.08em;line-height:1;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.woocommerce-message .button.wc-forward:hover,.woocommerce-info .button.wc-forward:hover{opacity:.85}
/* Ficha tecnica: no iPhone a linha de cima da tabela parava no fim da primeira coluna. A linha passa a ser das celulas da primeira linha. */
.pd-tab{border-top:0}
.pd-tab tbody tr:first-child > th,.pd-tab tbody tr:first-child > td{border-top:1px solid var(--pto,#1A1813)}
/* Pagina do Pix (pagar pedido e obrigado): sem o bloco "Cola na lista". */
body.woocommerce-order-pay #lista.news,body.woocommerce-order-received #lista.news{display:none}
/* ===== SC 05/10/2026 (4): sacola, oferta de Grove Bags (desenho v2) ===== */
/* Uma foto grande da embalagem; os tamanhos sao botoes compactos de adicionar. */
.sc-oferta{clear:both;display:grid;grid-template-columns:176px minmax(0,1fr);grid-template-areas:"foto cab" "foto ops" "foto todos";grid-template-rows:auto auto 1fr;column-gap:24px;row-gap:14px;margin:32px 0 8px;padding:20px;background:#f5f5f5}
.sc-oferta-foto{grid-area:foto;display:flex;align-items:center;justify-content:center;background:#fff;aspect-ratio:1 / 1;overflow:hidden}
/* a foto do produto tem muita margem branca: aproxima para a embalagem ocupar o quadro */
.sc-oferta-foto img{display:block;width:100%;height:100%;object-fit:contain;margin:0;padding:0;transform:scale(1.4);transform-origin:50% 52%}
.sc-oferta-cab{grid-area:cab;min-width:0}
.sc-oferta-olho{margin:2px 0 6px;font-size:11px;font-weight:var(--w7,700);letter-spacing:.14em;text-transform:uppercase;color:var(--mute,rgba(26,24,19,.62))}
.sc-oferta-tit{margin:0 0 6px;font-size:22px;font-weight:var(--w8,850);line-height:1.1;color:var(--pto,#0A0908)}
.sc-oferta-sub{margin:0;font-size:var(--t3,13.5px);line-height:1.4;color:var(--mute,rgba(26,24,19,.62))}
.sc-oferta-ops{grid-area:ops;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sc-oferta-ops li{margin:0;padding:0;list-style:none}
.sc-oferta-op{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:8px;align-items:center;min-height:56px;padding:9px 10px 9px 12px;box-sizing:border-box;background:#fff;border:1px solid var(--line,rgba(26,24,19,.16));color:var(--pto,#0A0908);text-decoration:none;transition:background .15s,border-color .15s,color .15s}
.sc-oferta-tam{grid-column:1;grid-row:1;font-size:15px;font-weight:var(--w7,700);line-height:1.2;white-space:nowrap}
.sc-oferta-preco{grid-column:1;grid-row:2;font-size:13px;line-height:1.2;color:var(--mute,rgba(26,24,19,.62));white-space:nowrap}
.sc-oferta-mais{grid-column:2;grid-row:1 / span 2;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--pto,#0A0908);color:#fff;font-size:18px;font-weight:400;line-height:1;padding-bottom:1px;box-sizing:border-box}
.sc-oferta-op:hover,.sc-oferta-op:focus-visible{background:var(--pto,#0A0908);border-color:var(--pto,#0A0908);color:#fff}
.sc-oferta-op:hover .sc-oferta-preco,.sc-oferta-op:focus-visible .sc-oferta-preco{color:rgba(255,255,255,.75)}
.sc-oferta-op:hover .sc-oferta-mais,.sc-oferta-op:focus-visible .sc-oferta-mais{background:#fff;color:var(--pto,#0A0908)}
.sc-oferta-todos{grid-area:todos;align-self:start;justify-self:start;font-size:12.5px;color:var(--pto,#0A0908);text-decoration:underline;text-underline-offset:3px}
@media(max-width:820px){
  .sc-oferta{grid-template-columns:104px minmax(0,1fr);grid-template-areas:"foto cab" "ops ops" "todos todos";grid-template-rows:auto auto auto;column-gap:16px;row-gap:14px;padding:16px;align-items:center}
  .sc-oferta-tit{font-size:19px}
  .sc-oferta-op{min-height:54px;padding:8px 8px 8px 10px}
  .sc-oferta-tam{font-size:14px}
  .sc-oferta-preco{font-size:12.5px}
  .sc-oferta-mais{width:24px;height:24px;font-size:16px}
}

/* ===== SC 06/10/2026 (5): sacola, botao "Atualizar sacola" na mesma linha do cupom ===== */
/* No computador o tema pai posiciona o botao com top:calc(50% + 38px) e translateY(-50%), contando com um espacamento
   que o site nao usa; ele descia e cruzava a linha de baixo. Agora fica na altura do cupom, encostado a direita. */
@media print, screen and (min-width:64em){
  body.woocommerce-cart .woocommerce .woocommerce-cart-form tr:not(.cart_item) td.actions button[name="update_cart"]{top:14px;right:0;margin-top:0;transform:none}
}

/* ===== SC 06/10/2026 (6): botao "Comprar" do card poe na sacola (estados do botao) ===== */
.hv-bt[data-id]{cursor:pointer}
.hv-bt.espera{opacity:.55;pointer-events:none}
.hv-bt.ok,.hv-bt.ok:hover{background:var(--ink);color:var(--cream)}

/* ===== SC 06/10/2026 (7): cards no celular (3 por linha): preco nao invade o card vizinho ===== */
@media (max-width:700px){
  .card-leg{flex-direction:column!important;align-items:flex-start!important;gap:3px!important}
  .card-leg .lg-t{min-width:0;max-width:100%}
  .card-leg .lg-t b{font-size:12px!important;line-height:1.25!important}
  .card-leg .lg-t small{font-size:10px!important}
  .card-leg .lg-p{white-space:normal!important;font-size:11.5px!important;line-height:1.3!important;padding-top:0!important}
  .card-leg .lg-p .woocommerce-Price-amount{white-space:nowrap}
}


/* SC 08/10/2026 21h (Artur): banners com proporcao fixa e versao propria para celular.
   Computador: arte 3000x1000 (3:1). Celular (ate 820px): arte 1080x1350 (4:5), via <picture>.
   O slide mostra a arte inteira, sem corte. Briefing: claude/Briefing_Fabio_Banners_Home_2026-10-07.md */
.hero .slide{height:auto!important;aspect-ratio:3/1}
.hero .slide{position:relative}
.hero .slide>picture,.hero .slide>.slide-lk,.hero .slide>.slide-lk>picture{display:block;position:absolute!important;inset:0;width:100%!important;height:100%!important}
.hero .slide img{width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:center center!important;display:block}
@media (max-width:820px){.hero .slide{aspect-ratio:4/5}}

/* SC 09/10/2026: selos mais compactos */
@media (max-width:1023px){.selo{padding:16px 18px}}