/* Fontes servidas pelo próprio site (11/11/2026), subconjuntos latin e latin-ext. Licenças em fonts/LICENCA.md. */
@font-face{font-family:'Alfa Slab One';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/alfa-slab-one-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Alfa Slab One';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/alfa-slab-one-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Archivo Black';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/archivo-black-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo Black';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/archivo-black-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-condensed-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/barlow-condensed-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/barlow-condensed-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/barlow-condensed-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/source-sans-3-latin-ext-400-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/source-sans-3-latin-400-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Identidade "Caderno de Garagem" (27/09/2026). Papel bege, tinta escura, vermelho de carimbo.
   Tema único e claro, sem par escuro seguindo o sistema. Origem: protótipo
   kaixeiro-caderno-de-garagem (ChatGPT), portado para o gerador; tokens em :root. */
:root{
  --paper:#f1e6cd;--sheet:#faf6eb;--ink:#20251e;--red:#962f22;--ochre:#c18a26;
  --forest:#234b39;--river:#186377;--rule:#b7aa8b;--muted:#656153;--track:#ded6c1;
  /* Exceção consciente (11/11/2026, DESIGN.md): amarelo do Mercado Livre, só atrás do logo deles. */
  --ml-amarelo:#ffe600;
  --display:'Alfa Slab One',Georgia,serif;--narrow:'Barlow Condensed',sans-serif;
  --body:'Source Sans 3',Arial,sans-serif;--wordmark:'Archivo Black',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.65 var(--body)}
a{color:inherit;text-underline-offset:4px}
a:hover{color:var(--red)}
img{display:block;max-width:100%}
button,input{font:inherit}
svg{width:28px;height:28px}
h1,h2,h3,p{margin-top:0}
h1,h2{font-family:var(--display);font-weight:400;line-height:1.15}
h3{line-height:1.3;font-size:1.45rem}
h1{font-size:clamp(2.5rem,4.4vw,4.7rem);letter-spacing:-.035em}
h2{font-size:clamp(1.75rem,2.6vw,2.55rem);letter-spacing:-.025em}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--river);outline-offset:5px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;top:-100px;left:20px;background:var(--sheet);padding:12px;z-index:10}
.skip:focus{top:8px}
.wrap{max-width:1320px;margin:auto;padding:0 48px}

/* ---------------------------------------------------------------- cabeçalho */
.topline{background:var(--ink);color:var(--paper);font:600 13px/1.4 var(--narrow);letter-spacing:.17em;text-transform:uppercase}
.topline .wrap{display:flex;justify-content:space-between;padding-top:9px;padding-bottom:9px}
.masthead{display:flex;justify-content:space-between;align-items:center;padding:27px 0 22px;gap:30px;border-bottom:3px solid var(--ink)}
.wordmark{font-family:var(--wordmark);text-decoration:none;font-size:36px;line-height:1;letter-spacing:-1.8px;display:flex;flex-direction:column;align-items:center}
.wordmark .linha{display:flex;align-items:center;gap:10px}
.wordmark img{width:30px;height:30px}
.wordmark small{display:block;font:700 14px/1.4 var(--narrow);letter-spacing:.35em;text-align:center;margin-top:9px}
.mast-note{max-width:170px;font:600 15px/1.4 var(--narrow);letter-spacing:.08em;text-transform:uppercase}
.stamp{border:2px solid var(--red);outline:1px solid var(--red);outline-offset:4px;color:var(--red);padding:6px 17px;transform:rotate(-5deg);font:700 21px/1.1 var(--narrow);text-transform:uppercase;text-align:center;letter-spacing:.05em}
.stamp span{display:block;font-size:12px;letter-spacing:.13em;border-bottom:1px solid;padding-bottom:3px;margin-bottom:4px}
.nav{display:flex;gap:36px;align-items:center;padding:15px 0;border-bottom:1px solid var(--ink);font:600 16px/1.4 var(--narrow);letter-spacing:.06em;text-transform:uppercase;flex-wrap:wrap}
.nav a{text-decoration:none;padding:5px 0}
.nav a[aria-current="page"]{color:var(--red);text-decoration:underline}
/* Botão da loja (11/11/2026): o item mais forte do menu, na ponta direita. Abre na mesma aba. Leva o
   logo oficial do Mercado Livre, que só lê certo sobre o amarelo deles (exceção registrada no
   DESIGN.md). No computador "Loja no" + logo; no celular "Loja" + símbolo do aperto de mãos. O nome
   inteiro fica no aria-label e as imagens têm alt vazio. Respiro do logo: 7 px, um quarto da altura. */
