/* ============================================================================
   CARDUME — Casting de Palestrantes (página própria)
   Consome tokens.css + cardume-animations.css + landing.css, nessa ordem.
   Reaproveita nav, .btn, .section, .shell, .eyebrow, .lead, .section--rest e
   o rodapé tal como estão na landing. Aqui só entra o que é específico desta
   página: o herói estático, a grade de cards de palestrante e o painel de
   "outros temas". Sem GSAP/ScrollTrigger/canvas de criaturas de propósito —
   a página não tem a descida do oceano, então não precisa da biblioteca
   inteira só para o nav ganhar sombra ao rolar (isso o landing.js já resolve
   sozinho, sem GSAP, no fallback dele).
   ============================================================================ */

/* ---- Herói (estático, sem parallax de scroll) -----------------------------
   O fundo é o .cd-deep da própria lib (radial abissal, já pronto): na home
   ele sempre é sobrescrito para dar lugar ao .ocean-grad contínuo, mas aqui
   não existe descida nenhuma para continuar, então o gradiente dele entra
   como está, sem reescrever background. */
.pcast-hero{padding-top:calc(var(--nav-h) + clamp(3.5rem,9vh,6rem))}
.pcast-hero__inner{max-width:760px}
/* nadadores discretos, decoração 100% CSS (cardume-animations.css), sem canvas */
.pcast-hero .cd-fish-cross{opacity:.7}

/* ---- Grupo por nicho (Educação, e no futuro outras áreas) ---------------- */
.palestrantes__grupo + .palestrantes__grupo{margin-top:var(--space-6)}
.palestrantes__grupo-title{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-wide);
  font-size:var(--step--1);color:var(--rest-accent);margin:0 0 var(--space-3)}

/* ---- Grade de cards -------------------------------------------------------
   auto-fill + minmax: a grade se reorganiza sozinha conforme entram nomes
   novos, sem precisar mexer no CSS a cada palestrante incluído. */
.palestrantes__grid{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--space-3)}
.palestrante{position:relative;display:flex;flex-direction:column;background:var(--rest-card);
  border:1px solid var(--rest-border);border-radius:var(--r-2);overflow:hidden;transition:transform .2s,border-color .2s}
.palestrante:hover{border-color:color-mix(in srgb,var(--rest-accent) 45%,transparent);transform:translateY(-3px)}
.palestrante__foto{position:relative;aspect-ratio:3/4;background:var(--c-abyss-700)}
.palestrante__foto img{width:100%;height:100%;object-fit:cover}
.palestrante__badge{position:absolute;left:.7rem;top:.7rem;font-family:var(--font-mono);text-transform:uppercase;
  letter-spacing:.08em;font-size:.68rem;color:var(--accent-ink);background:var(--c-cyan-300);
  padding:.35em .7em;border-radius:var(--r-pill);line-height:1}
.palestrante__body{padding:var(--space-3)}
.palestrante__body h4{font-size:var(--step-1);color:var(--rest-ink);margin:0 0 .3em}
.palestrante__body p{font-size:var(--step--1);color:var(--rest-ink-dim);margin:0;line-height:1.45}

/* ---- Painel "outros temas" ------------------------------------------------
   Mesmo fundo abissal do herói (.cd-deep, sem reescrever), com o coral/kelp/
   bolhas decorativos do #contato da home (100% CSS, sem JS). Nome próprio
   porque esta seção não é o contato final da página, é a ponte para quem
   quer um tema fora do casting exclusivo. */
.temas-cta{text-align:center}
.temas-cta__inner{max-width:760px;margin-inline:auto}
.temas-cta__title{font-size:var(--t-h2);margin-bottom:var(--space-3)}
.temas-cta .lead{margin-inline:auto}
.temas-cta__cta{margin-top:var(--space-4)}
.temas-cta__hint{font-size:var(--step--1);color:var(--text-dim);margin-top:var(--space-2)}

@media (max-width:560px){
  .palestrantes__grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
}