@font-face{font-family:"Fraunces";src:url("../fontes/fraunces-latin-opsz-normal.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap;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:"Fraunces";src:url("../fontes/fraunces-latin-opsz-italic.woff2") format("woff2");font-style:italic;font-weight:100 900;font-display:swap;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:"Figtree";src:url("../fontes/figtree-latin-wght-normal.woff2") format("woff2");font-style:normal;font-weight:300 900;font-display:swap;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}
/* Marmelo da Quinta — folha de estilos única.
   As @font-face são acrescentadas pelo build (tools/build.py). */

:root {
  --papel: #FAF5E9;
  --superficie: #FFFDF7;
  --creme-2: #F2EAD6;
  --texto: #302D22;
  --texto-2: #5A5444;
  --verde: #3F532F;
  --verde-escuro: #2C3A21;
  --amarelo: #D3AE42;
  --ambar: #9D522F;
  --linha: #DED5C1;
  --linha-escura: #8C826D;
  --claro-1: #FFFDF7;
  --claro-2: #E7DFC9;

  --serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --sans: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --max: 75rem;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --sombra: 0 1px 0 rgba(48, 45, 34, .05), 0 18px 40px -24px rgba(48, 45, 34, .45);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 5.5rem;
}
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  margin: 0;
  min-width: 20rem;
  background-color: var(--papel);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .19 0 0 0 0 .17 0 0 0 0 .13 0 0 0 .055 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  color: var(--texto);
  font-family: var(--sans);
  font-size: 1.0625rem;
  line-height: 1.6;
  overflow-x: clip;
}

img { display: block; max-width: 100%; height: auto; }
figure { margin: 0; }
button, input, textarea { font: inherit; }

h1, h2, h3 {
  font-family: var(--serif);
  font-weight: 420;
  line-height: 1.08;
  letter-spacing: -.015em;
  margin: 0 0 .5em;
  text-wrap: balance;
}
h1 { font-size: clamp(2.4rem, 1.5rem + 3.6vw, 4.25rem); }
h2 { font-size: clamp(1.85rem, 1.35rem + 1.9vw, 2.85rem); }
h3 { font-size: 1.35rem; font-weight: 500; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

a { color: var(--verde); text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { text-decoration-color: var(--amarelo); text-decoration-thickness: 2px; }

:focus-visible { outline: 3px solid var(--ambar); outline-offset: 3px; }
:focus:not(:focus-visible) { outline: none; }
main:focus { outline: none; }

.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

.saltar {
  position: absolute; left: 1rem; top: -4rem; z-index: 100;
  background: var(--verde); color: var(--claro-1);
  padding: .75rem 1.25rem; border-radius: 999px; font-weight: 600;
}
.saltar:focus { top: 1rem; }

.contentor { width: min(var(--max), 100% - 2 * var(--gutter)); margin-inline: auto; }

.aviso-demo {
  margin: 0;
  padding: .4rem var(--gutter);
  background: var(--verde-escuro);
  color: var(--claro-2);
  font-size: .8rem;
  letter-spacing: .02em;
  text-align: center;
}

/* ------------------------------------------------------------ texto */

.sobretitulo {
  font: 600 .78rem/1.3 var(--sans);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ambar);
  margin-bottom: 1rem;
}
.sobretitulo--claro { color: var(--amarelo); }
.nota-pequena { font-size: .86rem; color: var(--texto-2); margin-top: 1.25rem; }
.titulo-pequeno { font-size: clamp(1.4rem, 1.2rem + .8vw, 1.75rem); margin-bottom: 1.25rem; }

.ornamento {
  display: block;
  width: 7.5rem; height: auto;
  margin: 0 auto 1.5rem;
  fill: none; stroke: var(--verde); stroke-width: 1.3;
  stroke-linecap: round; stroke-linejoin: round;
  opacity: .75;
}

/* ------------------------------------------------------------ botões */

.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  min-height: 3rem;
  padding: .8rem 1.5rem;
  border: 1.5px solid transparent;
  border-radius: 999px;
  font: 600 1rem/1.2 var(--sans);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .2s, color .2s, border-color .2s, transform .15s;
}
.botao:hover { text-decoration: none; }
.botao:active { transform: translateY(1px); }
.botao:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.botao--primario { background: var(--verde); color: var(--claro-1); }
.botao--primario:hover:not(:disabled) { background: var(--verde-escuro); }
.botao--secundario { background: transparent; color: var(--verde); border-color: var(--verde); }
.botao--secundario:hover:not(:disabled) { background: var(--verde); color: var(--claro-1); }
.botao--compacto { min-height: 2.75rem; padding: .55rem 1.1rem; font-size: .95rem; }
.botao--largo { width: 100%; }
.botao--feito { animation: feito .7s ease-out; }
@keyframes feito {
  from { box-shadow: 0 0 0 0 rgba(63, 83, 47, .45); }
  to { box-shadow: 0 0 0 14px rgba(63, 83, 47, 0); }
}

.botao-texto {
  min-height: 2.75rem;
  padding: .5rem .25rem;
  background: none; border: 0;
  font: 600 .92rem var(--sans);
  color: var(--ambar);
  text-decoration: underline; text-underline-offset: .2em;
  cursor: pointer;
}

.contagem {
  display: inline-grid; place-items: center;
  min-width: 1.5rem; height: 1.5rem;
  padding: 0 .4rem;
  border-radius: 999px;
  background: var(--amarelo); color: var(--texto);
  font-size: .8rem; font-weight: 700; line-height: 1;
}

.acoes { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; }
.acoes--centro { justify-content: center; }

.ligacao-seta {
  display: inline-flex; align-items: center; gap: .4em;
  padding-block: .5rem;
  font-weight: 600;
  color: var(--verde);
  text-decoration: none;
}
.ligacao-seta:hover { text-decoration: underline; }
.ligacao-seta--clara { color: var(--amarelo); }
.seta { display: inline-block; margin-left: .3em; transition: transform .2s; }
a:hover > .seta { transform: translateX(3px); }

/* ------------------------------------------------------------ cabeçalho */

.cabecalho {
  position: sticky; top: 0; z-index: 40;
  background: rgba(250, 245, 233, .95);
  border-bottom: 1px solid var(--linha);
}
@supports (backdrop-filter: blur(8px)) {
  .cabecalho { background: rgba(250, 245, 233, .86); backdrop-filter: blur(10px); }
}
.cabecalho__barra {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: .5rem 1.25rem;
  min-height: 4.25rem;
  padding-block: .5rem;
}
.marca {
  display: inline-flex; align-items: center; gap: .7rem;
  color: var(--texto); text-decoration: none;
  min-height: 2.75rem;
}
.marca__logo {
  width: 2.75rem; height: 2.75rem;
  background: #fff;
  border: 1px solid var(--linha);
}
.marca__nome { font: 450 1.2rem/1.1 var(--serif); letter-spacing: -.01em; white-space: nowrap; }

.navegacao { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 2rem; }
.navegacao__lista {
  display: flex; flex-wrap: wrap; gap: .25rem 1.5rem;
  list-style: none; margin: 0; padding: 0;
}
.navegacao__lista a {
  display: inline-block;
  padding: .55rem 0;
  color: var(--texto);
  font-weight: 500; font-size: .97rem;
  text-decoration: none;
  border-bottom: 2px solid transparent;
}
.navegacao__lista a:hover { border-bottom-color: var(--amarelo); }
.navegacao__lista a[aria-current="page"] { border-bottom-color: var(--verde); }

.menu-botao {
  display: inline-flex; align-items: center; gap: .55rem;
  min-height: 2.75rem;
  padding: .5rem 1rem;
  border: 1.5px solid var(--linha-escura); border-radius: 999px;
  background: var(--superficie); color: var(--texto);
  font-weight: 600; font-size: .95rem;
  cursor: pointer;
}
.menu-botao__icone { position: relative; width: 1.1rem; height: .75rem; }
.menu-botao__icone::before, .menu-botao__icone::after, .menu-botao__icone span {
  content: ""; position: absolute; left: 0; right: 0; height: 2px;
  background: currentColor; border-radius: 2px;
  transition: transform .2s, opacity .2s;
}
.menu-botao__icone::before { top: 0; }
.menu-botao__icone span { top: calc(50% - 1px); }
.menu-botao__icone::after { bottom: 0; }
.menu-botao[aria-expanded="true"] .menu-botao__icone::before { transform: translateY(5px) rotate(45deg); }
.menu-botao[aria-expanded="true"] .menu-botao__icone::after { transform: translateY(-5px) rotate(-45deg); }
.menu-botao[aria-expanded="true"] .menu-botao__icone span { opacity: 0; }

@media (max-width: 59.99em) {
  .navegacao { width: 100%; }
  .js .navegacao {
    display: none;
    position: absolute; left: 0; right: 0; top: 100%;
    flex-direction: column; align-items: stretch;
    max-height: calc(100vh - 6rem);
    overflow-y: auto;
    padding: .5rem var(--gutter) 1.5rem;
    background: var(--superficie);
    border-bottom: 1px solid var(--linha);
    box-shadow: 0 24px 40px -24px rgba(48, 45, 34, .5);
  }
  .js .cabecalho--aberto .navegacao { display: flex; }
  .js .navegacao__lista { flex-direction: column; gap: 0; }
  .js .navegacao__lista a {
    display: block;
    padding: .85rem 0;
    font: 420 1.5rem/1.2 var(--serif);
    border-bottom: 1px solid var(--linha);
  }
  .js .navegacao__lista a[aria-current="page"] { color: var(--verde); border-bottom-color: var(--linha); }
  .js .navegacao__lista a[aria-current="page"]::after { content: " ·"; color: var(--amarelo); }
  .js .navegacao__cta { margin-top: 1.25rem; width: 100%; min-height: 3rem; }
  .cabecalho__barra { min-height: 3.75rem; }
}
@media (min-width: 60em) {
  .menu-botao { display: none !important; }
  .cabecalho__barra { flex-wrap: nowrap; }
}

/* ------------------------------------------------------------ secções */

.seccao { padding-block: clamp(3.5rem, 7vw, 6.5rem); }
.seccao--compacta { padding-block: clamp(2rem, 4vw, 3.5rem); }
.cabeca-seccao { max-width: 40rem; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.cabeca-seccao > p:not(.sobretitulo) { color: var(--texto-2); font-size: 1.08rem; }

/* hero */
.hero { padding-block: clamp(2rem, 5vw, 4.5rem) clamp(3rem, 7vw, 6rem); }
.hero__grelha { display: grid; gap: clamp(2.5rem, 5vw, 4.5rem); align-items: center; }
.hero h1 {
  font-size: clamp(2.55rem, 1.35rem + 4.6vw, 5rem);
  font-weight: 380;
  line-height: 1.02;
  letter-spacing: -.028em;
}
.hero h1 em { font-style: italic; font-weight: 380; color: var(--ambar); }
.hero__apoio { font-size: clamp(1.08rem, 1rem + .35vw, 1.25rem); color: var(--texto-2); max-width: 33rem; }
.hero__nota {
  max-width: 31rem;
  margin-top: 1.5rem;
  padding-left: 1rem;
  border-left: 2px solid var(--amarelo);
  font-size: .92rem;
  color: var(--texto-2);
}
@media (min-width: 60em) {
  .hero__grelha { grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); }
}

.colagem {
  position: relative;
  justify-self: center;
  width: 100%; max-width: 36rem;
  padding: 0 1.25rem 3rem 0;
}
.colagem__principal {
  aspect-ratio: 16 / 9;
  padding: .55rem;
  background: var(--superficie);
  box-shadow: var(--sombra);
  transform: rotate(-1.2deg);
}
.colagem__principal img { width: 100%; height: 100%; object-fit: cover; }
.colagem__detalhe {
  position: absolute; right: 0; bottom: 0;
  width: 36%; max-width: 12.5rem;
  aspect-ratio: 3 / 4;
  padding: .4rem;
  background: var(--superficie);
  box-shadow: var(--sombra);
  transform: rotate(2.4deg);
}
.colagem__detalhe img { width: 100%; height: 100%; object-fit: cover; }
.colagem__legenda {
  max-width: 58%;
  margin-top: 1.4rem;
  font-size: .8rem; line-height: 1.4;
  color: var(--texto-2);
}

/* prateleira (início) */
.prateleira { display: grid; gap: clamp(2.75rem, 6vw, 3.5rem); }
.produto { display: grid; gap: 1.25rem; align-content: start; }
.produto__imagem {
  display: block;
  aspect-ratio: 1;
  max-width: 30rem;
  overflow: hidden;
  background: var(--creme-2);
}
.produto__imagem img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.produto:hover .produto__imagem img { transform: scale(1.03); }
.produto__numero { font: 600 .8rem/1 var(--sans); letter-spacing: .14em; color: var(--ambar); margin-bottom: .65rem; }
.produto__nome { font-size: clamp(1.65rem, 1.35rem + 1vw, 2.15rem); margin-bottom: .3rem; }
.produto__nome a { color: inherit; text-decoration: none; }
.produto__nome a:hover { text-decoration: underline; text-decoration-color: var(--amarelo); }
.produto__formatos { font-weight: 600; color: var(--verde); margin-bottom: .6rem; font-variant-numeric: tabular-nums; }
.produto__formatos--grande { font-size: 1.15rem; }
.produto__resumo { color: var(--texto-2); }
@media (min-width: 37.5em) and (max-width: 59.99em) {
  .produto { grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); gap: 1.75rem; align-items: center; }
}
@media (min-width: 60em) {
  .prateleira { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 3rem); }
}

