/* Guia (single de post) — polish do design aprovado em 06/10/2026
   (artboards GuiaTopo/GuiaTopoMobile/GuiaRodape/GuiaRodapeMobile; tokens em design/README.md).
   REGRA: nenhum seletor aqui atinge os cards de produto (.cg-*, .product*, .amzbutton, stickybar).
   A tipografia do texto do guia fica escopada em .cp-guide-body / .cp-guide-intro.
   O style.css legado usa !important em .simpletitle(pt-4), span.data e .affiliate-disclosure:
   onde foi inevitável, o !important abaixo sobrescreve com especificidade maior.

   Teto de altura (o card 1 não pode descer): topo = trilha + h1 + byline + aviso + intro,
   sem outros espaçadores. */

html body { background: #FFFFFF; }

/* ------------------------------------------------------------------ */
/* Topo                                                                */
/* ------------------------------------------------------------------ */

.container.simpletitle { padding-top: 12px !important; padding-bottom: 0 !important; }
.simpletitle + .container.single { margin-top: 0; }

.cp-guide-trail {
  display: flex;
  flex-wrap: wrap;
  gap: 0 6px;
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 18px;
  color: #6B6A80;
}
.cp-guide-trail a,
.cp-guide-trail a:hover { color: #6B6A80; font-weight: 400; text-decoration: none; }
.cp-guide-trail a:hover { color: #614BC3; }

.container.simpletitle h1 {
  margin: 0 0 10px !important;
  font-size: 40px;
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #16142B;
}

/* Byline: foto + nome + data (uma linha). Foto 24px também no desktop: com 28px o card 1 descia 2,9px. */
.single span.data.cp-guide-byline {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 10px;
  margin: 0 0 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  font-size: 14px !important;
  line-height: 24px !important;
  color: #4B4A63;
}
.single span.data.cp-guide-byline a.cp-guide-byline-author {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #16142B;
  font-weight: 600;
  text-decoration: none;
}
.single span.data.cp-guide-byline a.cp-guide-byline-author:hover { color: #614BC3; text-decoration: none; }
.single span.data.cp-guide-byline strong { font-weight: 600; }
.single .cp-guide-byline-img {
  display: block;
  width: 24px;
  height: 24px;
  max-width: none;
  border-radius: 50%;
  object-fit: cover;
  background: #EFEDF5;
}
.cp-guide-byline-sep { color: #A3A1B5; }
.single span.data.cp-guide-byline time { color: #4B4A63; }

/* Aviso de afiliado (mantém aside.affiliate-disclosure) */
.single .affiliate-disclosure {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 14px !important;
  padding: 10px 12px !important;
  background: #F3F1FB;
  border: 0;
  border-left: 0;
  border-radius: 8px;
  box-shadow: inset 2px 0 0 #614BC3; /* filete roxo que acompanha a curva dos cantos */
  font-size: 13px !important;
  line-height: 1.45 !important;
  color: #33314A !important;
}
.single .affiliate-disclosure .cp-guide-disclosure-icon {
  display: flex;
  flex: 0 0 18px;
  padding-top: 0;
  color: #614BC3;
}
.single .affiliate-disclosure .cp-guide-disclosure-icon svg { display: block; width: 18px; height: 18px; }
.single .affiliate-disclosure .cp-guide-disclosure-text { margin: 0; font-size: inherit; line-height: inherit; color: inherit; }
.single .affiliate-disclosure strong { color: inherit; }
.single .affiliate-disclosure a { color: #614BC3; font-weight: 600; text-decoration: none; }
.single .affiliate-disclosure a:hover { color: #4A36A3; text-decoration: none; }
.cp-guide-disc-short { display: none; }

/* Intro */
.single .cp-guide-intro { margin: 0 0 16px; font-size: 17px; line-height: 1.65; color: #33314A; }
.single .cp-guide-intro > p { margin: 0 0 16px; font-size: inherit; line-height: inherit; color: inherit; }
.single .cp-guide-intro > :last-child { margin-bottom: 0; }

/* ------------------------------------------------------------------ */
/* Guia de compra + FAQ (só dentro do wrapper .cp-guide-body)          */
/* ------------------------------------------------------------------ */

.single .cp-guide-body { margin-top: 56px; color: #33314A; }
.single .cp-guide-body p { margin: 0 0 16px; font-size: 16px; line-height: 1.65; color: #33314A; }
.single .cp-guide-body a { color: #614BC3; font-weight: 600; text-decoration: none; }
.single .cp-guide-body a:hover { color: #4A36A3; }

.single .cp-guide-body .cp-guide-sec {
  margin: 56px 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid #16142B;
}
.single .cp-guide-body > .cp-guide-sec:first-child { margin-top: 0; }
.cp-guide-label {
  display: block;
  font-size: 12px;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6B6A80;
}

.single .cp-guide-body .cp-guide-h2 {
  margin: 24px 0 16px;
  font-size: 30px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #16142B;
}

.single .cp-guide-body .cp-guide-criterios {
  list-style: none;
  margin: 8px 0 16px;
  padding: 0;
  counter-reset: cp-crit;
}
.single .cp-guide-body .cp-guide-criterios > li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  column-gap: 18px;
  row-gap: 4px;
  padding: 18px 0;
  border-top: 1px solid #E6E4EF;
  counter-increment: cp-crit;
}
.single .cp-guide-body .cp-guide-criterios > li:last-child { border-bottom: 1px solid #E6E4EF; }
.single .cp-guide-body .cp-guide-criterios > li::before {
  content: counter(cp-crit, decimal-leading-zero);
  grid-column: 1;
  grid-row: 1 / span 2;
  padding-top: 3px;
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
  color: #614BC3;
}
.single .cp-guide-body .cp-guide-criterios h3 {
  grid-column: 2;
  margin: 0;
  font-size: 17px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #16142B;
}
.single .cp-guide-body .cp-guide-criterios p { grid-column: 2; margin: 0; }

.single .cp-guide-body .cp-guide-faq-q {
  position: relative;
  margin: 0;
  padding: 20px 30px 8px 0;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #16142B;
}
.single .cp-guide-body .cp-guide-faq-q::after {
  content: "";
  position: absolute;
  right: 0;
  top: 23px;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A3A1B5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat center / 18px 18px;
}
.single .cp-guide-body .cp-guide-faq-q + p {
  margin: 0;
  padding-bottom: 20px;
  border-bottom: 1px solid #E6E4EF;
}
.single .cp-guide-body .cp-guide-faq-q + p + p { margin-top: 20px; }

/* ------------------------------------------------------------------ */
/* Bio (mantém aside.author-bio; neutraliza o CSS legado)              */
/* ------------------------------------------------------------------ */

.single .author-bio {
  display: block;
  margin: 56px 0 0;
  padding: 24px 0 0;
  background: transparent;
  border: 0;
  border-top: 1px solid #16142B;
  border-radius: 0;
  text-align: left;
}
.single .author-bio > .cp-guide-label { margin-bottom: 12px; }
.cp-guide-bio-row { display: flex; gap: 20px; align-items: flex-start; }
.single .cp-guide-bio-photo { flex: 0 0 72px; display: block; }
.single .cp-guide-bio-img {
  display: block;
  width: 72px;
  height: 72px;
  max-width: none;
  border-radius: 50%;
  object-fit: cover;
  background: #EFEDF5;
}
.cp-guide-bio-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.single .cp-guide-bio-name { font-size: 18px; line-height: 1.3; font-weight: 700; letter-spacing: -0.01em; color: #16142B; }
.single .cp-guide-bio-name a { color: #16142B; font-weight: 700; text-decoration: none; }
.single .cp-guide-bio-name a:hover { color: #614BC3; }
.cp-guide-bio-meta { font-size: 14px; font-weight: 400; letter-spacing: 0; color: #6B6A80; }
.single .cp-guide-bio-text { margin: 0; max-width: 620px; font-size: 15px; line-height: 1.6; color: #33314A; }
.cp-guide-bio-links { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 4px; font-size: 14px; line-height: 1.4; }
.single .cp-guide-bio-links a { color: #614BC3; font-weight: 600; text-decoration: none; }
.single .cp-guide-bio-links a:hover { color: #4A36A3; }

/* ------------------------------------------------------------------ */
/* Aviso final (mantém div.disclaimer)                                 */
/* ------------------------------------------------------------------ */

.single .disclaimer {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin: 32px 0 0;
  padding: 16px 0 40px;
  background: transparent;
  border: 0;
  border-top: 1px solid #E6E4EF;
  border-radius: 0;
  font-size: 13px;
  line-height: 1.6;
  color: #6B6A80;
}
.single .disclaimer .cp-guide-disclaimer-icon { display: flex; flex: 0 0 18px; padding-top: 1px; color: #614BC3; }
.single .disclaimer .cp-guide-disclaimer-icon svg { display: block; width: 18px; height: 18px; }
.single .disclaimer .cp-guide-disclaimer-text { margin: 0; font-size: inherit; line-height: inherit; color: inherit; }
.single .disclaimer a { color: #614BC3; font-weight: 600; text-decoration: none; }
.single .disclaimer a:hover { color: #4A36A3; }

/* ------------------------------------------------------------------ */
/* Veja também (faixa de largura total, fora do .container.single)     */
/* ------------------------------------------------------------------ */

.cp-guide-related {
  /* variáveis usadas pelos estilos cp-home-card de shell-home.css */
  --cp-home-text: #16142B;
  --cp-home-text-2: #4B4A63;
  --cp-home-muted: #6B6A80;
  --cp-home-accent: #614BC3;
  --cp-home-accent-hover: #4A36A3;
  --cp-home-placeholder: #EFEDF5;
  --cp-home-radius: 8px;

  margin-top: 0;
  background: #F7F6FB;
  border-top: 1px solid #E6E4EF;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #16142B;
}
.cp-guide-related-inner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 48px 24px 64px;
  box-sizing: border-box;
}
.cp-guide-related-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid #16142B;
}
.cp-guide-related-head h2 {
  margin: 0;
  font-size: 26px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #16142B;
}
.cp-guide-related-head a { font-size: 14px; font-weight: 600; color: #614BC3; text-decoration: none; }
.cp-guide-related-head a:hover { color: #4A36A3; text-decoration: none; }
.cp-guide-related-grid {
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr));
  gap: 32px 28px;
}
.cp-guide-related .cp-home-card,
.cp-guide-related .cp-home-card:hover { color: #16142B; text-decoration: none; }
.cp-guide-related .cp-home-card__img { width: 100%; max-width: none; }
.cp-guide-related .cp-home-card__title { font-size: 20px; }

/* ------------------------------------------------------------------ */
/* Mobile                                                              */
/* ------------------------------------------------------------------ */

@media (max-width: 640px) {
  .container.simpletitle h1 { font-size: 24px; line-height: 1.1; }

  .single span.data.cp-guide-byline { flex-wrap: nowrap; gap: 0 8px; font-size: 13px !important; white-space: nowrap; }

  .cp-guide-disc-long { display: none; }
  .cp-guide-disc-short { display: inline; }

  .single .cp-guide-intro { font-size: 16px; line-height: 1.6; }

  .single .cp-guide-body { margin-top: 40px; }
  .single .cp-guide-body .cp-guide-sec { margin-top: 40px; padding-bottom: 8px; }
  .single .cp-guide-body .cp-guide-h2 { margin-top: 18px; font-size: 24px; line-height: 1.12; }
  .single .cp-guide-body .cp-guide-criterios > li { grid-template-columns: 24px minmax(0, 1fr); column-gap: 12px; padding: 14px 0; }
  .single .cp-guide-body .cp-guide-criterios > li::before { font-size: 12px; }
  .single .cp-guide-body .cp-guide-criterios h3 { font-size: 16px; }
  .single .cp-guide-body .cp-guide-criterios p { font-size: 15px; line-height: 1.6; }
  .single .cp-guide-body .cp-guide-faq-q { padding: 16px 26px 6px 0; font-size: 16px; }
  .single .cp-guide-body .cp-guide-faq-q::after { top: 18px; width: 16px; height: 16px; background-size: 16px 16px; }
  .single .cp-guide-body .cp-guide-faq-q + p { padding-bottom: 16px; font-size: 15px; line-height: 1.6; }

  .single .author-bio { margin-top: 40px; padding-top: 20px; }
  .cp-guide-bio-row {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    column-gap: 14px;
    row-gap: 10px;
    align-items: center;
  }
  .cp-guide-bio-body { display: contents; }
  .single .cp-guide-bio-photo { grid-column: 1; grid-row: 1; }
  .single .cp-guide-bio-img { width: 56px; height: 56px; }
  .single .cp-guide-bio-name { grid-column: 2; grid-row: 1; font-size: 17px; }
  .cp-guide-bio-dot { display: none; }
  .cp-guide-bio-meta { display: block; margin-top: 2px; font-size: 13px; }
  .single .cp-guide-bio-text,
  .cp-guide-bio-links { grid-column: 1 / -1; }
  .cp-guide-bio-links { gap: 6px 16px; margin-top: 0; }

  .single .disclaimer { margin-top: 24px; padding: 14px 0 32px; gap: 10px; font-size: 12px; }

  .cp-guide-related-inner { padding: 32px 16px 40px; }
  .cp-guide-related-head { padding-bottom: 10px; }
  .cp-guide-related-head h2 { font-size: 22px; }
  .cp-guide-related-head a { font-size: 13px; }
  .cp-guide-related-grid { margin-top: 20px; grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .cp-guide-related .cp-home-card {
    display: grid;
    column-gap: 14px;
    row-gap: 4px;
    grid-template-columns: 120px minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: center;
  }
  .cp-guide-related .cp-home-card__img { grid-column: 1; grid-row: 1 / span 2; width: 120px; align-self: center; }
  .cp-guide-related .cp-home-kicker { grid-column: 2; margin-top: 0; font-size: 11px; align-self: end; }
  .cp-guide-related .cp-home-card__title { grid-column: 2; font-size: 15px; line-height: 1.3; align-self: start; }
}

/* Sem faixa branca entre "Veja também" (fundo lilás) e o rodapé (06/10/2026) */
body:has(.cp-guide-related) .cp-footer { margin-top: 0; }

/* =====================================================================
   FACE LIFT DOS CARDS DE PRODUTO (aprovado 06/10/2026)
   Só visual: altura, layout interno, cores dos top 3 e gradiente animado
   dos botões continuam iguais. Nada no HTML / product-cards.php.
   ===================================================================== */

/* Borda 3px -> 2px + padding 1px: a caixa externa mantém exatamente a mesma medida */
.container.single .cg-box-accord-one {
  border-radius: 12px;
  border-color: #E6E4EF;
  box-shadow: 0 1px 2px rgba(22, 20, 43, 0.04), 0 12px 28px -18px rgba(22, 20, 43, 0.25);
}
.container.single .cg-box-accord-one:nth-of-type(1),
.container.single .cg-box-accord-one:nth-of-type(2),
.container.single .cg-box-accord-one:nth-of-type(3) {
  border-width: 2px;
  border-radius: 12px;
  padding: 1px;
}
.container.single .cg-box-accord-one:nth-of-type(1) { --cp-card: #2ecc71; border-color: #2ecc71; box-shadow: 0 1px 2px rgba(22, 20, 43, 0.04), 0 12px 28px -16px rgba(46, 204, 113, 0.55); }
.container.single .cg-box-accord-one:nth-of-type(2) { --cp-card: #3498db; border-color: #3498db; box-shadow: 0 1px 2px rgba(22, 20, 43, 0.04), 0 12px 28px -16px rgba(52, 152, 219, 0.55); }
.container.single .cg-box-accord-one:nth-of-type(3) { --cp-card: #9b59b6; border-color: #9b59b6; box-shadow: 0 1px 2px rgba(22, 20, 43, 0.04), 0 12px 28px -16px rgba(155, 89, 182, 0.55); }

/* Número: anel branco separa o círculo da borda (posição igual) */
.container.single .cg-box-accord-one .cg-row-number {
  box-shadow: 0 0 0 3px #FFFFFF, 0 2px 6px rgba(22, 20, 43, 0.14);
}

/* Foto: quadro lilás-claro arredondado, mesmo tamanho; fundo branco do produto se integra */
.container.single .cg-box-accord-one .cg-img-1.is-loaded,
.container.single .cg-box-accord-one .cg-img-1 {
  background-color: #F7F6FB;
  border-radius: 10px;
  mix-blend-mode: multiply;
}

/* Selo: mesmas cores, cantos 6px e peso 600 */
.container.single .cg-box-accord-one .cg-tbl-ribbon small {
  border-radius: 6px;
  font-weight: 600;
  padding: 0 10px;
  letter-spacing: 0.01em;
}

/* Nome do produto */
.container.single .cg-box-accord-one .cg-table-title {
  color: #16142B !important;
  /* peso 600 e sem letter-spacing de propósito: 700 alarga o texto e pode criar uma linha a mais no mobile */
}

/* Specs: rótulo cinza, valor escuro, check na cor do card (mesmo tamanho/entrelinha) */
.container.single .cg-box-accord-one .cg-tbl-ul ul li { color: #16142B; }
.container.single .cg-box-accord-one .cg-tbl-ul ul li strong { color: #6B6A80; font-weight: 500; }
.container.single .cg-box-accord-one .cg-tbl-ul ul li::before { color: var(--cp-card, #614BC3); left: 1px; }

/* Botões: gradiente e animação intactos; cantos 10px e acabamento sutil */
.container.single .cg-box-accord-one .cg-btn.cg-btn-lg {
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(22, 20, 43, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.20);
}

/* Ver mais infos: borda cinza-lilás, texto 600, chevron */
.container.single .cg-box-accord-one details.cg-expand summary {
  border-color: #D4D0E4 !important;
  font-weight: 600;
}
.container.single .cg-box-accord-one details.cg-expand summary::after {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-left: 7px;
  vertical-align: 1px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23614BC3' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform 0.15s ease;
}
.container.single .cg-box-accord-one details.cg-expand[open] summary::after { transform: rotate(180deg); }

/* ---- Card aberto ("Ver mais infos"): texto e prós/contras ---- */
.container.single .cg-box-accord-one .cg-box-accord-content { padding: 16px 22px 8px; }
.container.single .cg-box-accord-one .cg-text { font-size: 15px; line-height: 1.65; color: #33314A; }
.container.single .cg-box-accord-one .cg-text p { margin: 0 0 10px; }

/* Sai a caixa roxa externa; ficam dois quadros tingidos lado a lado */
.container.single .cg-box-accord-one .product-box-pros-cons {
  border: 0;
  background: transparent;
  padding: 4px 22px 22px;
  margin-top: 0;
}
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row { gap: 16px; justify-content: flex-start; }
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row .cg-item-pros,
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row .cg-item-cons {
  flex: 1 1 0;
  max-width: none;
  margin: 0;
  padding: 18px 20px;
  border-radius: 10px;
  box-shadow: none;
}
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row .cg-item-pros { background: #EFF9F2; }
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row .cg-item-cons { background: #FDF1EF; }
/* Sai o "L" grosso */
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row .cg-item-pros::after,
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row .cg-item-cons::after { display: none; }

/* Títulos com ícone em vez do traço */
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pros-name,
.container.single .cg-box-accord-one .cg-pc-box-two .cg-cons-name {
  display: flex; align-items: center; gap: 8px;
  font-size: 15px; font-weight: 700; letter-spacing: 0.01em;
  color: #16142B; padding: 0; margin: 0 0 12px;
}
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pros-name::after,
.container.single .cg-box-accord-one .cg-pc-box-two .cg-cons-name::after { display: none; }
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pros-name::before,
.container.single .cg-box-accord-one .cg-pc-box-two .cg-cons-name::before {
  content: ""; width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0;
  background: center / 12px no-repeat;
}
.container.single .cg-box-accord-one .cg-pc-box-two .cg-pros-name::before {
  background-color: #1E8E4B;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E");
}
.container.single .cg-box-accord-one .cg-pc-box-two .cg-cons-name::before {
  background-color: #C0392B;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M7 12h10'/%3E%3C/svg%3E");
}

/* Itens: texto escuro, bolinha na cor do bloco */
.container.single .cg-box-accord-one .cg-pc-box-two ul li { font-size: 15px; line-height: 1.55; color: #33314A; padding-left: 16px; }
.container.single .cg-box-accord-one .cg-pc-box-two ul li:not(:last-child) { margin-bottom: 8px; }
.container.single .cg-box-accord-one .cg-pc-box-two ul li::before { position: absolute; left: 0; top: 0.62em; width: 6px; height: 6px; }
.container.single .cg-box-accord-one .cg-item-pros ul li::before { background-color: #1E8E4B; }
.container.single .cg-box-accord-one .cg-item-cons ul li::before { background-color: #C0392B; }

@media (max-width: 640px) {
  .container.single .cg-box-accord-one .cg-box-accord-content { padding: 14px 16px 6px; }
  .container.single .cg-box-accord-one .product-box-pros-cons { padding: 4px 16px 18px; }
  .container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row { flex-direction: column; gap: 12px; }
  .container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row .cg-item-pros,
  .container.single .cg-box-accord-one .cg-pc-box-two .cg-pc-row .cg-item-cons { flex: 1 1 auto; padding: 16px; }
}