.nav a.nav-loja{margin-left:auto;display:inline-flex;align-items:center;gap:10px;background:var(--ml-amarelo);color:var(--ink);border:1px solid var(--ink);padding:7px 14px;font-weight:700;letter-spacing:.07em;white-space:nowrap}
.nav a.nav-loja:hover{color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.nav a.nav-loja:hover span{text-decoration:underline;text-underline-offset:4px}
.nav-loja img{height:28px;width:auto;flex:none}
.nav-loja .curto,.nav-loja .ml-simbolo{display:none}

/* Trilha das etapas, no topo de todo guia, com a etapa do produto acesa (spec, seção 6). */
.trilha-etapas{display:flex;flex-wrap:wrap;gap:6px 18px;padding:12px 0;border-bottom:1px solid var(--rule);font:600 14px/1.4 var(--narrow);letter-spacing:.06em;text-transform:uppercase}
.trilha-etapas a{text-decoration:none;color:var(--muted);display:inline-flex;gap:6px;align-items:baseline}
.trilha-etapas a b{font-family:var(--display);font-weight:400;font-size:15px;letter-spacing:0}
.trilha-etapas a.atual{color:var(--red)}
.trilha-etapas a.atual span{text-decoration:underline;text-underline-offset:4px}

.eyebrow,.etiqueta{font:700 14px/1.35 var(--narrow);letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:19px}
.read{font:700 15px/1.5 var(--narrow);letter-spacing:.06em;text-transform:uppercase}
.botao{display:inline-block;background:var(--red);color:var(--sheet);text-decoration:none;padding:14px 22px;font:700 16px/1.5 var(--narrow);letter-spacing:.03em;border:1px solid var(--red)}
.botao:hover{background:var(--ink);color:var(--sheet);border-color:var(--ink)}

/* ---------------------------------------------------------------- home */
/* Duas portas no topo da home (11/11/2026): comprar primeiro, aprender depois. */
.portas{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:30px 0 4px}
.porta{background:var(--sheet);border:1px solid var(--rule);border-top:4px solid var(--ink);padding:22px 26px 24px;display:flex;flex-direction:column;align-items:flex-start}
.porta-loja{border-top-color:var(--red);position:relative}
/* Logo do Mercado Livre na porta da loja: no canto, fora do fluxo, para as duas portas seguirem
   da mesma altura. */
.porta-marca{position:absolute;top:22px;right:26px;height:34px;width:auto}
.porta .etiqueta{margin-bottom:8px}
.porta h2{margin:0 0 8px}
.porta p{margin-bottom:18px;font-size:19px;line-height:1.5}
.porta .botao{margin-top:auto}
.botao.botao-linha{background:transparent;color:var(--ink);border-color:var(--ink)}
.botao.botao-linha:hover{background:var(--ink);color:var(--sheet)}
.home-intro{display:grid;grid-template-columns:1.06fr 1fr;gap:54px;padding:48px 0 46px;align-items:center}
.home-intro h1{font-size:clamp(2.7rem,4.7vw,4.7rem);max-width:660px;margin-bottom:25px}
.home-intro h1 em{font-style:normal;color:var(--red)}
.home-intro .lead{max-width:440px;font-size:20px;line-height:1.55}
.cover{margin:0;position:relative}
.cover img{width:100%;height:590px;object-fit:cover;object-position:center 55%;border:1px solid var(--ink)}
.cover figcaption{font:500 13px/1.5 var(--narrow);letter-spacing:.05em;padding-top:9px;display:flex;justify-content:space-between;gap:12px}
.cover .cover-label{position:absolute;left:-20px;top:22px;background:var(--paper);border:1px solid var(--ink);padding:10px 15px;font:600 14px/1.25 var(--narrow);letter-spacing:.07em;text-transform:uppercase}
.chapter{border-top:3px solid var(--ink);padding-top:15px;display:flex;gap:22px;align-items:baseline;justify-content:space-between;margin-bottom:28px}
.chapter h2{margin:0}
.chapter small{font:600 14px/1.4 var(--narrow);text-transform:uppercase;letter-spacing:.1em}
.guide-section{padding:34px 0 65px}
.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.resumo{border-bottom:1px solid var(--rule);padding-bottom:26px}
.resumo>a{display:block;background:var(--sheet);border:1px solid var(--rule);margin-bottom:22px}
.resumo img{width:100%;height:245px;object-fit:contain;mix-blend-mode:multiply;padding:18px}
.resumo .etiqueta{margin-bottom:10px}
.resumo h3{font-family:var(--display);font-size:24px;font-weight:400;margin-bottom:15px;letter-spacing:-.02em}
.resumo h3 a{text-decoration:none}
.resumo p{font-size:17px;line-height:1.55}
.journey-home{padding:42px 0 52px;border-top:1px solid var(--ink);display:grid;grid-template-columns:1fr 1.7fr;gap:48px}
.linhas-home{padding:0 0 42px;display:flex;flex-wrap:wrap;gap:10px 28px;align-items:baseline}
.linhas-home .eyebrow{margin:0}
/* Logo do fabricante: identifica a marca do produto, pequeno, sem virar selo. */
.marca-logo{margin:0 0 12px}
.marca-logo img{display:block;height:44px;width:auto}
.marca-logo.grande img{height:64px}
.linha-link{display:inline-flex;align-items:center;gap:12px}
.linha-link img{height:30px;width:auto}
/* Logo do fabricante dentro de cartão e capa: as regras de foto do contêiner (.resumo img: 245 px e
   padding 18; .cover img: 590 px) são mais fortes que .logo-cit e estouravam o logo (14/10/2026). */
.resumo img.logo-cit,.cover img.logo-cit{display:inline-block;height:1.05em;width:auto;max-height:none;aspect-ratio:auto;padding:0;border:0;object-fit:contain;mix-blend-mode:normal;vertical-align:-0.18em;margin-right:.3em}
/* Logo na citação do produto, na altura da letra. */
.logo-cit{display:inline-block;height:1.05em;width:auto;vertical-align:-0.18em;margin-right:.3em}
.irmao span .logo-cit{height:1em}
.journey-home h2{max-width:330px}
/* Carrossel de kits da home (14/10/2026): só o trilho rola; setas só com o carrossel.js. */
.kits-home{border-top:2px solid var(--ink);padding:34px 0 10px}
.kits-home-cab{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.kits-home-cab h2{margin:4px 0 6px}
.kits-home-nav{display:flex;gap:8px;align-items:center}
.kits-seta{width:38px;height:38px;border:1px solid var(--ink);background:var(--paper);color:var(--ink);font:600 22px/1 var(--narrow);cursor:pointer}
.kits-seta:focus-visible,.kit-cartao:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.kits-trilho{list-style:none;margin:0;padding:0 0 12px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,24%);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain}
.kits-trilho li{scroll-snap-align:start;min-width:0}
.kit-cartao{display:flex;flex-direction:column;gap:6px;height:100%;text-decoration:none;color:var(--ink);border:1px solid var(--rule);background:#fff;padding:12px}
.kit-cartao img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain}
.kit-cartao b{font:600 17px/1.3 var(--narrow)}
/* Foto do kit no post: o gerador põe width/height do WebP; sem height:auto a foto estica. */
.corpo img.kit-foto{display:block;width:100%;max-width:340px;height:auto;aspect-ratio:1/1;object-fit:contain;background:#fff;border:1px solid var(--rule);margin:8px 0 14px}
@media (max-width:760px){.kits-trilho{grid-auto-columns:72%}}
@media (max-width:760px){.kits-seta{display:none}}
@media (prefers-reduced-motion:reduce){.kits-trilho{scroll-behavior:auto}}
.jornada{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
.jornada a{display:flex;align-items:center;gap:12px;text-decoration:none;padding:13px 0;border-bottom:1px solid var(--rule);font:600 18px/1.4 var(--narrow)}
.jornada a b{color:var(--red);font-size:27px;min-width:30px}
.manifesto-home{padding:58px 0;display:grid;grid-template-columns:1fr 1.4fr;gap:70px;align-items:center}
.manifesto-home .stamp{width:max-content;margin:14px 0 25px}
.manifesto-home blockquote{font-family:var(--display);font-size:clamp(1.65rem,3vw,2.5rem);line-height:1.3;margin:0;max-width:680px;border-left:3px solid var(--red);padding-left:20px}
.manifesto-home p{margin-top:25px}

/* ---------------------------------------------------------------- rodapé */
.rodape{background:var(--forest);color:var(--sheet);padding:36px 0}
.rodape .wrap{display:flex;justify-content:space-between;align-items:flex-start;gap:34px}
.rodape .wordmark{font-size:26px;align-items:flex-start}
.rodape .wordmark img{width:24px;height:24px}
.rodape p{font-size:15px;line-height:1.5;max-width:450px;margin:0}
.rodape .foot-links{font:600 15px/1.7 var(--narrow);display:flex;flex-direction:column;gap:7px}

/* ---------------------------------------------------------------- guia */
.breadcrumb{padding:26px 0 10px;font:600 14px/1.5 var(--narrow);letter-spacing:.06em;text-transform:uppercase}
.article-shell{display:grid;grid-template-columns:minmax(0,1fr) 205px;gap:56px;padding:26px 0 65px}
.article-shell>article{min-width:0}
.rail{align-self:start;position:sticky;top:25px;font-size:14px;border-top:3px solid var(--ink);padding-top:18px}
.rail .eyebrow{font-size:13px}
.rail a{display:block;font:600 16px/1.3 var(--narrow);padding:10px 0;text-decoration:none;border-bottom:1px solid var(--rule)}
.cabecalho-guia{border-bottom:1px solid var(--rule);padding-bottom:20px;margin-bottom:30px}
.cabecalho-guia h1{font-size:clamp(2.3rem,4vw,3.8rem)}
.em-uma-frase{font-size:22px;line-height:1.45;max-width:760px}
.meta{font-size:14px;color:var(--muted);line-height:1.5}
.hero{display:flex;align-items:center;gap:30px;margin-bottom:28px}
.moldura{flex:0 0 auto}
.capa{width:180px;max-height:245px;object-fit:contain;mix-blend-mode:multiply}
.dose-box{flex:1 1 0%;border-top:4px solid var(--red);border-bottom:1px solid var(--rule);padding:18px 0;background:var(--sheet)}
.tit{font:700 16px/1.4 var(--narrow);text-transform:uppercase;letter-spacing:.1em;margin:0 20px 18px;color:var(--red)}
.receita{display:flex;align-items:center;justify-content:space-evenly;gap:10px;text-align:center;padding:0 15px}
.receita>div:not(.op){flex:1 1 0%}
.receita svg{display:block;width:36px;height:36px;margin:0 auto 10px}
.receita b,.receita small{display:block}
.receita b{font-size:20px}
.receita small{font-size:13px;line-height:1.35}
.receita .op{color:var(--red);font-size:25px}
.alt{font-size:14px;line-height:1.5;text-align:center;margin:14px 18px 0}
.medida{display:flex;align-items:center;justify-content:center;gap:14px;padding:0 20px}
.medida svg{flex:0 0 auto;width:36px;height:36px}
.medida b,.medida small{display:block}
.medida b{font-size:20px}
.medida small{font-size:14px;line-height:1.4;color:var(--muted)}
.painel{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--rule);margin:30px 0 0}
.painel li{padding:22px 18px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);display:flex;flex-direction:column;align-items:flex-start;gap:7px;font-size:16px;line-height:1.35}
.painel svg{color:var(--red)}
.painel small{font-size:14px;color:var(--muted)}
.painel-sem{font-size:15px;line-height:1.5;border:1px solid var(--rule);border-top:0;padding:12px 18px;margin:0 0 30px;background:var(--sheet)}
.painel-sem b{font-family:var(--narrow);text-transform:uppercase;letter-spacing:.06em;color:var(--red)}
.nivel{display:flex;gap:4px}
.nivel i{height:4px;width:14px;background:#c8c2af}
.nivel .on{background:var(--forest)}
.rapido{border-left:6px solid var(--forest);padding:25px 30px;background:var(--sheet);margin:35px 0}
.rapido h2{font-size:27px}
.rapido ol{padding-left:22px;margin-bottom:0}
.rapido li{padding:4px 0}
.sumario{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:20px 0;margin:30px 0}
.sumario ul{display:flex;gap:10px 24px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.sumario a{font:600 16px/1.5 var(--narrow);color:var(--red)}
/* No desktop o índice lateral (.rail) já faz esse papel; o sumário volta no celular. */
@media (min-width:761px){.article-shell .sumario{display:none}}
.corpo{font-size:19px;line-height:1.75}
.corpo h2{margin-top:45px;border-top:1px solid var(--rule);padding-top:24px;font-size:29px}
.corpo h3{font-family:var(--narrow);font-weight:700;text-transform:uppercase;letter-spacing:.025em;font-size:25px;margin:27px 0 12px}
.corpo p{margin-bottom:22px}
.cena{margin:32px 0}
/* height:auto: sem ele a altura vinha do atributo height da imagem e, no celular, a figura quadrada virava 350x620 cortada dos lados. */
.cena img{width:100%;height:auto;max-height:620px;object-fit:cover}
.cena figcaption{font-size:14px;line-height:1.5;border-bottom:1px solid var(--rule);padding:10px 0;color:var(--muted)}
.fonte{font:600 12px/1.4 var(--narrow);color:var(--red);white-space:normal;text-decoration:none;border-bottom:1px dotted var(--red);margin-left:3px}
.dois{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.sim,.nao{border-top:3px solid var(--forest);padding:10px 15px;background:var(--sheet)}
.nao{border-color:var(--red)}
.dois ul{padding-left:20px}
.passos{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 25px}
.passos li{border-top:1px solid var(--rule);padding:20px 0 20px 43px;display:block;position:relative;font-size:17px;line-height:1.5}
.passos li>svg{position:absolute;left:0;top:22px;color:var(--red);width:27px;height:27px}
.passos li>b{display:block;margin-bottom:7px}
.faixa-icones{display:flex;list-style:none;padding:22px 0;gap:20px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font-size:16px;line-height:1.4}
.faixa-icones li{flex:1 1 0%}
.faixa-icones svg{display:block;color:var(--red);margin-bottom:8px}
.faixa-icones b{display:block}
.escada{padding:25px 20px;background:var(--sheet);margin:25px 0;border:1px solid var(--rule)}
.escada h3{font-size:20px;margin-top:0}
.degraus{display:flex;gap:20px;align-items:end;justify-content:space-between}
.degrau{flex:1 1 0%;text-align:center;font-size:14px;line-height:1.4}
.degrau b,.degrau small{display:block}
.copo{height:90px;width:45px;border:2px solid var(--ink);position:relative;margin:10px auto;background:transparent}
.copo i{position:absolute;bottom:0;left:0;right:0;background:var(--red)}
.ml{font-weight:700}
.faixa{height:9px;margin-top:20px;background:linear-gradient(to right,var(--red),var(--ochre),var(--paper))}
.faixa-legenda{display:flex;justify-content:space-between;font:600 13px/1.4 var(--narrow);margin-top:7px}
.comece{font-weight:600;margin:15px 0 0}
.barras{list-style:none;padding:0;font-size:15px}
.barras li{margin:14px 0}
.barras .trilho{height:12px;background:var(--track);position:relative;margin-top:5px}
.barras .trilho i{display:block;position:absolute;height:100%;background:var(--forest)}
.barras-legenda{font:500 14px/1.5 var(--narrow);display:flex;justify-content:space-between}
/* position:relative: o rótulo oculto (.sr) da tag de fonte é absoluto; sem isto ele escapa da caixa rolável e alarga a página no celular. */
.tabela{overflow:auto;position:relative}
table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.45;margin:24px 0}
th,td{text-align:left;padding:12px;border-bottom:1px solid var(--rule);overflow-wrap:anywhere}
th{background:var(--ink);color:var(--paper);font-family:var(--narrow);font-size:18px}
details{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:14px 0;margin:12px 0}
summary{font-weight:600;cursor:pointer;list-style:none;padding-right:24px;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:0;color:var(--red)}
details[open]>summary::after{content:"\2212"}
details .miolo{padding:15px 0;font-size:17px}
blockquote{border-left:3px solid var(--red);padding-left:20px;margin-left:0}
.fontes{font-size:14px;line-height:1.5;padding:22px;background:var(--sheet);overflow-wrap:anywhere}
.fontes dt{font-weight:700;color:var(--red)}
.fontes dd{margin:0 0 14px}
.irmaos{border-top:3px solid var(--ink);margin-top:40px;padding-top:25px}
.irmaos h2{font-size:27px}
.irmao{display:flex;gap:15px;margin:18px 0;align-items:center;text-decoration:none}
.irmao img{width:65px;height:85px;object-fit:contain;mix-blend-mode:multiply}
.fecho{font-family:var(--display);font-size:25px;line-height:1.4;margin:38px 0}
.fecho-home{margin-top:25px}

/* ---------------------------------------------------------------- páginas */
.pagina{max-width:840px;padding:30px 0 60px}
.pagina-cabecalho{border-bottom:1px solid var(--rule);margin-bottom:24px}
.pagina-cabecalho h1{margin-bottom:18px;font-size:clamp(2.3rem,4vw,3.6rem)}
.pagina-cabecalho .lead{font-size:21px;line-height:1.5}
.pagina .corpo{max-width:800px}

/* ---------------------------------------------------------------- jornada */
.jor-hero{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:40px 0 30px}
.jor-hero img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--ink)}
.jor-hero h1{font-size:clamp(2.4rem,4.2vw,4.2rem);margin-bottom:18px}
.jor-hero p{font-size:20px;line-height:1.55;max-width:44ch}
.jor-barra{display:flex;gap:34px;flex-wrap:wrap;border-top:3px solid var(--ink);border-bottom:1px solid var(--rule);padding:16px 0;font:600 15px/1.4 var(--narrow);letter-spacing:.05em;text-transform:uppercase}
.jor-barra b{display:block;font-family:var(--display);font-weight:400;font-size:34px;color:var(--red);letter-spacing:0;text-transform:none}
.jor-corpo{max-width:860px;padding:26px 0 60px}
.jor-trilho{display:flex;gap:6px;margin:0 0 22px}
.jor-trilho i{height:6px;flex:1;background:var(--track)}
.jor-trilho i.on{background:var(--red)}
.jor-lead p{font-size:19px;max-width:62ch}
.jor-etapa{border-top:2px solid var(--ink);margin:34px 0 0;padding-top:22px;display:grid;grid-template-columns:260px 1fr;gap:10px 28px;scroll-margin-top:14px}
.jor-foto{position:relative;grid-row:span 3}
.jor-foto img,.jor-vazio{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--rule)}
.jor-vazio{display:grid;place-items:center;background:repeating-linear-gradient(135deg,var(--sheet) 0 14px,var(--paper) 14px 28px);color:var(--muted);font:600 13px/1.4 var(--narrow);letter-spacing:.1em;text-transform:uppercase}
.jor-num{position:absolute;left:-12px;top:-18px;font-family:var(--display);font-size:52px;line-height:1;color:var(--red);background:var(--paper);padding:0 8px}
.jor-cab{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.jor-cab h2{margin:0;font-size:30px}
.jor-chip{font:700 13px/1.4 var(--narrow);letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--red);color:var(--red);padding:2px 10px;white-space:nowrap;text-decoration:none}
.jor-chip.off{border-color:var(--rule);color:var(--muted)}
.jor-desc{margin:0;max-width:60ch}
.jor-guias{list-style:none;padding:0;margin:0}
.jor-guias li{border-left:3px solid var(--red);padding:2px 0 2px 12px;margin:8px 0;font-size:16px;max-width:62ch}
.jor-guias a{font-weight:600}
.jor-mecanismos,.jor-sem,.jor-faq{margin:56px 0 0;border-top:3px solid var(--ink);padding-top:20px}
.jor-mec-grade{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:18px 0 0}
.jor-mec-grade>.reveal{display:flex}
.jor-mec{flex:1;background:var(--sheet);border:1px solid var(--rule);padding:16px;height:100%}
.jor-mec svg{width:100%;height:96px;display:block}
.jor-mec h3{margin:12px 0 4px;font-family:var(--narrow);text-transform:uppercase;font-size:21px;letter-spacing:.03em}
.jor-mec p{font-size:16px;margin:8px 0 0}
.jor-sem p{max-width:62ch}
.jor-sem .faixa-icones{flex-wrap:wrap}