/* adicionar */
.adicionar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .9rem 1rem; margin: 1.1rem 0 .6rem; }
.opcoes { display: flex; flex-wrap: wrap; flex: 1 1 100%; gap: .5rem; min-width: 0; margin: 0; padding: 0; border: 0; }
.opcoes__legenda { float: left; width: 100%; margin-bottom: .4rem; padding: 0; font-size: .82rem; font-weight: 600; color: var(--texto-2); }
.opcao { position: relative; display: inline-flex; }
.opcao input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.opcao span {
  display: inline-flex; align-items: center;
  min-height: 2.75rem; padding: .45rem 1.05rem;
  border: 1.5px solid var(--linha-escura); border-radius: 999px;
  background: var(--superficie);
  font-weight: 600; font-size: .95rem;
  font-variant-numeric: tabular-nums;
  transition: background-color .2s, color .2s, border-color .2s;
}
.opcao input:checked + span { background: var(--verde); border-color: var(--verde); color: var(--claro-1); }
.opcao input:focus-visible + span { outline: 3px solid var(--ambar); outline-offset: 2px; }
.opcao:hover input:not(:checked) + span { border-color: var(--verde); }

.estado-produto { margin: 0 0 .5rem; font-size: .92rem; color: var(--verde); }
.estado-produto__marca { font-weight: 700; }

