/* AI Solutions · Módulo: banner de fundos, CTA final com o feixe que converge no botão e agenda Calendly. Precisa de /assets/js/calendly.js. */
/* =========================================================
   Fundos europeus
   ========================================================= */
.fundos { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem 1.6rem; align-items: center; margin: 0 var(--margem); padding: 22px 26px; border-radius: 18px; border: 1px solid rgba(107, 83, 249, .35); background: rgba(17, 0, 67, .55); }
.fundos::before { content: ""; position: absolute; left: 8%; right: 8%; top: -1px; height: 1px; background: linear-gradient(90deg, rgba(107, 83, 249, 0), #e4dcff 40%, rgba(107, 83, 249, 0)); box-shadow: 0 0 10px 1px rgba(107, 83, 249, .6); }
.fundos__icone { width: 42px; height: 42px; padding: 9px; border-radius: 12px; color: #cfc6ff; background: rgba(107, 83, 249, .16); border: 1px solid rgba(107, 83, 249, .35); }
.fundos__texto { margin: 0; color: var(--texto-2); font-size: .95rem; }
.fundos__texto b { display: block; color: var(--luz); font-family: var(--f-display); font-stretch: 112.5%; font-weight: 660; font-size: 1.06rem; margin-bottom: 2px; }
/* =========================================================
   Contacto: o feixe converge no botão, a agenda por baixo
   ========================================================= */
.contacto { padding: clamp(72px, 11vh, 120px) var(--margem) var(--sec-y); text-align: center; }
.contacto > * { position: relative; z-index: 2; }
.contacto__titulo { margin: 0 auto; max-width: 20ch; font-family: var(--f-display); font-stretch: 112.5%; font-weight: 760; font-size: clamp(1.95rem, 3vw, 2.75rem); line-height: 1.06; letter-spacing: -.028em; text-wrap: balance; }
.contacto__texto { margin: 1rem auto 0; max-width: 36rem; color: var(--texto-2); font-size: var(--t-lead); line-height: 1.5; text-wrap: pretty; }
.contacto__feixe { position: relative; z-index: 3; display: grid; place-items: center; height: 120px; margin-top: 18px; }
.flare--cta { left: 50%; top: 50%; }
/* na homepage (html.gl) quem desenha o feixe é o WebGL; nas outras páginas fica a versão CSS */
.gl .flare--cta { opacity: 0; }
.flare--cta .flare__linha { width: 100vw; margin-left: -50vw; }
.no-gl .flare--cta { opacity: 1; }
.botao--orb {
  position: relative; min-height: 60px; padding: 0 2.2em; font-size: 1.1rem; color: var(--indigo); border: 2px solid transparent;
  background: linear-gradient(var(--luz), var(--luz)) padding-box, conic-gradient(from var(--ang), #F320F3, #4125EB, #fff, #6B53F9, #F320F3) border-box;
  animation: roda 5s linear infinite paused;
}
.contacto.is-visivel .botao--orb { animation-play-state: running; }
.botao--orb:hover { background: linear-gradient(#fff, #fff) padding-box, conic-gradient(from var(--ang), #F320F3, #4125EB, #fff, #6B53F9, #F320F3) border-box; }
.no-gl .botao--orb { box-shadow: 0 0 50px 8px rgba(107, 83, 249, .45); }
@keyframes roda { to { --ang: 360deg; } }
.contacto__desce { display: block; width: 2px; height: 44px; margin: -8px auto 0; background: linear-gradient(180deg, rgba(228, 220, 255, .9), rgba(107, 83, 249, .15)); box-shadow: 0 0 10px 1px rgba(107, 83, 249, .6); transform-origin: 50% 0; transform: scaleY(var(--d, 1)); }
.agenda {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); text-align: left; max-width: 1080px; margin: 0 auto;
  border-radius: 22px; border: 1px solid rgba(107, 83, 249, .42); background: var(--superficie); overflow: hidden;
  box-shadow: 0 40px 90px -40px rgba(0, 0, 0, .8); transition: box-shadow .8s var(--ease-out);
}
.agenda.is-acesa { box-shadow: 0 0 0 1px rgba(228, 220, 255, .55), 0 0 60px -6px rgba(107, 83, 249, .7), 0 40px 90px -40px rgba(0, 0, 0, .8); }
.agenda__lado { display: flex; flex-direction: column; align-items: flex-start; padding: 30px 28px; border-right: 1px solid var(--traco); }
.agenda__logo { width: 84px; height: 84px; margin-bottom: 20px; }
.agenda__formato { margin: 0 0 18px; font-family: var(--f-display); font-stretch: 112.5%; font-weight: 700; font-size: 1.3rem; line-height: 1.2; }
.agenda__formato span { display: block; margin-top: 2px; font-family: var(--f-texto); font-weight: 500; font-size: .92rem; color: var(--texto-2); }
.agenda__rotulo { margin: 0 0 8px; font-weight: 600; font-size: .95rem; }
.agenda__pontos { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 7px; font-size: .95rem; color: var(--texto-2); }
.agenda__pontos li { position: relative; padding-left: 24px; }
.agenda__pontos li::before { content: ""; position: absolute; left: 0; top: .8em; width: 14px; height: 1px; background: #cfc6ff; }
.agenda__wa svg { color: #25D366; }
.agenda__calendly { position: relative; min-height: 700px; background: var(--superficie); }
.agenda__calendly iframe { display: block; width: 100%; height: 700px; border: 0; }
.agenda__espera { position: absolute; inset: 0; display: grid; place-content: center; padding: 24px; margin: 0; text-align: center; font-size: .92rem; color: var(--texto-2); }
.agenda__calendly.is-carregado .agenda__espera { display: none; }
.agenda__faixa { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; margin: 0; padding: 12px 20px; border-top: 1px solid var(--traco); font-size: .78rem; color: var(--texto-3); }
.agenda__faixa span { display: inline-flex; align-items: center; gap: 16px; }
.agenda__faixa span + span::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: #cfc6ff; }
@media (max-width: 900px) {
  .agenda { grid-template-columns: 1fr; }
  .agenda__lado { border-right: 0; border-bottom: 1px solid var(--traco); padding: 22px 20px; }
  .agenda__logo { display: none; }
}
@media (max-width: 720px) {
  .fundos { grid-template-columns: 1fr; padding: 20px; }
  .contacto__feixe { height: 110px; }
  .agenda__calendly, .agenda__calendly iframe { min-height: 0; height: 660px; }
}
.reduce .botao--orb { animation: none; }

/* ---------- CTA final nas subpáginas (.contacto--sub): o feixe CSS estende-se com o scroll, sem JS ---------- */
@keyframes feixe-sub { from { transform: scaleX(0); opacity: .2; } to { transform: scaleX(1); opacity: 1; } }
@supports (animation-timeline: view()) {
  html:not(.reduce) .contacto--sub .flare--cta .flare__linha { animation: feixe-sub linear both; animation-timeline: view(); animation-range: entry 20% cover 42%; }
}
.contacto--sub { padding-top: var(--sec-y); }