/* ---------------------------------------------------------------- responsivo */
@media (min-width:1600px){.home-intro h1{font-size:76px}}
@media (max-width:1000px){
  .wrap{padding:0 28px}
  .home-intro{gap:30px}
  .home-intro h1{font-size:clamp(2.65rem,5.6vw,4rem)}
  .cover img{height:550px}
  .guide-grid{gap:22px}
  .resumo h3{font-size:21px}
  .article-shell{grid-template-columns:minmax(0,1fr) 170px;gap:30px}
  .receita{gap:4px}
  .hero{gap:15px}
  .capa{width:130px}
  .mast-note{max-width:145px}
  .corpo{font-size:18px}
  .jor-mec-grade{grid-template-columns:1fr}
}
@media (max-width:760px){
  .wrap{padding:0 20px}
  .topline .wrap{font-size:12px;letter-spacing:.08em}
  .topline .wrap span:last-child{display:none}
  .masthead{padding:22px 0}
  .mast-note{display:none}
  .wordmark{font-size:29px}
  .wordmark small{font-size:12px}
  .stamp{font-size:17px;padding:5px 11px}
  .stamp span{font-size:12px}
  .nav{gap:12px 24px;font-size:15px;padding:10px 0}
  .nav a.nav-loja{gap:8px;padding:6px 10px}
  .nav-loja .longo,.nav-loja .ml-logo{display:none}
  .nav-loja .curto{display:inline}
  .nav-loja .ml-simbolo{display:block;height:24px}
  .porta-marca{top:14px;right:18px;height:24px}
  .portas{grid-template-columns:1fr;gap:12px;padding:16px 0 0}
  .porta{padding:14px 18px 16px}
  .porta .etiqueta{margin-bottom:4px}
  .porta h2{font-size:26px;margin-bottom:4px}
  .porta p{font-size:17px;margin-bottom:12px}
  .porta .botao{padding:10px 18px}
  .home-intro{grid-template-columns:1fr;padding:30px 0;gap:27px}
  .home-intro h1{font-size:clamp(2.5rem,8.5vw,3.8rem);max-width:620px}
  .home-intro .lead{font-size:19px}
  .cover img{height:auto;max-height:610px;aspect-ratio:4/4.6;object-position:center 55%}
  .cover .cover-label{left:10px;top:12px}
  .guide-section{padding:25px 0 40px}
  .chapter{gap:10px;flex-wrap:wrap}
  .chapter h2{font-size:29px}
  .guide-grid{grid-template-columns:1fr;gap:27px}
  .resumo{display:grid;grid-template-columns:120px minmax(0,1fr);gap:20px}
  .resumo img{height:185px;padding:10px}
  .resumo>a{margin:0;align-self:start}
  .resumo h3{font-size:21px;line-height:1.25}
  .resumo p{font-size:16px}
  .etiqueta{font-size:13px}
  .journey-home{grid-template-columns:1fr;gap:20px;padding:30px 0}
  .journey-home h2{max-width:100%;font-size:30px}
  .jornada{gap:0 15px}
  .jornada a{font-size:17px;align-items:flex-start}
  .jornada a b{font-size:24px}
  .manifesto-home{grid-template-columns:1fr;gap:25px;padding:35px 0}
  .manifesto-home blockquote{font-size:27px}
  .rodape .wrap{flex-direction:column;gap:22px}
  .article-shell{grid-template-columns:1fr;padding-top:16px}
  .rail{position:static;display:none}
  .cabecalho-guia h1,.pagina-cabecalho h1{font-size:clamp(2.2rem,7.5vw,3.5rem)}
  .em-uma-frase{font-size:20px}
  .hero{gap:18px;align-items:stretch}
  .capa{width:100px;align-self:center}
  .dose-box{min-width:0}
  .tit{font-size:14px;margin:0 12px 15px}
  .receita{flex-wrap:wrap;padding:0 10px}
  .receita b{font-size:18px}
  .receita small{font-size:12px}
  .receita svg{width:28px;height:28px}
  .receita .op{font-size:18px}
  .painel{grid-template-columns:repeat(2,minmax(0,1fr))}
  .painel li{padding:17px 14px;font-size:16px}
  .rapido{padding:20px}
  .corpo h2{font-size:27px}
  .dois{grid-template-columns:1fr}
  .passos{grid-template-columns:1fr}
  .faixa-icones{flex-wrap:wrap}
  .faixa-icones li{min-width:130px}
  .degraus{gap:10px;flex-wrap:wrap}
  .degrau{min-width:90px}
  .corpo{font-size:18px}
  .jor-hero{grid-template-columns:1fr;gap:22px;padding:24px 0}
  .jor-etapa{grid-template-columns:1fr}
  .jor-foto{grid-row:auto}
}
@media (max-width:390px){
  .wordmark{font-size:24px}
  .porta-marca{top:12px;height:22px}
  .stamp{font-size:15px}
  .hero{flex-direction:column}
  .capa{width:130px;max-height:180px}
  .home-intro h1{font-size:2.45rem}
  .resumo{grid-template-columns:95px minmax(0,1fr);gap:15px}
  .resumo img{height:160px}
  .resumo h3{font-size:19px}
  .jornada{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ---------------------------------------------------------------- faixa de cookies (11/11/2026)
   Fixa no pé da tela: não empurra a página e não cobre o cabeçalho. No celular ocupa a largura
   e fica baixa, para a porta "Ir para a loja" seguir à vista; no computador vira cartão de até
   560 px no canto inferior esquerdo. Aceitar e Recusar têm o mesmo tamanho. */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--sheet);color:var(--ink);border-top:4px solid var(--red);padding:12px 16px 14px;padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
.consent[hidden]{display:none}
.consent p{margin:0 0 10px;font-size:15px;line-height:1.45}
.consent p a{color:var(--red);font-weight:600;white-space:nowrap}
.consent-botoes{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.consent-botoes button{min-height:44px;padding:9px 14px;font:700 16px/1.2 var(--narrow);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--ink);cursor:pointer}
.consent-botoes button:focus-visible{outline-offset:3px}
.consent-botoes .consent-sim{background:var(--red);border-color:var(--red);color:var(--sheet)}
.consent-botoes .consent-sim:hover{background:var(--ink);border-color:var(--ink)}
.consent-botoes .consent-nao{background:var(--paper);color:var(--ink)}
.consent-botoes .consent-nao:hover{background:var(--ink);color:var(--sheet)}
.rodape .link-cookies{background:none;border:0;padding:0;margin:0;color:inherit;font:inherit;text-align:left;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.rodape .link-cookies:hover{color:var(--paper)}
@media (min-width:761px){
  .consent{left:24px;right:auto;bottom:24px;max-width:560px;border:1px solid var(--ink);border-top:4px solid var(--red);padding:18px 20px}
  .consent p{font-size:16px}
}

/* ---------------------------------------------------------------- artigos (11/11/2026)
   Forma própria, diferente do guia: coluna única de leitura, a resposta curta numa folha com régua
   verde logo abaixo do título, tabela de resumo antes do texto, perguntas de origem como citações. */
.artigo{max-width:820px;padding:20px 0 60px}
.cabecalho-artigo{border-bottom:1px solid var(--rule);padding-bottom:18px;margin-bottom:26px}
.cabecalho-artigo .etiqueta{margin-bottom:12px}
.cabecalho-artigo h1{font-size:clamp(2.1rem,3.6vw,3.4rem);margin-bottom:22px}
.resposta-curta{background:var(--sheet);border:1px solid var(--rule);border-left:6px solid var(--forest);padding:16px 22px 18px;margin:0 0 18px}
.resposta-curta .rotulo{font:700 14px/1.3 var(--narrow);letter-spacing:.14em;text-transform:uppercase;color:var(--forest);margin:0 0 6px}
.resposta-curta p:last-child{font-size:21px;line-height:1.5;margin:0}
.cabecalho-artigo .meta{margin:0}
.cabecalho-artigo .meta a{color:var(--red)}
.capa-artigo{margin:0 0 26px}
.resumo-tabela{margin:0 0 10px}
.resumo-tabela table{margin:0}
.tabela-resumo td:first-child{font-weight:700}
/* Sombra na borda que ainda tem coluna escondida: some quando a tabela chega ao fim. */
.tabela-resumo{background:linear-gradient(to right,var(--paper) 30%,transparent) left/24px 100% no-repeat local,linear-gradient(to left,var(--paper) 30%,transparent) right/24px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgba(32,37,30,.28),transparent) left/12px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(32,37,30,.28),transparent) right/12px 100% no-repeat scroll}
.tabela-dica{display:none;font:600 13px/1.4 var(--narrow);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:8px 0 0}
/* A tabela rola dentro do próprio container; abaixo de 560 px ela ganha largura mínima para as
   colunas não virarem uma palavra por linha, e o container é que rola, nunca a página. */