.quantidade { display: grid; gap: .4rem; }
.quantidade__rotulo { font-size: .82rem; font-weight: 600; color: var(--texto-2); }
.passo {
  display: inline-flex; align-items: center;
  border: 1.5px solid var(--linha-escura); border-radius: 999px;
  background: var(--superficie);
  overflow: hidden;
}
.passo__botao {
  width: 2.75rem; height: 2.75rem;
  border: 0; background: transparent;
  color: var(--verde); font-size: 1.3rem; line-height: 1;
  cursor: pointer;
}
.passo__botao:hover:not(:disabled) { background: var(--creme-2); }
.passo__botao:disabled { opacity: .35; cursor: not-allowed; }
.passo__botao:focus-visible { outline-offset: -3px; }
.passo__valor {
  width: 2.75rem; height: 2.75rem;
  border: 0; background: transparent;
  color: var(--texto);
  font-weight: 700; text-align: center;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
  appearance: textfield;
}
.passo__valor::-webkit-inner-spin-button, .passo__valor::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.passo__valor:focus-visible { outline-offset: -3px; }

.nota-sem-js {
  margin-bottom: 2rem;
  padding: 1rem 1.25rem;
  background: var(--superficie);
  border-left: 3px solid var(--amarelo);
}

/* processo (faixa escura) */
.processo {
  padding-block: clamp(3.5rem, 8vw, 7rem);
  background: var(--verde-escuro);
  color: var(--claro-2);
}
.processo h2 { color: var(--claro-1); }
.processo :focus-visible { outline-color: var(--amarelo); }
.processo__grelha { display: grid; gap: clamp(2.5rem, 6vw, 5rem); align-items: center; }
.processo__imagens { position: relative; width: 100%; max-width: 33rem; padding: 0 2rem 4.5rem 0; }
.processo__principal { aspect-ratio: 1; max-width: 28rem; }
.processo__principal img { width: 100%; height: 100%; object-fit: cover; }
.processo__detalhe {
  position: absolute; right: 0; bottom: 0;
  width: 40%; max-width: 12rem;
  aspect-ratio: 3 / 4;
  border: .45rem solid var(--verde-escuro);
}
.processo__detalhe img { width: 100%; height: 100%; object-fit: cover; }
.processo__texto > p { max-width: 34rem; font-size: 1.08rem; }
.etapas { display: grid; gap: 1.1rem; margin: 1.75rem 0; padding: 0; list-style: none; counter-reset: etapa; }
.etapas li { position: relative; padding-left: 2.75rem; counter-increment: etapa; max-width: 34rem; }
.etapas li::before {
  content: counter(etapa, decimal-leading-zero);
  position: absolute; left: 0; top: .05rem;
  font: italic 400 1.15rem/1.3 var(--serif);
  color: var(--amarelo);
}
.etapas strong { color: var(--claro-1); font-weight: 600; }
@media (min-width: 60em) {
  .processo__grelha { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

/* passos do pedido */
.passos { display: grid; gap: 2rem; margin: 0; padding: 0; list-style: none; }
.passo-item { padding-top: 1.25rem; border-top: 1px solid var(--texto); }
.passo-item__n { display: block; margin-bottom: .75rem; font: italic 380 3.2rem/1 var(--serif); color: var(--ambar); }
.passo-item h3 { margin-bottom: .4rem; }
.passo-item p { color: var(--texto-2); }
@media (min-width: 48em) {
  .passos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 3rem); }
}

/* à mesa */
.seccao--mesa { background: var(--creme-2); }
.mesa { display: grid; gap: 2rem; }
.mesa__lista { display: grid; margin: 0; padding: 0; list-style: none; }
.mesa__lista li { display: grid; gap: .3rem; padding: 1.4rem 0; border-top: 1px solid var(--linha-escura); }
.mesa__lista li:last-child { border-bottom: 1px solid var(--linha-escura); }
.mesa__lista h3 { margin: 0; font-size: 1.3rem; }
.mesa__lista p { color: var(--texto-2); }
@media (min-width: 37.5em) {
  .mesa__lista li { grid-template-columns: 15rem minmax(0, 1fr); gap: 1.5rem; align-items: baseline; }
}
@media (min-width: 60em) {
  .mesa { grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 4rem; align-items: start; }
}

/* entregas */
.entregas { display: grid; gap: 1.25rem; }
.entregas__texto p { font-size: 1.1rem; color: var(--texto-2); max-width: 38rem; }
.entregas__texto p:first-child { color: var(--texto); }
@media (min-width: 60em) {
  .entregas { grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 4rem; }
}

/* perguntas */
.seccao--perguntas { border-top: 1px solid var(--linha); }
.perguntas { display: grid; gap: 2rem; }
.perguntas__cabeca > p:not(.sobretitulo) { color: var(--texto-2); }
.pergunta { border-bottom: 1px solid var(--linha-escura); }
.pergunta:first-child { border-top: 1px solid var(--linha-escura); }
.pergunta summary {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1.1rem 0;
  font: 450 1.18rem/1.35 var(--serif);
  list-style: none;
  cursor: pointer;
}
.pergunta summary::-webkit-details-marker { display: none; }
.pergunta summary::after {
  content: "+";
  flex: none;
  font: 400 1.6rem/1 var(--sans);
  color: var(--ambar);
  transition: transform .2s;
}
.pergunta[open] summary::after { transform: rotate(45deg); }
.pergunta summary:hover { color: var(--verde); }
.pergunta__resposta p { max-width: 42rem; padding-bottom: 1.25rem; color: var(--texto-2); }
@media (min-width: 60em) {
  .perguntas { grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 4rem; }
}

/* fecho */
.fecho {
  padding-block: clamp(4rem, 9vw, 7.5rem);
  background: var(--superficie);
  border-top: 1px solid var(--linha);
  text-align: center;
}
.fecho h2 { max-width: 22ch; margin-inline: auto; font-size: clamp(1.9rem, 1.3rem + 2.4vw, 3.2rem); }

/* rodapé */
.rodape {
  padding-block: 3.5rem 2.5rem;
  background: var(--verde-escuro);
  color: var(--claro-2);
  font-size: .95rem;
}
.rodape a { color: var(--claro-1); }
.rodape :focus-visible { outline-color: var(--amarelo); }
.rodape__grelha { display: grid; gap: 2.5rem; }
.rodape__nome { margin-bottom: .5rem; font: 420 1.6rem/1.2 var(--serif); color: var(--claro-1); }
.ligacao-forte { font-weight: 600; }
.rodape__nav ul { display: grid; gap: .1rem; margin: 0; padding: 0; list-style: none; }
.rodape__nav a { display: inline-block; padding-block: .3rem; text-decoration: none; }
.rodape__nav a:hover { text-decoration: underline; }
.rodape__demo { font-size: .88rem; }
.credito { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(255, 253, 247, .2); }
.credito a { font-weight: 600; }
@media (min-width: 48em) {
  .rodape__grelha { grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr) minmax(0, 1.2fr); }
}

/* barra móvel da lista */
.barra-lista {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  padding: .65rem var(--gutter) calc(.65rem + env(safe-area-inset-bottom));
  background: rgba(255, 253, 247, .97);
  border-top: 1px solid var(--linha);
  box-shadow: 0 -10px 28px -18px rgba(48, 45, 34, .45);
  animation: subir .35s ease-out;
}
.barra-lista__texto { margin: 0; font-weight: 600; font-size: .92rem; line-height: 1.25; }
@keyframes subir { from { transform: translateY(100%); } to { transform: none; } }
.menu-aberto .barra-lista { display: none; }
@media (max-width: 59.99em) {
  body.com-barra { padding-bottom: calc(4.25rem + env(safe-area-inset-bottom)); }
}
@media (min-width: 60em) {
  .barra-lista { display: none !important; }
}

/* ------------------------------------------------------------ páginas internas */

.pagina-topo {
  padding-block: clamp(1.25rem, 3vw, 2rem) clamp(2rem, 5vw, 3.5rem);
  border-bottom: 1px solid var(--linha);
}
.pagina-topo h1 { font-size: clamp(2.5rem, 1.6rem + 3.4vw, 4.25rem); font-weight: 380; }
.pagina-topo__intro { max-width: 40rem; font-size: clamp(1.05rem, 1rem + .3vw, 1.2rem); color: var(--texto-2); }
.pagina-topo--404 { padding-block: clamp(3rem, 9vw, 7rem); border-bottom: 0; }
.pagina-topo--404 .ornamento { margin-left: 0; }

.migalhas ol {
  display: flex; flex-wrap: wrap; gap: .25rem .5rem;
  margin: 0 0 clamp(1.5rem, 3vw, 2.5rem); padding: 0;
  list-style: none;
  font-size: .88rem; color: var(--texto-2);
}
.migalhas li + li::before { content: "/"; margin-right: .5rem; color: var(--linha-escura); }
.migalhas a { color: var(--texto-2); display: inline-block; padding-block: .3rem; }
.migalhas [aria-current] { display: inline-block; padding-block: .3rem; }

