/* ==========================================================================
   livialichote.com.br — nossos ajustes (não vem do WordPress)
   ========================================================================== */

html,
body {
  overflow-x: hidden;
  max-width: 100%;
}

.elementor-heading-title,
h1, h2, h3, h4 {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

/* --------------------------------------------------------------------------
   MOBILE (<= 767px)
   O design tem larguras fixas em px (heading 415px, containers 435/465px…)
   que não foram tornadas responsivas e vazam em telas < ~480px.
   Correção: widgets voltam a fluir dentro da coluna (width:auto) e nada
   passa de 100% do pai. NÃO mexemos em --width/flex dos containers.
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  /* containers: só limitar, sem forçar largura (não quebra o flex) */
  .elementor-element.e-con {
    max-width: 100% !important;
  }

  /* widgets: ignorar largura fixa em px, fluir dentro da coluna */
  .elementor-element.elementor-widget {
    width: auto !important;
    max-width: 100% !important;
  }
  .elementor-widget > .elementor-widget-container {
    max-width: 100% !important;
  }

  /* títulos gigantes do design → cabem na tela */
  .elementor-widget-heading .elementor-heading-title {
    font-size: clamp(1.4rem, 6.5vw, 2rem) !important;
    line-height: 1.22 !important;
  }
}

/* ==========================================================================
   Depoimentos — avaliações reais do Google (nossa seção, sem widget externo)
   ========================================================================== */
.lr-reviews {
  --lr-teal: #004751;
  --lr-accent: #0DA07F;
  --lr-star: #FBBC05;
  max-width: 1120px;
  margin: 0 auto;
  padding: 8px 16px 4px;
  font-family: "Roboto", "Helvetica", Arial, sans-serif;
}

.lr-summary {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 28px;
  color: var(--lr-teal);
}
.lr-summary .lr-g-lg svg { width: 26px; height: 26px; display: block; }
.lr-avg { font-family: "Raleway", sans-serif; font-weight: 700; font-size: 1.6rem; line-height: 1; }
.lr-count { font-size: .95rem; opacity: .8; }

.lr-stars { color: var(--lr-star); letter-spacing: 1px; font-size: 1rem; white-space: nowrap; }
.lr-stars-empty { color: #d9e3e3; }

.lr-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.lr-card {
  background: #fff;
  border: 1px solid #e3efef;
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 10px 30px rgba(0, 71, 81, .06);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lr-card-head { display: flex; align-items: center; gap: 12px; }
.lr-avatar {
  width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: 0 0 44px;
}
.lr-avatar-fallback {
  display: flex; align-items: center; justify-content: center;
  background: var(--lr-accent); color: #fff; font-family: "Raleway", sans-serif;
  font-weight: 700; font-size: 1.1rem;
}
.lr-who { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.lr-name {
  font-family: "Raleway", sans-serif; font-weight: 600; color: var(--lr-teal);
  font-size: .98rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.lr-date { font-size: .8rem; color: #7a8a8a; }
.lr-card-head .lr-g svg { display: block; opacity: .9; }
.lr-text { margin: 0; color: #3f5453; font-size: .93rem; line-height: 1.6; }

.lr-actions {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; margin-top: 30px;
}
.lr-btn {
  display: inline-block; padding: 13px 26px; border-radius: 999px;
  font-family: "Raleway", sans-serif; font-weight: 600; font-size: .9rem;
  text-decoration: none; letter-spacing: .3px;
  background: var(--lr-accent); color: #fff; transition: opacity .2s;
}
.lr-btn:hover { opacity: .88; }
.lr-btn-ghost { background: transparent; color: var(--lr-teal); box-shadow: inset 0 0 0 1.5px var(--lr-teal); }

@media (max-width: 1024px) { .lr-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .lr-grid { grid-template-columns: 1fr; } .lr-reviews { padding-left: 8px; padding-right: 8px; } }

/* h1 acessível/SEO fora da tela (sub-páginas) */
.sr-only-h1 {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}
