/* Zona de blocos genéricos do editor visual (promoção, cards, produtos,
   avaliações, formulário, texto, imagem) e as divisões que os organizam.
   Reaproveita os tokens de styles.css/brand-theme.css — nenhuma cor nova. */

.blocos-adicionais{background:var(--paper);display:flex;flex-direction:column;gap:40px}

.bloco-divisao{display:flex;gap:28px}
.bloco-divisao--vertical{flex-direction:column}
.bloco-divisao__parte{min-width:0;min-height:0}

.bloco{min-width:0}
.bloco h3{font-size:clamp(22px,2.6vw,32px);letter-spacing:-.03em;font-weight:500;margin-bottom:12px}
.bloco p{font-size:13px;color:var(--muted);line-height:1.8}

.bloco-texto{max-width:620px}

.bloco-imagem img{width:100%;border-radius:4px}
.bloco-imagem figcaption{font-size:10px;color:var(--muted);margin-top:10px}

.bloco-banner{display:grid;grid-template-columns:40% 60%;gap:5%;align-items:center;background:var(--sand);border-radius:6px;overflow:hidden}
.bloco-banner img{width:100%;height:100%;object-fit:cover;min-height:220px}
.bloco-banner-copy{padding:36px}
.bloco-banner-copy .micro-label{color:var(--accent);letter-spacing:.14em;font-size:9px;display:block;margin-bottom:10px}
.bloco-banner-copy p{margin:16px 0}

.bloco-cards-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;margin-top:18px}
.bloco-card{background:var(--sand);border-radius:6px;padding:22px;display:flex;flex-direction:column;gap:10px}
.bloco-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.bloco-card h4{font-size:16px;font-weight:500;letter-spacing:-.02em}
.bloco-card p{font-size:12px}
.bloco-card a{display:inline-flex;align-items:center;gap:8px;font-size:11px;color:var(--accent)}
.bloco-card a svg{width:16px}

.bloco-avaliacoes-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;margin-top:18px}
.bloco-avaliacao{margin:0;background:var(--sand);border-radius:6px;padding:22px}
.bloco-avaliacao p{font-size:13px;color:var(--ink);line-height:1.8}
.bloco-avaliacao cite{display:block;margin-top:14px;font-size:11px;color:var(--muted);font-style:normal}

.bloco-formulario{text-align:center;max-width:520px;margin:0 auto}
.bloco-formulario .button{margin-top:18px}

@media(max-width:767px){
  .blocos-adicionais{gap:28px}
  .bloco-divisao{flex-direction:column}
  .bloco-divisao__parte{flex-basis:auto!important}
  .bloco-banner{grid-template-columns:1fr}
  .bloco-banner img{min-height:160px}
}

/* Somente a prévia incorporada ao ERP recebe as bordas, puxadores e
   realce de seção. A vitrine pública não ganha nenhum desses controles. */
html.erp-editor-preview .erp-editor-secao > .erp-editor-linha {
  position: absolute; left: 0; right: 0; z-index: 117;
  display: block; height: 4px; pointer-events: none;
  background: radial-gradient(circle, #ffd000 1.6px, transparent 2.1px) left center / 11px 4px repeat-x;
  opacity: 0; transition: opacity .15s ease;
  filter: drop-shadow(0 1px 2px #0009);
}
html.erp-editor-preview .erp-editor-secao > .erp-editor-linha--topo { top: 0; }
html.erp-editor-preview .erp-editor-secao > .erp-editor-linha--base { bottom: 0; }
html.erp-editor-preview .erp-editor-secao:hover > .erp-editor-linha,
html.erp-editor-preview .erp-editor-secao:focus-within > .erp-editor-linha,
html.erp-editor-preview .erp-editor-destino-antes > .erp-editor-linha--topo,
html.erp-editor-preview .erp-editor-destino-depois > .erp-editor-linha--base { opacity: 1; }
html.erp-editor-preview .erp-editor-destino-antes > .erp-editor-linha--topo,
html.erp-editor-preview .erp-editor-destino-depois > .erp-editor-linha--base {
  height: 6px;
  background: repeating-linear-gradient(90deg, #ffd000 0 9px, transparent 9px 14px);
  filter: drop-shadow(0 0 5px #ffd000);
}
html.erp-editor-preview .erp-editor-secao > .erp-editor-cobertura {
  position: absolute; inset: 0; z-index: 115;
  pointer-events: none; display: block; background: rgba(255, 208, 0, .16);
  opacity: 0; transition: opacity .17s ease;
}
html.erp-editor-preview .erp-editor-secao--realce > .erp-editor-cobertura {
  opacity: 1;
}
html.erp-editor-preview .erp-editor-marcador,
html.erp-editor-preview .erp-editor-puxador {
  position: absolute; top: 12px; z-index: 120;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 8px 12px; border: 1px solid rgba(255, 208, 0, .85);
  border-radius: 5px; color: #161410; background: #ffd000;
  font: 700 11px/1.2 system-ui, sans-serif; letter-spacing: .01em;
  box-shadow: 0 5px 20px #0005; cursor: pointer;
}
html.erp-editor-preview .erp-editor-marcador { right: 12px; }
html.erp-editor-preview .erp-editor-puxador {
  left: 50%; transform: translateX(-50%); padding: 6px 14px;
  min-width: 48px; min-height: 34px; font-size: 23px; line-height: 1;
  cursor: grab; touch-action: none; user-select: none;
  opacity: 0; pointer-events: none; transition: opacity .15s ease;
}
html.erp-editor-preview .erp-editor-secao:hover > .erp-editor-puxador,
html.erp-editor-preview .erp-editor-puxador:focus-visible {
  opacity: 1; pointer-events: auto;
}
html.erp-editor-preview .erp-editor-puxador:active { cursor: grabbing; }
html.erp-editor-preview .scroll-story .erp-editor-marcador,
html.erp-editor-preview .scroll-story .erp-editor-puxador { top: 62px; }
html.erp-editor-preview .erp-editor-marcador:hover,
html.erp-editor-preview .erp-editor-marcador:focus-visible,
html.erp-editor-preview .erp-editor-puxador:hover,
html.erp-editor-preview .erp-editor-puxador:focus-visible {
  background: #fff; color: #111; outline: 2px solid #ffd000;
}
html.erp-editor-preview .erp-editor-fantasma {
  position: fixed; left: 0; top: 0; z-index: 99999;
  padding: 10px 14px; border-radius: 5px;
  border: 2px dashed #ffd000; background: #161410ee; color: #ffd000;
  pointer-events: none; user-select: none;
  font: 700 12px/1.2 system-ui, sans-serif;
  box-shadow: 0 8px 30px #0009;
}
html.erp-editor-preview .erp-editor-fantasma[hidden] { display:none; }
html.erp-editor-preview.erp-editor-arrastando,
html.erp-editor-preview .erp-editor-arrastando,
html.erp-editor-preview .erp-editor-secao.erp-editor-arrastando { user-select:none; }
html.erp-editor-preview .whatsapp-fab { display: none !important; }
@media (max-width: 767px) {
  html.erp-editor-preview .erp-editor-marcador { right: 7px; top: 8px; font-size: 10px; }
  html.erp-editor-preview .erp-editor-puxador { top: 8px; }
  html.erp-editor-preview .scroll-story .erp-editor-marcador,
  html.erp-editor-preview .scroll-story .erp-editor-puxador { top: 52px; }
}
@media (prefers-reduced-motion: reduce) {
  html.erp-editor-preview .erp-editor-linha,
  html.erp-editor-preview .erp-editor-puxador,
  html.erp-editor-preview .erp-editor-cobertura { transition: none; }
}