/* produtos */
.linhas-produto { display: grid; gap: clamp(3rem, 7vw, 6rem); }
.linha-produto { display: grid; gap: 1.5rem; align-items: center; }
.linha-produto__imagem {
  display: block;
  aspect-ratio: 4 / 3;
  max-width: 30rem;
  overflow: hidden;
  background: var(--creme-2);
}
.linha-produto__imagem img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.linha-produto:hover .linha-produto__imagem img { transform: scale(1.03); }
.linha-produto__nome { font-size: clamp(2rem, 1.5rem + 2vw, 3rem); margin-bottom: .4rem; }
.linha-produto__nome a { color: inherit; text-decoration: none; }
.linha-produto__nome a:hover { text-decoration: underline; text-decoration-color: var(--amarelo); }
.linha-produto__texto { max-width: 34rem; }
@media (min-width: 48em) {
  .linha-produto { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); }
  .linha-produto--inversa .linha-produto__imagem { order: 2; justify-self: end; }
}

.selo-adulto {
  display: inline-block;
  margin-bottom: .75rem;
  padding: .2rem .75rem;
  border: 1px solid currentColor; border-radius: 999px;
  color: var(--ambar);
  font-size: .8rem; font-weight: 600; letter-spacing: .03em;
}

.seccao--formatos { background: var(--creme-2); }
.formatos { display: grid; gap: 1.5rem; }
.tabela-envolvente { overflow-x: auto; }
.tabela {
  width: 100%;
  border-collapse: collapse;
  background: var(--superficie);
  border: 1px solid var(--linha);
  font-variant-numeric: tabular-nums;
}
.tabela th, .tabela td { padding: .85rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--linha); }
.tabela thead th { font-size: .78rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-2); }
.tabela tbody th { font-weight: 600; }
.tabela tbody th a { color: var(--texto); }
.tabela td:last-child { color: var(--texto-2); }
.nota-preco { font-size: .85em; color: var(--texto-2); }
@media (min-width: 60em) {
  .formatos { grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: 4rem; align-items: start; }
}
@media (max-width: 30em) {
  .tabela th, .tabela td { padding: .7rem .6rem; font-size: .92rem; }
}

/* detalhe de produto */
.produto-detalhe { padding-block: clamp(1.25rem, 3vw, 2rem) clamp(3rem, 6vw, 5rem); }
.produto-detalhe__grelha { display: grid; gap: clamp(2rem, 5vw, 4.5rem); }
.produto-detalhe__galeria { position: relative; width: fit-content; max-width: 100%; padding: 0 2rem 4rem 0; }
.produto-detalhe__principal {
  width: fit-content; max-width: 100%;
  padding: .55rem;
  background: var(--superficie);
  box-shadow: var(--sombra);
}
.produto-detalhe__principal img { width: auto; max-width: 100%; max-height: 40rem; }
.produto-detalhe__secundaria {
  position: absolute; right: 0; bottom: 0;
  width: 34%; max-width: 11rem;
  aspect-ratio: 3 / 4;
  padding: .4rem;
  background: var(--superficie);
  box-shadow: var(--sombra);
  transform: rotate(2deg);
}
.produto-detalhe__secundaria img { width: 100%; height: 100%; object-fit: cover; }
.produto-detalhe__texto h1 { font-size: clamp(2.6rem, 1.7rem + 3.2vw, 4.25rem); font-weight: 380; margin-bottom: .35rem; }
.produto-detalhe__descricao { max-width: 34rem; font-size: 1.15rem; color: var(--texto-2); }
.aviso-adulto {
  max-width: 34rem;
  padding: .7rem 1rem;
  background: var(--superficie);
  border-left: 3px solid var(--ambar);
  font-size: .95rem;
}
.painel-pedido {
  max-width: 34rem;
  margin-top: 2rem;
  padding: 1.5rem;
  background: var(--superficie);
  border: 1px solid var(--linha);
}
.painel-pedido .adicionar { margin-top: 0; }
.painel-pedido .nota-sem-js { margin-bottom: 0; border-left-width: 3px; padding: 0 0 0 1rem; }
.painel-pedido__nota { margin: .6rem 0 0; font-size: .86rem; color: var(--texto-2); }
@media (min-width: 60em) {
  .produto-detalhe__grelha { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: start; }
  .produto-detalhe__texto { padding-top: 1rem; }
}

.produto-info { display: grid; gap: 2.5rem; }
.produto-info h2 { font-size: 1.6rem; }
.info { margin: 0; }
.info__linha {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 1rem;
  padding: .8rem 0;
  border-bottom: 1px solid var(--linha);
}
.info__linha:first-child { border-top: 1px solid var(--linha); }
.info dt { font-weight: 600; }
.info dd { margin: 0; color: var(--texto-2); }
.info__pendente { font-style: italic; }
.sugestoes { margin: 0; padding-left: 1.2rem; }
.sugestoes li { margin-bottom: .55rem; }
.sugestoes li::marker { color: var(--ambar); }
@media (min-width: 60em) {
  .produto-info { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; }
}

.seccao--relacionados { padding-top: 0; }
.relacionados {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
  margin: 0; padding: 0; list-style: none;
}
.relacionado a {
  display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: .15rem 1rem; align-items: center;
  padding: .75rem;
  background: var(--superficie);
  border: 1px solid var(--linha);
  color: inherit; text-decoration: none;
  transition: border-color .2s;
}
.relacionado a:hover { border-color: var(--verde); }
.relacionado__imagem { grid-row: span 2; aspect-ratio: 1; overflow: hidden; }
.relacionado__imagem img { width: 100%; height: 100%; object-fit: cover; }
.relacionado__nome { align-self: end; font: 450 1.2rem/1.2 var(--serif); }
.relacionado__formatos { align-self: start; font-size: .88rem; color: var(--texto-2); }

