/** Shopify CDN: Minification failed

Line 7:0 Unexpected "<"
Line 1248:0 Unexpected "<"

**/
<style>
/* Wrapper */
.results__container {
  font-family: Arial, sans-serif;
  line-height: 1.8;
  color: #333;
}

/* Headings & text */
.results__title {
  color: #111;
  font-size: 20px;
  margin: 0 0 8px;
  font-weight: 700;
}

.results__subtitle {
  color: #111;
  font-size: 16px;
  margin: 0 0 12px;
  font-weight: 600;
}

/* Card (painel) */
.results__panel {
  background: #f0fbfd;
  border: 1px solid #009bb8;
  border-radius: 12px;
  padding: 18px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
}

/* Eyebrow (título do card) */
.results__panel-eyebrow {
  color: #009bb8;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0 0 12px;
  font-weight: 700;
}

/* List */
.results__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.results__item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 8px 0;
  font-size: 15px;
}

/* Ícone ✓ igual ao .spf-list__icon (via pseudo-elemento) */
.results__item::before {
  content: "✓";
  color: #009bb8;
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
  margin-top: 2px;
}

/* Mobile tweaks */
@media (max-width: 480px) {
  .results__title { font-size: 19px; }
  .results__item { font-size: 14px; }
  .results__panel { padding: 16px; }
}

/* === HERO SECTION –=== */
.hero {
  background-color: #ffffff;
  padding: 13px 20px;
}

.hero__container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
  flex-direction: row-reverse; /* imagem à esquerda, texto à direita */
}

.hero__image-block {
  flex: 0 0 500px;
  max-width: 500px;
  text-align: center;
}

.hero__image {
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.hero__content {
  flex: 1;
  max-width: 600px;
  text-align: left;
}

.hero__title {
  font-family: 'EB Garamond', serif;
  font-size: 34px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 5px;
  line-height: 1.3;
}

.hero__text {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .hero__container {
    flex-direction: column; /* empilha: imagem primeiro, depois texto */
    text-align: center;
    gap: 5px;
  }
  .hero__image-block,
  .hero__content {
    flex: 0 0 322px;
    max-width: 100%;
    margin: 0;
    padding: 7;
  }
  .hero__title {
    font-size: 26px;
    margin-top: 0;
    margin-bottom: 8px;
  }
  .hero__text {
    font-size: 15px;
    margin-top: 0;
  }
}
/* === SECTION DILEMMA === */
.dilemma {
  background-color: #ffffff;
  padding: 13px 20px;            /* padding uniforme */
}

.dilemma__container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;                     /* gap uniforme */
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
  flex-direction: row;   /* desktop: imagem à direita, texto à esquerda */
}

.dilemma__image-block {
  flex: 0 0 500px;
  max-width: 500px;
  text-align: center;
}

