/* =============================================================================================
   Prompt pages: "Animate this image" block (templates/prompt-studio-cta.html.twig).
   Desktop: clip left, text + buttons right. Phones: clip on top, buttons full width.
   The clip frame keeps a fixed 16:9 box, so the poster/video never shifts the layout.
   ============================================================================================= */
.prompt-studio-cta-panel {
  display: grid;
  grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
  align-items: center;
  gap: 1.5rem;
  padding: 1.2rem;
  border-radius: 14px;
  border: 1px solid rgba(255, 173, 38, .28);
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(255, 101, 51, .14), transparent 60%),
    linear-gradient(135deg, rgba(31, 25, 78, .55), rgba(10, 14, 50, .55));
}
.prompt-studio-cta__media { position: relative; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: #120c33;
  box-shadow: 0 18px 44px -24px rgba(255, 95, 43, .7), 0 0 0 1px rgba(255, 255, 255, .08); }
.prompt-studio-cta__video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; background: #120c33; }
.prompt-studio-cta__badge { position: absolute; left: 8px; bottom: 8px; padding: 2px 9px; border-radius: 999px; font-size: .7rem; font-weight: 600;
  letter-spacing: .02em; color: #fff; background: rgba(10, 6, 34, .72); border: 1px solid rgba(255, 255, 255, .14); pointer-events: none; }
.prompt-studio-cta__text { margin: 0 0 1rem; color: rgba(255, 255, 255, .74); font-size: .95rem; line-height: 1.6; }
.prompt-studio-cta__text a { color: #ffb326; }
.prompt-studio-cta__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.prompt-studio-cta__primary { white-space: nowrap; }
.btn.prompt-studio-cta__secondary { --bs-btn-color: rgba(255, 255, 255, .88); --bs-btn-hover-color: #fff; font-size: .9rem; }

@media (max-width: 767px) {
  .prompt-studio-cta-panel { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 1rem; }
  .prompt-studio-cta__actions { flex-direction: column; align-items: stretch; }
  .prompt-studio-cta__actions .btn { width: 100%; }
}