/* Base visual comum: caderno de receitas, letra grande pra quem lê de óculos. */
:root {
  --papel: #f4ead6;
  --linha: #e6d6b5;
  --balao: #fffaf0;
  --tinta: #3b2f24;
  --tinta-suave: #6f5f4d;
  --verde: #2f5d3a;
  --vermelho: #b23a2a;
  --vermelho-escuro: #7f2519;
  --borda: #dcc9a3;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--papel);
  color: var(--tinta);
  font: 19px/1.6 "Nunito", system-ui, sans-serif;
}
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3 { font-family: "Lora", Georgia, serif; line-height: 1.2; color: var(--tinta); }
a { color: var(--verde); }
:focus-visible { outline: 3px solid #e0a526; outline-offset: 2px; }

.miolo { max-width: 680px; margin: 0 auto; padding: 0 16px; }

.cta {
  display: block; width: 100%;
  background: var(--vermelho); color: #fff;
  font: 800 20px/1.3 "Nunito", sans-serif;
  text-align: center; text-decoration: none;
  border: 0; border-radius: 14px; cursor: pointer;
  padding: 18px 16px; min-height: 60px;
  box-shadow: 0 4px 0 var(--vermelho-escuro);
}
.cta:active { transform: translateY(2px); box-shadow: 0 2px 0 var(--vermelho-escuro); }
.cta small { display: block; font-weight: 600; font-size: 14px; opacity: .9; }

.segredo {
  position: relative;
  background: #fff8e6;
  border: 2px dashed var(--vermelho);
  border-radius: 12px;
  padding: 26px 18px 16px;
  margin: 28px 0 20px;
}
.segredo .carimbo, .carimbo {
  background: var(--vermelho); color: #fff;
  font: 800 13px "Nunito", sans-serif; letter-spacing: .12em;
  padding: 3px 10px; border-radius: 4px;
  display: inline-block;
}
.segredo .carimbo { position: absolute; top: -12px; left: 14px; transform: rotate(-3deg); }
.segredo b { color: var(--vermelho); }
.segredo p { margin: 0; }

.foto { border-radius: 12px; border: 6px solid #fff; box-shadow: 0 4px 14px rgba(0,0,0,.15); }
.foto-fita { transform: rotate(-1.2deg); }

.garantia {
  display: flex; gap: 14px; align-items: center;
  background: var(--balao); border: 1px solid var(--borda); border-radius: 14px;
  padding: 16px;
}
.garantia .selo {
  flex: none; width: 64px; height: 64px; border-radius: 50%;
  background: var(--verde); color: #fff;
  display: grid; place-items: center; text-align: center;
  font: 800 13px/1.1 "Nunito", sans-serif;
}

.rodape {
  font-size: 14px; color: var(--tinta-suave); text-align: center;
  padding: 24px 16px 32px; border-top: 1px solid var(--borda); margin-top: 40px;
}
.rodape p { margin: 4px 0; }

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }