/* ============================================================
   Palestras e eventos — página interna
   Mesma composição da página do AI Comms Operations: reaproveita os
   componentes .acx-* (hero, wrap, section, lead, statement, h2) de
   ai-comms.css; aqui ficam só as peças próprias desta página
   (carrosséis de keynotes e talks, "outros formatos", trajetória).
   Conteúdo e artes vêm do Speaker Kit.
   ============================================================ */

/* ---------- Hero ---------- */
.pls-title { font-size: clamp(2.8rem, 1.4rem + 3.6vw, 4.6rem); }
/* Foto em vez de arte: sem "lighten" (que sumia com o fundo preto da ilustração),
   começa no topo da página (a barra translúcida passa por cima) e esmaece à esquerda. */
.acx-hero-fig.pls-hero-fig { mix-blend-mode: normal; top: 0; right: 0; width: min(56%, 800px); }
.pls-hero-fig img { object-position: 50% 62%; opacity: 1; }

/* ---------- Carrossel ---------- */
.pls-carousel { margin-top: var(--space-5); }
.pls-track {
  display: flex;
  gap: var(--space-5);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  border-radius: var(--radius-xl);
}
.pls-track::-webkit-scrollbar { display: none; }
.pls-track:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
@media (prefers-reduced-motion: reduce) { .pls-track { scroll-behavior: auto; } }

