/* The second call to action, Elly asks the visitor: a white card on the seam where Make it yours meets the night of Participation, the same size and place as the meeting card but with no face.
   The invitation on the left, its title, the 15 min pill and the one button under them (the captain, 5 Oct); Elly's window on the right opens the conversation with the visitor, the three objectives as the answers she offers.
   It is still on every screen: the finished card, with no animation and no Replay */
.elly-asks .ask-card { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: 40px 56px; max-width: 1040px; margin: 0 auto; padding: 40px 44px; border-radius: 26px; background: #fff; box-shadow: 0 0 0 1px rgba(39, 27, 54, .06), 0 36px 72px -28px rgba(39, 27, 54, .6); }
.ask-act { display: grid; justify-items: start; gap: 16px; }
.ask-title { font-size: 30px; font-weight: 800; line-height: 1.18; letter-spacing: -0.015em; color: var(--ink); text-wrap: balance; }
.ask-title em { font-style: normal; color: var(--magenta); }
.elly-asks .when { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--sky); font-family: var(--font-heading); font-size: 13px; font-weight: 700; line-height: 1.3; white-space: nowrap; color: var(--blue); }
.elly-asks .when .icon { width: 16px; height: 16px; }
.elly-asks .button.cta { min-height: 72px; margin-top: 6px; padding: 0 14px 0 32px; border-radius: 18px; font-size: 20px; }
.elly-asks .cta-arrow { width: 46px; height: 46px; }

/* Elly's window: her name over the question she asks, and the three objectives as the answers she offers */
.ask-window { padding: 20px 22px 24px; border-radius: 20px; background: var(--soft); }
.ask-head { display: flex; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.ask-head .avatar { width: 36px; height: 36px; }
.ask-who { display: grid; font-size: 13.5px; line-height: 1.25; color: var(--muted); }
.ask-who b { font-family: var(--font-heading); font-size: 16px; font-weight: 800; color: var(--ink); }
.ask-live { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 4px 10px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); font-family: var(--font-heading); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-soft); }
.ask-live i { width: 7px; height: 7px; border-radius: 50%; background: var(--mint); }
.ask-question { margin-top: 18px; }
.ask-question .avatar { width: 36px; height: 36px; }
.elly-asks .turn.ask-question .bubble { max-width: none; padding: 14px 18px; font-family: var(--font-heading); font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -0.01em; }
.ask-chips { display: grid; justify-items: end; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.ask-chip { display: inline-flex; align-items: center; gap: 10px; padding: 6px 16px 6px 6px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); font-family: var(--font-heading); font-size: 15px; font-weight: 700; line-height: 1.25; color: var(--ink); }
.ask-chip .obj-icon { width: 32px; height: 32px; background: var(--obj); color: var(--obj-on); }
.ask-chip .obj-icon .icon { width: 18px; height: 18px; }
@media (max-width: 960px) {
  .elly-asks .ask-card { grid-template-columns: minmax(0, 1fr); gap: 28px; padding: 32px; }
}
@media (max-width: 720px) {
  .elly-asks .ask-card { gap: 22px; padding: 22px 18px 18px; border-radius: 20px; }
  .ask-act { gap: 12px; }
  .ask-title { font-size: 23px; }
  .elly-asks .button.cta { justify-self: stretch; justify-content: space-between; min-height: 64px; margin-top: 4px; padding: 0 10px 0 20px; font-size: 18px; white-space: nowrap; }
  .ask-window { margin: -4px -4px 0; padding: 14px 14px 16px; border-radius: 16px; }
  .elly-asks .turn.ask-question .bubble { padding: 12px 14px; font-size: 19px; }
  .ask-chip { border-radius: 18px; font-size: 14px; }
  .ask-chip .obj-icon { width: 28px; height: 28px; }
  .ask-chip .obj-icon .icon { width: 16px; height: 16px; }
}
/* On the narrowest phones the longest button, Spanish "Agenda una reunión", still fits on one line inside the card */
@media (max-width: 374px) {
  .ask-act { grid-template-columns: minmax(0, 1fr); }
  .elly-asks .button.cta { gap: 12px; padding-left: 16px; font-size: 16px; }
}