.dilemma__image {
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.dilemma__content {
  flex: 1;
  max-width: 600px;
  text-align: left;
}

.dilemma__title {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 12px;
  line-height: 1.4;
}

.dilemma__text {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .dilemma__container {
    flex-direction: column;    /* empilha: imagem primeiro, depois texto */
    text-align: center;
  }
  .dilemma__image-block,
  .dilemma__content {
    max-width: 100%;
    flex: 0 0 322px;
  }
  .dilemma__title {
    font-size: 24px;
  }
  .dilemma__text {
    font-size: 15px;
  }
}

  /* === BEFORE & AFTER SECTION === */
.ba {
  background-color: #ffffff;
  padding: 13px 20px; /* padding uniforme (padrão do seu CSS) */
}

.ba__container {
  max-width: 1200px;
  margin: 0 auto;
}

/* Header */
.ba__header {
  text-align: center;
  margin-bottom: 12px;
}

.ba__title {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  line-height: 1.3;
  margin: 0 0 6px;
}

.ba__subtitle {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
  margin: 0;
}

/* Intro Copy */
.ba__intro {
  max-width: 900px;
  margin: 12px auto 16px;
  text-align: center;
}

.ba__question {
  font-family: 'EB Garamond', serif;
  font-size: 20px;
  font-weight: bold;
  color: #000000;
  line-height: 1.4;
  margin: 0 0 6px;
}

.ba__support {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
  margin: 0;
}

/* Scroller */
.ba__scroller {
  position: relative;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  padding-bottom: 6px; /* espaço para sombra não cortar */
}

.ba__list {
  display: flex;
  gap: 12px; /* gap uniforme */
  list-style: none;
  padding: 0;
  margin: 0;
}

.ba__item {
  flex: 0 0 360px; /* largura de card no desktop */
  scroll-snap-align: start;
}

/* Card */
.ba-card {
  background: #f9fbfa;
  border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

/* Media (figure com 2 imagens lado a lado) */
.ba-card__media {
  padding: 12px 12px 0 12px;
}

.ba-figure {
  display: grid;
  grid-template-columns: 1fr 1fr; /* BEFORE | AFTER */
  gap: 8px;
  margin: 0;
  position: relative;
}

.ba-figure__image {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-fit: cover;
  display: block;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  aspect-ratio: 1 / 1; /* mantém 1:1 como nos outros grids */
}

/* Labels BEFORE/AFTER */
.ba-figure__caption {
  position: absolute;
  inset: 8px 8px auto 8px; /* top e laterais, sem ocupar fluxo */
  pointer-events: none;
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.ba-figure__label {
  font-family: 'EB Garamond', serif;
  font-size: 12px;
  font-weight: bold;
  color: #ffffff;
  background: rgba(0,0,0,0.55);
  padding: 4px 8px;
  border-radius: 999px;
  backdrop-filter: saturate(140%) blur(2px);
}

.ba-figure__label--before { }
.ba-figure__label--after  { }

/* Conteúdo do card */
.ba-card__content {
  padding: 12px 16px 16px;
  display: grid;
  grid-template-rows: auto auto 1fr auto; /* título, rating, review (cresce), author */
  gap: 8px;
}

.ba-card__title {
  font-family: 'EB Garamond', serif;
  font-size: 18px;
  font-weight: bold;
  color: #000000;
  margin: 0;
  line-height: 1.35;
}

/* Rating */
.ba-card__rating {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  background: #f7fbf8;
  border-radius: 999px;
  padding: 6px 10px;
  width: fit-content;
  border: 1px solid rgba(0,0,0,0.06);
}

.ba-card__rating-value {
  font-family: 'EB Garamond', serif;
  font-weight: bold;
  font-size: 14px;
  color: #000000;
}

.ba-card__rating-note {
  font-family: 'EB Garamond', serif;
  font-size: 12px;
  color: #009bb8; /* acento padrão */
}

/* Review e autor */
.ba-card__review {
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  color: #000000;
  line-height: 1.6;
  margin: 0;
}

.ba-card__author {
  font-family: 'EB Garamond', serif;
  font-size: 14px;
  color: #333333;
  font-style: italic;
  margin: 0;
  justify-self: end;
}

/* Navegação (Prev/Next) */
.ba__nav {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 12px;
}

.ba__btn {
  appearance: none;
  border: 1px solid rgba(0,0,0,0.08);
  background: #ffffff;
  border-radius: 999px;
  padding: 8px 14px;
  font-family: 'EB Garamond', serif;
  font-size: 14px;
  line-height: 1;
  color: #000000;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.ba__btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.08);
  border-color: rgba(0,0,0,0.12);
}

.ba__btn:active {
  transform: translateY(0);
  box-shadow: 0 3px 10px rgba(0,0,0,0.06);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
  .ba__item { flex-basis: 320px; }
  .ba-card__title { font-size: 17px; }
}

@media (max-width: 768px) {
  .ba__title { font-size: 24px; }
  .ba__subtitle { font-size: 15px; }

  .ba__question { font-size: 18px; }
  .ba__support { font-size: 15px; }

  .ba__item { flex-basis: 85%; } /* card ocupa a maior parte da tela no mobile */
  .ba-card__review { font-size: 14px; }
  .ba-card__author { font-size: 13px; }

  .ba-figure__label { font-size: 11px; }
}

/* ===== OPCIONAL: setinhas fixas sobre o scroller no desktop (mesmo padrão visual) ===== */
@media (hover: hover) and (pointer: fine) {
  .ba__nav {
    position: relative;
    margin-top: 8px;
  }
}

/* === SOLUTION SECTION 3 – West Month Triple Lipt Peptide Anti-Aging Cream === */
.solution {
  background-color: #ffffff;
  padding: 13px 20px;            /* padding uniforme */
}

.solution__container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;                     /* gap uniforme */
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
  flex-direction: row-reverse;           /* desktop: imagem à esquerda, texto à direita */
}

.solution__image-block {
  flex: 0 0 500px;
  max-width: 500px;
  text-align: center;
}

.solution__image {
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.solution__content {
  flex: 1;
  max-width: 600px;
  text-align: left;
}

.solution__title {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 12px;
  line-height: 1.4;
}

.solution__text {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .solution__container {
    flex-direction: column;    /* empilha: imagem primeiro, depois texto */
    text-align: center;
  }
  .solution__image-block,
  .solution__content {
    max-width: 100%;
    flex: 0 0 322px;
  }
  .solution__title {
    font-size: 24px;
  }
  .solution__text {
    font-size: 15px;
  }
}
/* === SECTION BENEFITS === */
.benefit {
  background-color: #ffffff;
  padding: 13px 20px;           /* padding uniforme */
}

.benefit__container {
  max-width: 1200px;
  margin: 0 auto;
}

.benefit__container {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Cada item em flex com alternância no desktop */
.benefit__item {
  display: flex;
  align-items: center;
  gap: 12px;                   /* gap uniforme */
}

/* Itens ímpares em row-reverse (imagem à direita) */
.benefit__item:nth-child(odd) {
  flex-direction: row-reverse;
}

/* Itens pares em row (imagem à esquerda) */
.benefit__item:nth-child(even) {
  flex-direction: row;
}

.benefit__image-block {
  flex: 0 0 400px;
  max-width: 400px;
  text-align: center;
}

.benefit__image {
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.benefit__text-block {
  flex: 1;
  max-width: 700px;
  text-align: left;
}

.benefit__subtitle {
  font-family: 'EB Garamond', serif;
  font-size: 22px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 12px;
  line-height: 1.3;
}

.benefit__text {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .benefit__container {
    gap: 16px;
  }
  .benefit__item {
    display: flex;
    align-items: center;
    gap: 12px;                   /* gap uniforme */
  }
  /* Empilha todos os itens no mobile */
  .benefit__item:nth-child(odd),
  .benefit__item:nth-child(even) {
    flex-direction: column;
  }

  .benefit__item {
    text-align: center;
    gap: 12px;
  }

  .benefit__image-block,
  .benefit__text-block {
    max-width: 100%;
  }

  .benefit__subtitle {
    font-size: 20px;
  }

  .benefit__text {
    font-size: 15px;
  }
}
/* === SECTION INGREDIENTS === */
.ingredient {
  background-color: #ffffff;
  padding: 13px 20px;              /* padding uniforme */
  text-align: center;
}

.ingredient__container {
  max-width: 1200px;
  margin: 0 auto;
}

.ingredient__title {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  grid-column: 1 / -1;
  justify-self: center;
  margin-bottom: 24px;
  
}

/* Grid de cards */
.ingredient__content {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 12px;                       /* gap uniforme */
}

/* Card individual */
.ingredient__item {
  background: #f7fbf8;
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  text-align: left;
  display: flex;
  flex-direction: column;         /* imagem acima, texto abaixo */
  align-items: center;
}

/* Imagem no topo do card */
.ingredient__image-block {
  width: 100%;
  aspect-ratio: 1 / 1;             /* mantém proporção 1:1 */
  overflow: hidden;
  border-radius: 12px;
  margin-bottom: 12px;
}

.ingredient__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Título e texto */
.ingredient__subtitle {
  font-family: 'EB Garamond', serif;
  font-size: 18px;
  font-weight: bold;
  color: #000000;
  margin: 8px 0;
  text-align: center;
}

.ingredient__text {
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  color: #000000;
  line-height: 1.6;
}

/* Divider */
.section-divider {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 24px auto 0;
  width: 80%;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .ingredient__title {
    font-size: 24px;
  }
  .ingredient__subtitle {
    font-size: 16px;
  }
  .ingredient__text {
    font-size: 14px;
  }
}
/* === SECTION RECOMMENDED === */
.recommended {
  background-color: #ffffff;
  padding: 13px 20px;             /* padding uniforme */
}

.recommended__container {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 12px;                     /* gap uniforme */
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
  flex-direction: row-reverse;           /* desktop: imagem à esquerda, texto à direita */
}

.recommended__image-block {
  flex: 0 0 400px;
  max-width: 400px;
  text-align: center;
}

.recommended__image {
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}

.recommended__content {
  flex: 1;
  max-width: 700px;
  text-align: left;
}

.recommended__title {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 12px;
  line-height: 1.4;
}

.recommended__text {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
  margin-bottom: 12px;
}

.recommended__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.recommended__item {
  position: relative;
  padding-left: 24px;
  margin-bottom: 8px;
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  color: #000000;
  line-height: 1.6;
}

.recommended__item::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 0;
  color: #009bb8;
  font-weight: bold;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .recommended__container {
    flex-direction: column;     /* empilha: imagem primeiro, depois texto */
    text-align: center;
    gap: 16px;
  }
  .recommended__image-block,
  .recommended__content {
    max-width: 100%;
    flex: 0 0 322px;
  }
  .recommended__title {
    font-size: 24px;
  }
  .recommended__text,
  .recommended__item {
    font-size: 14px;
  }
}
  /* === TIMELINE SECTION === */
.timeline {
  background-color: #ffffff;
  padding: 13px 20px;              /* padding uniforme */
  text-align: center;
}

.timeline__container {
  max-width: 1200px;
  margin: 0 auto;
}

.timeline__headline {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 5px;
}

.timeline__paragraph {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
  margin-bottom: 24px;
}

.timeline__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;                      /* gap uniforme */
}

.timeline__item {
  background: #f9fbfa;
  border-radius: 16px;
  padding: 16px;
  text-align: left;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;         /* imagem acima, texto abaixo */
  align-items: center;
}

.timeline__image-block {
  width: 100%;
  aspect-ratio: 1 / 1;           /* mantém proporção 1:1 */
  overflow: hidden;
  border-radius: 12px;
  margin-bottom: 12px;
}

.timeline__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.timeline__title {
  font-family: 'EB Garamond', serif;
  font-size: 18px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 8px;
}

.timeline__description {
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  color: #000000;
  line-height: 1.5;
}

/* Divider */
.section-divider {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 24px auto 0;
  width: 80%;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .timeline__headline {
    font-size: 24px;
  }
  .timeline__paragraph {
    font-size: 15px;
  }
  .timeline__title {
    font-size: 16px;
  }
  .timeline__description {
    font-size: 14px;
  }
}

/* === HOW TO USE SECTION === */
/* Ajuste para que os 3 cards fiquem sempre lado a lado no desktop */

/* Container de cards: força 3 colunas iguais */
.how-to-use__steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  max-width: 1200px;
  margin: 24px auto 0;
}

/* Cada cartão mantém seu estilo */
.how-to-use__step {
  background: #f7fbf8;
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: left;
}

.how-to-use__step .how-to-use__image {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 12px;
  margin-bottom: 12px;
}

.how-to-use__subtitle {
  font-family: 'EB Garamond', serif;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 8px;
  line-height: 1.4;
}

.how-to-use__step .how-to-use__text {
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  line-height: 1.6;
}

/* Mobile: volta a 1 coluna para cada card */
@media (max-width: 768px) {
  .how-to-use__steps {
    grid-template-columns: 1fr;
  }
  .how-to-use__subtitle {
    font-size: 16px;
  }
  .how-to-use__step .how-to-use__text {
    font-size: 14px;
  }
}



/* === SECTION TESTIMONIALS === */
.testimonials {
  background-color: #ffffff;
  padding: 13px 20px;              /* padding uniforme */
  text-align: center;
}

.testimonials__container {
  max-width: 1200px;
  margin: 0 auto;
  /* grid de cards */
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 12px;                        /* gap uniforme */
}

.testimonials__title {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  grid-column: 1 / -1;
  justify-self: center;
  margin-bottom: 24px;
}

/* Card individual */
.testimonials__card {
  background: #f9fbfa;
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;          /* imagem acima, texto abaixo */
  align-items: center;
  text-align: left;
}

/* Imagem no topo do card */
.testimonials__image-block {
  width: 100%;
  aspect-ratio: 1 / 1;             /* mantém proporção 1:1 */
  overflow: hidden;
  border-radius: 20px;
  margin-bottom: 12px;
}

.testimonials__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Quote e autor */
.testimonials__quote {
  font-family: 'EB Garamond', serif;
  font-size: 15px;
  font-style: italic;
  color: #000000;
  line-height: 1.6;
  margin: 0 0 12px;
}

.testimonials__author {
  font-family: 'EB Garamond', serif;
  font-size: 14px;
  color: #333333;
  font-style: italic;
  align-self: flex-end;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .testimonials__title {
    font-size: 24px;
  }
  .testimonials__quote {
    font-size: 14px;
  }
  .testimonials__author {
    font-size: 13px;
  }
}
/* === SECTION WHY WE’RE DIFFERENT === */
.diff {
  background-color: #ffffff;
  padding: 13px 20px;              /* padding uniforme */
}

.diff__container {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 12px;                     /* gap uniforme */
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
  flex-direction: row;            /* desktop: imagem à esquerda, texto à direita */
}

.diff__image-block {
  flex: 0 0 400px;
  max-width: 400px;
  text-align: center;
}

.diff__image {
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.diff__title {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 12px;
  line-height: 1.4;
}
.diff__content {
  flex: 1;
  max-width: 700px;
  text-align: left;
}
  
.diff__text {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
  margin-bottom: 12px;
}

/* Divider */
.section-divider {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 24px auto 0;
  width: 80%;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .diff__container {
    flex-direction: column;        /* empilha: imagem primeiro, depois texto */
    text-align: center;
    gap: 16px;
  }
  .diff__image-block,
  .diff__text {
    max-width: 100%;
    flex: 0 0 322px;
  }
  .diff__title {
    font-size: 24px;
  }
  .diff__text {
    font-size: 15px;
  }
}
/* === SECTION 11 – CLOSING === */
.closing {
  background-color: #ffffff;
  padding: 13px 20px;              /* padding uniforme */
}

.closing__container {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 12px;                      /* gap uniforme */
  max-width: 1200px;
  margin: 0 auto;
  flex-wrap: wrap;
  flex-direction: row-reverse;    /* desktop: imagem à direita, texto à esquerda */
}

.closing__image-block {
  flex: 0 0 400px;
  max-width: 400px;
  text-align: center;
}

.closing__image {
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.closing__content {
  flex: 1;
  max-width: 700px;
  text-align: left;
}

.closing__title {
  font-family: 'EB Garamond', serif;
  font-size: 30px;
  font-weight: bold;
  color: #000000;
  margin-bottom: 12px;
  line-height: 1.4;
}

.closing__text {
  font-family: 'EB Garamond', serif;
  font-size: 16px;
  color: #000000;
  line-height: 1.6;
  margin-bottom: 12px;
}

/* === RESPONSIVE (Mobile) === */
@media (max-width: 768px) {
  .closing__container {
    flex-direction: column;      /* empilha: imagem primeiro, depois texto */
    text-align: center;
    gap: 16px;
  }
  .closing__image-block,
  .closing__content {
    max-width: 100%;
    flex: 0 0 322px;
  }
  .closing__title {
    font-size: 24px;
  }
  .closing__text {
    font-size: 15px;
  }
}

</style>