.pls-slide {
  flex: 0 0 100%;
  min-width: 0;
  scroll-snap-align: start;
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  border-radius: var(--radius-xl);
  overflow: hidden;
}
.pls-slide:nth-child(even) { grid-template-columns: minmax(0, 1.22fr) minmax(0, .78fr); }
.pls-slide:nth-child(even) .pls-art { order: 2; }
.pls-slide--dark {
  color: #fff;
  background: radial-gradient(110% 120% at 0% 0%, rgba(28,167,255,.30), transparent 60%), radial-gradient(70% 100% at 100% 100%, rgba(240,136,58,.18), transparent 60%), linear-gradient(155deg, #14151a, #101114);
}
.pls-slide--light {
  background: var(--white);
  border: 1px solid var(--hairline);
  box-shadow: var(--shadow-card);
}

.pls-art { position: relative; min-height: 360px; background: #f1f3f6; }
.pls-slide--dark .pls-art { background: #000; }
.pls-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.pls-slide--dark .pls-art img { object-fit: contain; }
/* Arte que sangra o quadro inteiro (sem barras pretas), com foco no personagem */
.pls-art--sangra { overflow: hidden; }
.pls-slide--dark .pls-art--sangra img { object-fit: cover; }
/* O Povo vs IA: foco no robô vermelho, à esquerda do banco */
.pls-art--robo img { object-position: 0% 50%; transform: scale(1.5); transform-origin: 30% 61%; }
/* Reputação + IA: robô vitruviano em fundo claro (#f7f6f5, igual ao da arte, para a imagem
   se fundir ao quadro). A arte é mais larga que a coluna: fica centralizada e ampliada. */
.pls-slide--dark .pls-art--vitruv { background: #f7f6f5; overflow: hidden; }
.pls-art--vitruv img { max-width: none; inset: auto; left: -24%; top: 50%; width: 148%; height: auto; transform: translateY(-50%); object-fit: contain;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 91%, transparent 100%); mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 91%, transparent 100%); }

.pls-body { padding: var(--space-6) var(--space-7); display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.pls-pill {
  display: inline-flex;
  padding: 6px 14px;
  border-radius: var(--radius-pill);
  background: #79c9fa; /* mesmo azul das etiquetas do Speaker Kit */
  color: var(--haikai-black);
  font-size: 12.5px;
  font-weight: var(--fw-semibold);
  line-height: 1;
  margin-bottom: var(--space-4);
}
.pls-body h3 { font-size: clamp(1.7rem, 1.3rem + 1.4vw, 2.4rem); line-height: 1.05; margin-bottom: var(--space-3); }
.pls-slide--dark h3 { color: #fff; }
.pls-head {
  font-family: var(--font-display); font-weight: var(--fw-bold);
  font-size: 1.1rem; line-height: 1.3;
  color: var(--haikai-blue-ink);
  margin: 0 0 var(--space-4);
  max-width: 40ch;
}
.pls-slide--dark .pls-head { color: var(--haikai-blue); }
.pls-body p:not(.pls-head) { font-size: .92rem; line-height: 1.65; color: var(--gray-600); margin: 0 0 var(--space-3); }
.pls-slide--dark .pls-body p:not(.pls-head) { color: #d3d9e3; }

.pls-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: var(--space-2) 0 var(--space-3); padding: 0; }
.pls-chips li { border: 1px solid rgba(245,247,250,.3); border-radius: var(--radius-pill); padding: 6px 14px; font-size: 12.5px; color: #fff; }

.pls-meta {
  width: 100%;
  margin: var(--space-4) 0 0;
  padding-top: var(--space-4);
  border-top: 1px solid var(--hairline);
  display: grid;
  grid-template-columns: 6.5rem 1fr;
  gap: 8px var(--space-4);
}
.pls-slide--dark .pls-meta { border-top-color: rgba(255,255,255,.2); }
.pls-meta dt { font-size: .8rem; font-weight: var(--fw-semibold); color: var(--haikai-blue-ink); padding-top: 2px; }
.pls-slide--dark .pls-meta dt { color: var(--haikai-blue); }
.pls-meta dd { margin: 0; font-size: .9rem; line-height: 1.5; color: var(--haikai-black); }
.pls-slide--dark .pls-meta dd { color: #fff; }

.pls-link {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: var(--space-4);
  font-size: .9rem; font-weight: var(--fw-semibold);
  color: var(--haikai-blue-ink);
}
.pls-link svg { width: 16px; height: 16px; transition: transform var(--motion-base); }
.pls-link:hover svg { transform: translateX(4px); }

/* controles: bolinhas à esquerda, setas à direita */
.pls-controls { display: flex; align-items: center; justify-content: space-between; margin-top: var(--space-5); }
.pls-dots { display: flex; align-items: center; gap: 8px; }
.pls-dot {
  width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%;
  background: var(--gray-400); opacity: .5; cursor: pointer;
  transition: opacity var(--motion-base), transform var(--motion-base), background-color var(--motion-base);
}
.pls-dot.is-active { opacity: 1; background: var(--haikai-blue); transform: scale(1.3); }
.pls-dot:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
.pls-arrows { display: flex; gap: 10px; }
.pls-arrow {
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--white); color: var(--haikai-black);
  border: 1px solid var(--hairline);
  cursor: pointer;
  transition: background-color var(--motion-base), color var(--motion-base), border-color var(--motion-base), opacity var(--motion-base);
}
.pls-arrow svg { width: 18px; height: 18px; }
.pls-arrow:hover:not(:disabled), .pls-arrow:focus-visible { background: var(--haikai-blue); border-color: var(--haikai-blue); color: var(--haikai-black); outline: none; }
.pls-arrow:disabled { opacity: .35; cursor: default; }

/* ---------- Outros formatos ---------- */
.pls-mais { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--hairline); margin-top: var(--space-6); }
.pls-mais > div { padding-top: var(--space-5); }
.pls-mais > div:first-child { padding-right: var(--space-7); border-right: 1px solid var(--hairline); }
.pls-mais > div:last-child { padding-left: var(--space-7); }
.pls-mais h3 { font-size: 1.2rem; display: inline; margin-right: var(--space-3); }
.pls-mais-meta { font-size: .85rem; color: var(--gray-400); }
.pls-mais ul { list-style: none; margin: var(--space-4) 0 0; padding: 0; }
.pls-mais li { font-size: .95rem; line-height: 1.4; color: var(--haikai-black); padding: 11px 0; border-top: 1px solid var(--hairline); }
.pls-mais li a { color: var(--haikai-blue-ink); font-weight: var(--fw-medium); }
.pls-mais li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.pls-sobmedida {
  margin: var(--space-6) 0 0; padding: var(--space-5) var(--space-6);
  border-radius: var(--radius-xl); color: #fff;
  background: radial-gradient(110% 120% at 0% 0%, rgba(28,167,255,.34), transparent 60%), linear-gradient(155deg, #14151a, #101114);
  font-family: var(--font-display); font-size: clamp(1.05rem, .95rem + .5vw, 1.3rem); line-height: 1.3;
}
.pls-sobmedida b { color: var(--haikai-blue); font-weight: var(--fw-bold); }

/* ---------- Onde já estivemos ---------- */
.pls-onde { list-style: none; margin: var(--space-5) 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--space-7); }
.pls-onde li { font-size: .95rem; line-height: 1.45; color: var(--haikai-black); padding: 14px 0; border-top: 1px solid var(--hairline); }

/* ---------- Responsivo ---------- */
@media (max-width: 960px) {
  .pls-slide { grid-template-columns: 1fr; }
  .pls-slide:nth-child(even) { grid-template-columns: 1fr; }
  .pls-slide:nth-child(even) .pls-art { order: 0; }
  /* cada card com a altura do próprio conteúdo (sem esticar até o mais alto, o que abria um vão abaixo da arte) */
  .pls-track { align-items: flex-start; overflow-y: hidden; transition: height .3s ease; }
  .pls-art { min-height: 0; aspect-ratio: 16 / 10; }
  .pls-slide--dark .pls-art img { object-fit: cover; }
  .pls-art--robo img { transform-origin: 12% 61%; }
  .pls-art--vitruv img { left: 0; width: 100%; }
  .pls-body { padding: var(--space-6); }
  /* os cards ficam longos no mobile: bolinhas e setas sobem para o topo e acompanham a rolagem,
     em vez de ficarem lá embaixo, depois de mais de uma tela de texto */
  .pls-carousel { display: flex; flex-direction: column; }
  .pls-controls { order: -1; position: sticky; top: 72px; z-index: 5; margin: 0 0 var(--space-3); padding: 10px 0; background: color-mix(in srgb, var(--haikai-offwhite) 92%, transparent); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
  .pls-mais { grid-template-columns: 1fr; }
  .pls-mais > div:first-child { padding-right: 0; border-right: 0; padding-bottom: var(--space-5); }
  .pls-mais > div:last-child { padding-left: 0; border-top: 1px solid var(--hairline); }
  .pls-onde { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .pls-title { font-size: 2.8rem; }
  .acx-hero-fig.pls-hero-fig { position: relative; top: auto; right: auto; width: 100%; }
  .pls-meta { grid-template-columns: 1fr; gap: 2px; }
  .pls-meta dd { margin-bottom: var(--space-3); }
}