/* da quinta */
.ensaio {
  display: grid; gap: 1.25rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas: "a a" "t t" "b d" "c c";
}
.ensaio__a { grid-area: a; }
.ensaio__b { grid-area: b; }
.ensaio__c { grid-area: c; }
.ensaio__d { grid-area: d; }
.ensaio__texto { grid-area: t; padding-block: 1rem; }
.ensaio__texto p { font: 400 clamp(1.3rem, 1.1rem + .9vw, 1.75rem)/1.4 var(--serif); }
.ensaio__texto .ornamento { margin-left: 0; }
.ensaio figure img { width: 100%; }
.ensaio figcaption { margin-top: .5rem; font-size: .85rem; color: var(--texto-2); }
.ensaio__b img, .ensaio__d img { aspect-ratio: 3 / 4; object-fit: cover; }
.nota-fontes { margin-top: 2rem; }
@media (min-width: 37.5em) {
  .ensaio { grid-template-areas: "a b" "t t" "c d"; gap: 1.5rem; align-items: end; }
}
@media (min-width: 60em) {
  .ensaio {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-template-areas: none;
    gap: 2rem 1.5rem;
    align-items: start;
  }
  .ensaio__a { grid-area: 1 / 1 / 2 / 7; }
  .ensaio__b { grid-area: 1 / 8 / 2 / 12; margin-top: 5rem; }
  .ensaio__texto { grid-area: 2 / 2 / 4 / 7; align-self: center; padding-right: 1rem; }
  .ensaio__c { grid-area: 2 / 7 / 3 / 13; }
  .ensaio__d { grid-area: 3 / 9 / 4 / 12; }
}

.rotulos { display: grid; gap: 2rem; align-items: center; }
.rotulos figure { max-width: 24rem; }
@media (min-width: 48em) {
  .rotulos { grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); }
}

/* como encomendar */
.pedido { display: grid; gap: 1.5rem; align-items: start; }
.painel {
  padding: clamp(1.25rem, 3vw, 2rem);
  background: var(--superficie);
  border: 1px solid var(--linha);
}
.painel h2 { font-size: clamp(1.5rem, 1.3rem + .8vw, 1.85rem); }
.painel--destaque { border-top: 4px solid var(--verde); }
.painel__cabeca { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .75rem; }
.painel__cabeca h2 { margin: 0; }
.painel__cabeca h2:focus { outline: none; }
.lista { margin: 0; padding: 0; list-style: none; }
.lista__item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "nome nome" "passo remover";
  gap: .6rem 1rem; align-items: center;
  padding: 1rem 0;
  border-bottom: 1px solid var(--linha);
}
.lista__item:first-child { border-top: 1px solid var(--linha); }
.lista__nome { grid-area: nome; }
.lista__item .passo { grid-area: passo; justify-self: start; }
.lista__remover { grid-area: remover; }
.lista__nome a { font: 450 1.2rem/1.25 var(--serif); color: var(--texto); text-decoration: none; }
.lista__nome a:hover { text-decoration: underline; }
.lista__formato { display: block; font-weight: 600; font-size: .92rem; color: var(--verde); }
.lista__preco { display: block; font-size: .82rem; color: var(--texto-2); }
@media (min-width: 30em) {
  .lista__item { grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "nome passo remover"; }
}
.lista-vazia {
  padding: 1.1rem 1.25rem;
  background: var(--papel);
  border: 1px dashed var(--linha-escura);
  color: var(--texto-2);
}
.painel .titulo-pequeno { margin-top: 2rem; font-size: 1.25rem; }
.rapidos { margin: 0; padding: 0; list-style: none; }
.rapido {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .5rem 1rem;
  padding: .6rem 0;
  border-top: 1px solid var(--linha);
}
.rapido__formato { margin-left: .3rem; font-weight: 600; color: var(--texto-2); white-space: nowrap; }

.envio-passos { display: grid; gap: 1.6rem; margin: 1.25rem 0 0; padding: 0; list-style: none; counter-reset: envio; }
.envio-passos > li { position: relative; padding-left: 2.4rem; counter-increment: envio; }
.envio-passos > li::before {
  content: counter(envio);
  position: absolute; left: 0; top: 0;
  display: grid; place-items: center;
  width: 1.7rem; height: 1.7rem;
  border-radius: 50%;
  background: var(--verde); color: var(--claro-1);
  font-size: .85rem; font-weight: 700;
}
.campo__rotulo { display: block; margin-bottom: .4rem; font-weight: 600; }
.opcional { font-weight: 400; color: var(--texto-2); }
.campo {
  display: block;
  width: 100%;
  padding: .7rem .8rem;
  background: #fff;
  border: 1.5px solid var(--linha-escura);
  border-radius: 4px;
  color: var(--texto);
  line-height: 1.5;
  resize: vertical;
}
.campo:focus-visible { outline-offset: 1px; border-color: var(--verde); }
.campo--mensagem { background: var(--papel); font-size: .95rem; }
.campo--vazio { color: var(--texto-2); font-style: italic; }
.campo__ajuda { margin: .4rem 0 .9rem; font-size: .86rem; color: var(--texto-2); }
.estado { min-height: 1.4em; margin: .75rem 0 0; font-size: .92rem; }
.estado--ok { color: var(--verde); font-weight: 600; }
.estado--aviso { color: var(--ambar); font-weight: 600; }
.aviso-final { margin: 1.75rem 0 0; padding-top: 1.25rem; border-top: 1px solid var(--linha); font-size: .92rem; color: var(--texto-2); }
.exemplo {
  padding: 1rem;
  background: var(--papel);
  border: 1px solid var(--linha);
  font: .95rem/1.5 var(--sans);
  white-space: pre-wrap;
}
@media (min-width: 60em) {
  .pedido { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 2.5rem; }
  .pedido__envio { position: sticky; top: 6rem; }
}