.tabela{-webkit-overflow-scrolling:touch}
.artigo .corpo h2:first-child{margin-top:20px}
.origem{border-top:3px solid var(--ink);margin-top:44px;padding-top:22px}
.origem h2,.citados h2,.fontes-artigo h2,.citam h2,.mais-links h2{font-size:27px;margin-bottom:10px}
.origem .nota{font-size:15px;color:var(--muted);margin-bottom:14px}
.origem ul{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.origem blockquote{margin:0;background:var(--sheet);border-left:3px solid var(--red);padding:10px 16px;font:600 19px/1.4 var(--narrow);letter-spacing:.01em}
.origem blockquote::before{content:"\201C"}
.origem blockquote::after{content:"\201D"}
.citados{border-top:3px solid var(--ink);margin-top:44px;padding-top:22px}
.citados .guide-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.fontes-artigo{border-top:1px solid var(--rule);margin-top:40px;padding-top:22px}
/* Cartão de artigo: listagem e home. Sem foto, com a régua vermelha no topo. */
.artigos-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.artigos-grade.lista{grid-template-columns:1fr;gap:0}
.artigo-cartao{border-top:3px solid var(--red);padding:16px 0 22px}
.artigos-grade.lista .artigo-cartao{border-top:1px solid var(--rule);padding:20px 0 24px}
.artigos-grade.lista .artigo-cartao:first-child{border-top:3px solid var(--red)}
.artigo-cartao .etiqueta{margin-bottom:8px}
.artigo-cartao h2,.artigo-cartao h3{font-family:var(--display);font-weight:400;font-size:24px;line-height:1.2;letter-spacing:-.02em;margin-bottom:10px}
.artigo-cartao h2{font-size:28px}
.artigo-cartao h2 a,.artigo-cartao h3 a{text-decoration:none}
.artigo-cartao p{font-size:17px;line-height:1.55;margin-bottom:10px}
.artigos-home{padding:10px 0 40px}
.artigos-home .chapter .read{white-space:nowrap}
/* Bloco "Artigos que citam este guia", no fim do guia. */
.citam,.mais-links{border-top:3px solid var(--ink);margin-top:40px;padding-top:25px}
.citam ul,.mais-links ul{list-style:none;padding:0;margin:0}
.citam li,.mais-links li{border-bottom:1px solid var(--rule);padding:12px 0;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline}
.citam a,.mais-links a{font-weight:600}
.mais-links .vizinhas{margin:16px 0 0;color:var(--muted)}
.mais-links .vizinhas a{font-weight:400}
.citam small,.mais-links small{font:700 13px/1.4 var(--narrow);letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
@media (max-width:760px){
  .artigo{padding-top:8px}
  .cabecalho-artigo h1{font-size:clamp(1.9rem,7vw,2.6rem);margin-bottom:16px}
  .resposta-curta{padding:12px 16px 14px}
  .resposta-curta p:last-child{font-size:19px}
  .tabela-resumo table{min-width:560px}
  .tabela-dica{display:block}
  .citados .guide-grid{grid-template-columns:1fr}
  .artigos-grade{grid-template-columns:1fr;gap:0}
  .artigo-cartao h2{font-size:24px}
  .artigo-cartao h3{font-size:22px}
}
/* Calculadora de diluição (12/11/2026): caixa de folha com régua de tinta, campos grandes para o dedo,
   resultado no mesmo desenho da "receita que funciona" dos guias. Sem cor nova: só os tokens. */
.pagina-calc{max-width:none}
.pagina-calc>.pagina-cabecalho{max-width:900px}
/* Calculadora à esquerda e lista de produtos à direita; no celular a lista desce para baixo da conta. */
/* Uma grade só: calculadora, tabela e texto na coluna da esquerda, a lista ao lado atravessando as três
   linhas. A lista vem logo depois da calculadora no HTML, que é a ordem do celular. */
.calc-layout{display:grid;grid-template-columns:minmax(0,900px) minmax(0,340px);column-gap:36px;align-items:start}
.calc-layout>*{grid-column:1;min-width:0}
.calc-layout>.calc-lista{grid-column:2;grid-row:1 / span 3}
.calc-lista{border-top:4px solid var(--ink);padding-top:16px}
.calc-lista h2{font:700 14px/1.35 var(--narrow);letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin:0 0 6px}
.calc-lista h3{font:700 15px/1.3 var(--narrow);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:16px 0 6px;padding-bottom:6px;border-bottom:1px solid var(--rule)}
.calc-lista ul{list-style:none;margin:0;padding:0}
.calc-lista a{display:flex;align-items:center;gap:12px;padding:8px 10px 8px 6px;text-decoration:none;border-left:4px solid transparent}
.calc-lista a:hover{background:var(--sheet);color:var(--ink)}
.calc-lista a[aria-current="true"]{background:var(--sheet);border-left-color:var(--red)}
.calc-lista img{flex:none;width:46px;height:56px;object-fit:contain;mix-blend-mode:multiply}
.calc-lista span{min-width:0;line-height:1.3}
.calc-lista b{display:block;font-size:17px}
.calc-lista small{display:block;font-size:14px;color:var(--muted)}
.calc{background:var(--sheet);border:1px solid var(--rule);border-top:4px solid var(--ink);padding:26px 26px 22px;margin:0 0 44px}
.calc-modos{display:flex;margin-bottom:22px;border:1px solid var(--ink)}
.calc-modos button{flex:1 1 0%;min-height:46px;background:transparent;border:0;color:var(--ink);font:700 16px/1.2 var(--narrow);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;padding:8px 10px}
.calc-modos button+button{border-left:1px solid var(--ink)}
.calc-modos button[aria-pressed="true"]{background:var(--ink);color:var(--sheet)}
.calc-form{display:grid;gap:20px;margin-bottom:24px}
.calc-campo{border:0;padding:0;margin:0;min-width:0}
.calc-campo[hidden]{display:none}
.calc-campo>label,.calc-campo>legend{display:block;font:700 14px/1.35 var(--narrow);letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:8px;padding:0}
.calc select,.calc input[type=number]{width:100%;min-height:48px;padding:8px 12px;border:1px solid var(--ink);border-radius:0;background:var(--paper);color:var(--ink);font:600 18px/1.3 var(--body)}
.calc input[type=number]{max-width:170px}
.calc select:focus-visible,.calc input:focus-visible{outline:3px solid var(--river);outline-offset:3px}
.calc-linha{display:flex;align-items:center;gap:12px}
.calc-usos{display:grid;gap:8px}
.calc-uso{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--rule);background:var(--paper);cursor:pointer;line-height:1.4}
.calc-uso:has(input:checked){border-color:var(--ink);box-shadow:inset 4px 0 0 var(--red)}
.calc-uso input{flex:none;width:18px;height:18px;margin:4px 0 0;accent-color:var(--red)}
.calc-uso b{font-family:var(--narrow);font-size:19px;letter-spacing:.03em;margin-right:4px}
.calc-recipientes{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.calc-recipientes button{min-height:44px;min-width:76px;padding:6px 14px;border:1px solid var(--ink);background:transparent;color:var(--ink);font:700 17px/1.2 var(--narrow);letter-spacing:.04em;cursor:pointer}
.calc-recipientes button[aria-pressed="true"]{background:var(--ink);color:var(--sheet)}
.calc-campo>label.calc-outro{font:400 15px/1.4 var(--body);letter-spacing:0;text-transform:none;color:var(--muted);margin-bottom:6px}
.calc-resultado{background:var(--paper);margin-bottom:22px}
.calc-resultado .receita b{font-family:var(--display);font-weight:400;font-size:clamp(24px,5vw,40px);line-height:1.1;margin-bottom:4px}
.calc-resultado .receita small{font-size:15px}
/* Foto do produto ao lado da conta: a mesma capa do guia, com o branco fundido no papel. */
.calc-conta{display:flex;align-items:center;gap:6px;padding:0 14px}
.calc-conta .receita{flex:1 1 0%;min-width:0;padding:0}
.calc-frasco{flex:none;display:flex;flex-direction:column;align-items:center;gap:6px;width:190px}
.calc-frasco[hidden]{display:none}
.calc-foto{width:100%;max-height:220px;object-fit:contain;mix-blend-mode:multiply}
.calc-logo{height:30px;width:auto;max-width:120px;object-fit:contain;mix-blend-mode:multiply}
.calc-logo[hidden]{display:none}
.calc-resultado .alt{font-size:15px}
.calc-resultado .alt a,.calc-link a{font-weight:700}
.calc-acoes{display:flex;flex-wrap:wrap;gap:10px}
.calc-acoes .botao{min-height:48px;text-align:center;cursor:pointer}
.calc-aviso{min-height:1.5em;margin:12px 0 0;font-size:15px;color:var(--muted)}
.calc-tabela{margin-bottom:44px}
.calc-tabela th[scope=rowgroup]{text-align:left;vertical-align:top}
.calc-tabela th small{display:block;font-weight:400;font-size:14px;color:var(--muted)}
.calc-tabela tr.grupo>*{border-top:2px solid var(--ink)}
@media (max-width:720px){
  .calc{padding:18px 14px}
  .calc-acoes .botao{flex:1 1 100%}
  .calc-conta{flex-direction:column;gap:10px;padding:0 6px}
  .calc-conta .receita{width:100%}
  .calc-frasco{width:150px}
  .calc-foto{max-height:170px}
  .calc-tabela table{min-width:520px}
  .calc-tabela .tabela-dica{display:block}
}
.calc-tabela tbody th{background:transparent;color:var(--ink);font-family:var(--body);font-size:16px}
@media (max-width:1180px){
  .calc-layout{grid-template-columns:minmax(0,1fr)}
  .calc-layout>.calc-lista{grid-column:1;grid-row:auto;margin-bottom:44px}
  .calc-lista{max-width:900px}
  .calc-lista ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0 16px}
}