/* SpeakClub — Página Para Empresas (/para-empresas/)
   Réplica fiel de https://speakclub.com.br/para-empresas/ (medidas do DOM a 1440px).
   Reaproveita as classes m-* de pages/metodo.css. */

/* ---- Ajustes do hero ---- */
.e-hero .m-hero__inner { min-height: 352px; }
.e-hero .m-hero__media { margin-left: clamp(0rem, 11.9vw, 10.7rem); width: min(100%, 358px); }
.e-hero .m-hero__title { max-width: 620px; line-height: 1.18; }

/* ============ Faixa de fotos em marquee ============ */

.e-strip {
  overflow: hidden;
  margin-top: clamp(2rem, 4.2vw, 3.75rem);
}
.e-strip__track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: e-marquee 40s linear infinite;
}
.e-strip__track img {
  width: min(64vw, 919px);
  height: auto;
  border-radius: 15px;
}
@keyframes e-marquee {
  to { translate: calc(-50% - 10px) 0; }
}
@media (prefers-reduced-motion: reduce) {
  .e-strip__track { animation: none; }
}

/* ============ Dores (pílulas largas) ============ */

/* Título da intro com a largura do site (quebra em 3 linhas). */
.e-hero ~ .m-intro .m-intro__title,
.m-intro .m-intro__title { max-width: 728px; margin-inline: auto; }

.e-pains {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  width: min(100%, 1140px);
  margin: clamp(2rem, 4.2vw, 3.75rem) auto 0;
  text-align: left;
}
.e-pain {
  padding: 16px 20px;
  background: var(--c-blue-08);
  border-radius: 38px;
  font-size: clamp(1.0625rem, 1.4vw, 1.25rem);
  font-weight: var(--fw-semibold);
  color: var(--c-ink);
}

/* ============ Treinamentos (texto corrido) ============ */

.e-copy {
  width: min(100%, 1140px);
  margin-inline: auto;
  text-align: left;
}
.e-copy p { margin-top: var(--sp-3); color: var(--c-ink); line-height: var(--lh-body); }

/* ============ Passos (4 fotos + caixas) ============ */

.e-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  width: min(100%, 1100px);
  margin: clamp(2.5rem, 4.9vw, 4.4rem) auto 0;
}

/* Selo azul com número branco (variação do selo lima do Método). */
.m-step__num--blue { background: var(--c-blue); color: var(--c-white); }

/* ============ Card Soluções corporativas ============ */

.e-card {
  display: grid;
  grid-template-columns: minmax(280px, 545px) 1fr;
  align-items: stretch;
  width: min(100%, 1120px);
  margin: clamp(2.5rem, 4.9vw, 4.4rem) auto 0;
}
.e-card__photo {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 300px;
  object-fit: cover;
  border-radius: 15px 0 0 15px;
}
.e-card__panel {
  background: #E0E1FF;
  border-radius: 0 15px 15px 0;
  padding: 39px;
  text-align: left;
}
.e-card__title { font-size: 1.625rem; font-weight: var(--fw-semibold); color: var(--c-ink); }

.e-checklist { display: flex; flex-direction: column; gap: var(--sp-2); margin-top: var(--sp-3); }
.e-checklist li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: var(--c-ink-soft);
  line-height: 1.5;
}
.e-checklist li::before {
  content: '';
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  margin-top: 2px;
  background: url('../../icons/check-circle.svg') center / contain no-repeat;
}
.e-checklist strong { color: var(--c-ink-soft); font-weight: var(--fw-bold); }

/* ============ Logos (marquee) ============ */

.e-logos {
  position: relative;
  overflow: hidden;
  margin-top: clamp(2rem, 4.2vw, 3.75rem);
  padding-inline: 56px;
}
.e-logos__track {
  display: flex;
  align-items: center;
  gap: 120px;
  width: max-content;
  animation: e-marquee 30s linear infinite;
}
.e-logos__track img { max-height: 90px; width: auto; max-width: 258px; object-fit: contain; }
.e-logos__arrow {
  position: absolute;
  top: 50%;
  translate: 0 -50%;
  width: 28px;
  height: 28px;
}
.e-logos__arrow--left { left: 8px; }
.e-logos__arrow--right { right: 8px; }

/* ============ Metodologia (3 cartões) ============ */

.e-met {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  width: min(100%, 1120px);
  margin: clamp(2rem, 4.2vw, 3.75rem) auto 0;
}
.e-met__card {
  border: 2px solid var(--c-ink);
  padding: 37px 24px 24px;
  min-height: 263px;
  text-align: left;
}
.e-met__icon { display: block; width: 44px; height: 44px; background: var(--c-blue); }
.e-met__title {
  margin-top: var(--sp-3);
  font-size: clamp(1.35rem, 1.95vw, 1.75rem);
  font-weight: var(--fw-bold);
  color: var(--c-ink);
  max-width: 12ch;
}

/* ============ Balão escuro (CTA final) ============ */

.e-balloon-wrap { padding-top: clamp(3rem, 5.5vw, 5rem); }
.e-balloon {
  background: var(--c-ink-soft);
  border-radius: var(--radius-lg);
  padding: clamp(2rem, 4.5vw, 4rem);
  text-align: center;
}
.e-balloon__title {
  font-size: clamp(1.75rem, 2.85vw, 2.5625rem);
  font-weight: var(--fw-regular);
  color: var(--c-white);
  line-height: 1.1;
}
.e-balloon__title strong { font-weight: var(--fw-bold); }
.e-balloon__btn {
  display: inline-block;
  margin-top: var(--sp-3);
  padding: 12px 24px;
  background: var(--c-lime);
  color: var(--c-ink);
  font-size: 1.0625rem;
  font-weight: var(--fw-medium);
  border-radius: var(--radius-pill);
  transition: filter var(--dur) var(--ease);
}
.e-balloon__btn:hover { filter: brightness(0.94); }
.e-balloon__tail { display: block; margin: -1px auto 0; }

/* ============ Responsivo ============ */

@media (max-width: 1000px) {
  .e-steps { grid-template-columns: repeat(2, 1fr); }
  .e-met { grid-template-columns: 1fr; }
  .e-met__card { min-height: 0; }
}

@media (max-width: 760px) {
  .e-hero .m-hero__media { margin-left: 0; justify-self: center; }
  .e-card { grid-template-columns: 1fr; }
  .e-card__photo { border-radius: 15px 15px 0 0; min-height: 220px; }
  .e-card__panel { border-radius: 0 0 15px 15px; }
  .e-pains { gap: 12px; }
}

@media (max-width: 560px) {
  .e-steps { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .e-pains { grid-template-columns: 1fr; }
}

/* Máscaras dos ícones da Metodologia. */
.e-met__icon--smile { mask: url('../../icons/s-cool.svg') center / contain no-repeat; -webkit-mask: url('../../icons/s-cool.svg') center / contain no-repeat; }
.e-met__icon--badge { mask: url('../../icons/badge-check.svg') center / contain no-repeat; -webkit-mask: url('../../icons/badge-check.svg') center / contain no-repeat; }
.e-met__icon--star  { mask: url('../../icons/msg-star.svg') center / contain no-repeat; -webkit-mask: url('../../icons/msg-star.svg') center / contain no-repeat; }