/* privacidade */
.texto-longo { max-width: 44rem; }
.texto-longo h2 { margin-top: 2.5rem; font-size: clamp(1.4rem, 1.25rem + .6vw, 1.7rem); }
.texto-longo h2:first-child { margin-top: 0; }
.texto-longo code { padding: .1em .35em; background: var(--creme-2); border-radius: 3px; font-size: .9em; }

/* ------------------------------------------------------------ acessibilidade */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .produto:hover .produto__imagem img,
  .linha-produto:hover .linha-produto__imagem img { transform: none; }
}

@media (forced-colors: active) {
  .botao, .opcao span, .passo, .menu-botao { border: 1px solid ButtonText; }
  .opcao input:checked + span { outline: 2px solid Highlight; }
}

/* Refinamento editorial — 23/10/2026. */
:root { --max: 76rem; --sombra-suave: 0 12px 36px -24px rgba(48,45,34,.32); }
.aviso-demo { padding-block:.35rem; font-size:.74rem; }
.aviso-demo span { opacity:.85; white-space:nowrap; }
.cabecalho { background:var(--superficie); }
.marca__nome { letter-spacing:-.035em; }
.hero { padding-block:clamp(2.25rem,5vw,4.75rem) clamp(3rem,5vw,5rem); border-bottom:1px solid var(--linha); }
.hero__grelha { gap:clamp(2rem,4.2vw,4.25rem); }
.hero h1 { font-size:clamp(2.85rem,1.1rem + 5vw,5.2rem); line-height:1.02; max-width:10ch; margin-bottom:.4em; }
.hero__apoio { max-width:29rem; font-size:clamp(1rem,.95rem + .25vw,1.16rem); line-height:1.65; }
.hero .acoes { gap:.65rem; margin-top:1.65rem; }
.hero .botao { padding-inline:1.25rem; }
.hero__nota { border:0; padding:0; font-size:.84rem; margin-top:1rem; max-width:29rem; }
.hero__nota a { white-space:nowrap; }
.hero__formatos { list-style:none; display:grid; grid-template-columns:1fr 1fr 1.4fr; padding:1.2rem 0 0; margin:1.6rem 0 0; border-top:1px solid var(--linha); max-width:29rem; gap:1rem; }
.hero__formatos li { display:grid; gap:.1rem; }
.hero__formatos strong { color:var(--verde); font-size:.95rem; font-weight:650; font-variant-numeric:tabular-nums; }
.hero__formatos span { color:var(--texto-2); font-size:.78rem; }
.hero__galeria { display:grid; grid-template-columns:1fr 1fr; gap:12px; width:100%; max-width:36rem; justify-self:center; }
.hero__foto { position:relative; display:block; overflow:hidden; aspect-ratio:1.7; background:var(--creme-2); border-radius:3px; color:var(--texto); text-decoration:none; box-shadow:var(--sombra-suave); }
.hero__foto--principal { grid-column:1/-1; aspect-ratio:1.64; }
.hero__foto > img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.hero__foto > span { display:flex; align-items:center; gap:.5rem; position:absolute; inset:auto 10px 10px; padding:.65rem .85rem; background:var(--superficie); border:1px solid var(--linha); }
.hero__foto strong { font:450 1.3rem/1.15 var(--serif); }
.hero__foto small { margin-right:auto; font-size:.65rem; color:var(--texto-2); letter-spacing:.08em; text-transform:uppercase; }
.hero__foto i { font-style:normal; margin-left:auto; font-size:1rem; }
.hero__foto:hover > img { transform:scale(1.025); }
.hero__legenda { grid-column:1/-1; margin:0; font-size:.7rem; color:var(--texto-2); }
.cabeca-seccao h2 em { color:var(--ambar); }
.produto { gap:0; background:var(--superficie); border:1px solid var(--linha); border-radius:4px; overflow:hidden; }
.produto__imagem { max-width:none; width:100%; aspect-ratio:1.25; }
.produto__corpo { padding:1.5rem; }
.produto__numero { font-size:.67rem; margin-bottom:.8rem; }
.produto__nome { font-size:1.9rem; }
.produto__resumo { min-height:3.4em; font-size:1rem; }
.produto .adicionar { margin-top:1.2rem; padding-top:1rem; border-top:1px solid var(--linha); }
.produto .adicionar > .botao { width:100%; }
.produto .ligacao-seta { font-size:.86rem; }
.produto .estado-produto { padding:.5rem .65rem; background:#e8efdf; border-radius:3px; font-size:.8rem; }
.prateleira { gap:1.4rem; align-items:stretch; }
.passo-item { padding-top:1.25rem; border-top:2px solid var(--linha); }
.passo-item__n { font-size:.8rem; color:var(--ambar); }
.fecho { background:var(--creme-2); }
.fecho h2 { max-width:18ch; margin-inline:auto; }
.fecho .sobretitulo { margin-bottom:1.2rem; }
.fecho__interior > p:not(.sobretitulo) { max-width:32rem; margin-inline:auto; color:var(--texto-2); }
.painel { border-radius:5px; box-shadow:var(--sombra-suave); }
.selecao-total { display:block; margin-top:.5rem; color:var(--texto-2); font:500 .85rem var(--sans); }
.lista__nome { display:flex; gap:.75rem; align-items:center; min-width:0; }
.lista__foto { width:56px; height:64px; object-fit:cover; flex:none; border-radius:3px; }
.lista__info { min-width:0; }
.lista__nome a { font-size:1.12rem; }
.pedido__introducao { font-size:.96rem; color:var(--texto-2); }
.envio-passos > li { padding-left:0; }
.envio-passos > li::before { display:none; }
.pedido-copiado [data-abrir-instagram] { background:var(--verde); border-color:var(--verde); color:var(--superficie); }
.pedido-copiado [data-copiar] { background:#e8efdf; color:var(--verde-escuro); border-color:var(--verde); }
.estado--ok { padding:.8rem; background:#e8efdf; border-radius:3px; }
@media (min-width:60em) {
 .hero__grelha { grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); }
 .prateleira .produto { grid-template-rows:auto 1fr; }
 .prateleira .produto__corpo { display:flex; flex-direction:column; }
 .prateleira .produto .adicionar { margin-top:auto; }
 .prateleira .produto__resumo { margin-bottom:1.2rem; }
 .pedido { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:2rem; }
 .pedido .lista__item { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:'nome nome' 'passo remover'; }
 .pedido .lista__item .passo { margin-left:calc(56px + .75rem); }
}
@media (min-width:37.5em) and (max-width:59.99em) {
 .prateleira .produto { gap:0; align-items:stretch; }
 .prateleira .produto__imagem { height:100%; aspect-ratio:auto; }
 .hero__galeria { max-width:40rem; }
}
@media (max-width:37.49em) {
 .hero__grelha { gap:2rem; }
 .hero { padding-top:2rem; }
 .hero h1 { font-size:clamp(2.75rem,11.8vw,4rem); max-width:11ch; }
 .hero .sobretitulo { font-size:.66rem; letter-spacing:.11em; margin-bottom:.9rem; }
 .hero .acoes { display:grid; grid-template-columns:1fr; }
 .hero .acoes .botao { width:100%; }
 .hero .acoes .botao--secundario { border:0; padding:.45rem; min-height:2.75rem; text-decoration:underline; }
 .hero__formatos { margin-top:1.15rem; padding-top:1rem; }
 .hero__formatos strong { font-size:.85rem; }
 .hero__galeria { gap:9px; }
 .hero__foto > span { inset:auto 6px 6px; padding:.45rem .55rem; }
 .hero__foto strong { font-size:1.15rem; }
 .hero__foto--principal { aspect-ratio:1.7; }
 .hero__foto small { font-size:.6rem; }
 .hero__foto:not(.hero__foto--principal) { aspect-ratio:1.3; }
 .produto__corpo { padding:1.25rem; }
 .produto__resumo { min-height:0; }
 .lista__item { gap:.7rem; }
 .lista__foto { width:46px; height:54px; }
 .lista__nome a { font-size:1.1rem; }
}
@media (prefers-reduced-motion:reduce) { .hero__foto > img { transition:none; } .hero__foto:hover > img { transform:none; } }

/* Destaque final: marmelada em formato grande na entrada. */
.hero__foto--principal { aspect-ratio:4/3; }
.hero__foto--principal > img { object-position:50% 50%; }
@media (max-width:37.49em) {
 .hero { padding-top:1.25rem; }
 .hero__galeria { order:-1; }
 .hero__foto--principal { aspect-ratio:4/3; }
 .hero__foto--principal small { display:none; }
 .hero__foto:not(.hero__foto--principal), .hero__legenda { display:none; }
 .hero__grelha { gap:1.5rem; }
}

/* Apresentação dos sabores — navegação editorial e cartões de produto. */
.hero__formatos { grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:0; padding:0; margin-top:1.75rem; max-width:31rem; }
.hero__formatos li { min-width:0; }
.hero__formatos li + li { border-left:1px solid var(--linha); }
.hero__formatos a { display:grid; gap:.45rem; padding:.65rem .85rem; border-bottom:2px solid var(--linha); color:var(--texto); text-decoration:none; transition:background .2s,border-color .2s; }
.hero__formatos li:first-child a { padding-left:0; }
.hero__formatos strong { font:450 clamp(1.1rem,1.5vw,1.45rem)/1.1 var(--serif); color:var(--verde-escuro); }
.hero__formatos span { display:flex; align-items:center; justify-content:space-between; gap:.3rem; font-size:.72rem; font-variant-numeric:tabular-nums; }
.hero__formatos i { font-style:normal; color:var(--ambar); }
.hero__formatos a:hover { background:var(--creme-2); border-color:var(--verde); }
.cabeca-produtos { max-width:none; display:grid; gap:1.5rem; }
.cabeca-produtos h2 { font-size:clamp(2.4rem,4.5vw,4rem); line-height:1.05; margin-bottom:0; }
.cabeca-produtos > p { max-width:25rem; color:var(--texto-2); line-height:1.75; padding-bottom:.35rem; }
.prateleira .produto { position:relative; border-radius:10px; border-color:#dcd6c7; box-shadow:0 8px 26px -22px rgba(48,45,34,.35); }
.prateleira .produto__imagem { aspect-ratio:1.1; }
.prateleira .produto__corpo { padding:1.6rem; }
.prateleira .produto__numero { letter-spacing:.18em; margin-bottom:.65rem; color:var(--ambar); }
.prateleira .produto__nome { font-size:clamp(1.8rem,2.5vw,2.25rem); line-height:1.08; margin-bottom:.75rem; }
.prateleira .produto__formatos { position:absolute; top:1rem; right:1rem; padding:.35rem .75rem; background:var(--superficie); border:1px solid var(--linha); border-radius:100px; font-size:.76rem; margin:0; }
.prateleira .produto .adicionar > .botao { background:var(--verde); color:var(--superficie); border-color:var(--verde); border-radius:6px; }
.prateleira .produto .adicionar > .botao:hover { background:var(--verde-escuro); }
.prateleira .produto .ligacao-seta { margin-top:1rem; }
@media (min-width:60em) {
 .cabeca-produtos { grid-template-columns:1.2fr 1fr; align-items:end; gap:4rem; margin-bottom:2.75rem; }
 .cabeca-produtos > p { justify-self:end; margin-bottom:0; }
}
@media (min-width:37.5em) and (max-width:59.99em) {
 .prateleira .produto__imagem { aspect-ratio:auto; }
 .prateleira .produto__formatos { position:static; display:table; margin:0 0 .75rem; }
}
@media (max-width:37.49em) {
 .hero__formatos strong { font-size:1.12rem; }
 .hero__formatos a { padding:.6rem .6rem; }
 .hero__formatos span { font-size:.66rem; }
 .prateleira .produto__corpo { padding:1.35rem; }
 .prateleira .produto__imagem { aspect-ratio:1.2; }
 .cabeca-produtos > p { margin-bottom:0; }
}
