/* Agendamento em tela cheia: perguntas à direita, mapa da conversa à esquerda */
.ag { position: fixed; inset: 0; z-index: 120; display: grid; grid-template-columns: minmax(320px, 38%) 1fr; background: var(--paper); opacity: 0; transition: opacity .35s var(--ease); }
.ag.on { opacity: 1; }
.ag[hidden] { display: none; }
body.ag-open { overflow: hidden; }

/* lado esquerdo: mapa vivo */
.ag-side { position: relative; background: var(--panel); color: var(--on); display: flex; flex-direction: column; padding: 22px 26px; overflow: hidden; }
.ag-side .logo { color: var(--on); }
.ag-side .logo svg { color: var(--on-2); }
.ag-side::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(60% 50% at 50% 52%, rgba(62, 207, 142, .06), transparent 70%); }
.ag-map { position: relative; flex: 1; margin: 12px 0; }
.ag-lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ag-lines path { fill: none; stroke: rgba(247, 246, 245, .18); stroke-width: 1; stroke-dasharray: 400; stroke-dashoffset: 400; animation: draw 1s var(--ease-out) forwards; }
.ag-lines circle { fill: none; stroke: rgba(247, 246, 245, .07); }
@keyframes draw { to { stroke-dashoffset: 0; } }
.ag-core { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 150px; height: 150px; border-radius: 50%; display: grid; place-content: center; text-align: center; gap: 4px; box-shadow: inset 0 0 0 1px rgba(247, 246, 245, .22); background: rgba(12, 31, 33, .9); z-index: 2; transition: box-shadow .5s; }
.ag-core small { font-family: var(--mono); font-size: 9px; letter-spacing: .16em; text-transform: uppercase; color: var(--on-3); }
.ag-core b { font-family: var(--serif); font-weight: 400; font-size: 20px; line-height: 1.1; padding: 0 14px; }
.ag-core em { font-style: normal; font-size: 11px; color: var(--on-2); padding: 0 12px; line-height: 1.3; }
.ag-core.lit { box-shadow: inset 0 0 0 1px rgba(225, 255, 93, .45), 0 0 0 10px rgba(225, 255, 93, .03); }
.ag-node { position: absolute; z-index: 2; transform: translate(-50%, -50%) scale(.6); opacity: 0; transition: transform .6s var(--ease-out), opacity .4s, left .6s var(--ease-out), top .6s var(--ease-out); font-size: 11.5px; padding: 6px 10px; border-radius: 6px; white-space: nowrap; background: rgba(247, 246, 245, .06); box-shadow: inset 0 0 0 1px rgba(247, 246, 245, .16); color: var(--on); }
.ag-node.in { transform: translate(-50%, -50%) scale(1); opacity: 1; }
.ag-node.fam { background: transparent; color: var(--on-2); border-radius: 999px; }
.ag-node.when { background: var(--limao); color: #0c1f21; box-shadow: none; font-weight: 500; }
.ag-side-foot { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--on-3); position: relative; z-index: 2; }
.ag-side-foot span { display: inline-flex; gap: 6px; align-items: center; }

/* lado direito: perguntas */
.ag-main { position: relative; display: flex; flex-direction: column; min-width: 0; }
.ag-top { display: flex; align-items: center; gap: 18px; padding: 22px 26px 0; }
.ag-prog { flex: 1; display: grid; grid-auto-flow: column; gap: 4px; }
.ag-prog i { height: 2px; background: var(--line-2); position: relative; overflow: hidden; }
.ag-prog i::after { content: ""; position: absolute; inset: 0; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease-out); }
.ag-prog i.done::after, .ag-prog i.cur::after { transform: scaleX(1); }
.ag-prog i.cur::after { background: var(--ink-3); }
.ag-stage { position: relative; flex: 1; overflow: hidden; }
.aq { position: absolute; inset: 0; overflow-y: auto; padding: clamp(28px, 7vh, 80px) clamp(24px, 7vw, 110px) 40px; display: flex; flex-direction: column; gap: 20px; opacity: 0; transform: translateY(28px); transition: opacity .45s var(--ease), transform .8s var(--ease-out); pointer-events: none; }
.aq.on { opacity: 1; transform: none; pointer-events: auto; }
.aq.up { transform: translateY(-28px); }
.aq-n { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; color: var(--ink-3); }
.aq h2 { margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 3.4vw, 46px); line-height: 1; letter-spacing: -.015em; color: var(--ink); max-width: 20ch; text-wrap: balance; }
.aq h2 span { color: var(--ink-4); }
.aq .hint { margin: -8px 0 0; font-size: 14.5px; color: var(--ink-3); max-width: 52ch; }
.aq input[type=text], .aq input[type=email], .aq input[type=tel], .aq textarea { width: 100%; max-width: 560px; border: 0; border-bottom: 1px solid var(--line-2); background: transparent; border-radius: 0; font-family: var(--serif); font-size: clamp(24px, 2.4vw, 32px); padding: 8px 0 10px; outline: 0; transition: border-color .2s; }
.aq textarea { font-family: var(--sans); font-size: 16px; min-height: 76px; resize: vertical; }
.aq input:focus, .aq textarea:focus { border-color: var(--ink); }
.aq input::placeholder, .aq textarea::placeholder { color: #c3c0bb; }
.aq label.f { display: grid; gap: 2px; max-width: 560px; }
.aq label.f > span { font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.opts { max-width: 620px; border-top: 1px solid var(--line); }
.opts.cols { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; border-top: 0; }
.opts.cols .opt:nth-child(-n+2) { border-top: 1px solid var(--line); }
.opt { width: 100%; display: grid; grid-template-columns: 30px 1fr 18px; gap: 12px; align-items: center; text-align: left; padding: 14px 10px 14px 4px; border-bottom: 1px solid var(--line); font-size: 15.5px; color: var(--ink-2); transition: background-color .2s, color .2s, padding .3s var(--ease-out); }
.opt kbd { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); }
.opt small { display: block; font-size: 12.5px; color: var(--ink-3); margin-top: 1px; }
.opt svg { width: 16px; height: 16px; color: var(--ink); opacity: 0; transform: scale(.6); transition: opacity .2s, transform .3s var(--ease-out); }
.opt:hover { background: rgba(0, 0, 0, .025); color: var(--ink); }
.opt.sel { color: var(--ink); padding-left: 12px; background: linear-gradient(90deg, rgba(0, 0, 0, .04), transparent); box-shadow: inset 2px 0 0 var(--ink); }
.opt.sel kbd { color: var(--ink); }
.opt.sel svg { opacity: 1; transform: none; }
.aq-act { display: flex; align-items: center; gap: 16px; margin-top: 6px; flex-wrap: wrap; }
.aq-act .k { font-size: 12px; color: var(--ink-3); }
.aq-act .k kbd { font-family: var(--mono); font-size: 10.5px; padding: 1px 5px; border-radius: 3px; box-shadow: inset 0 0 0 1px var(--line-2); }
.aq-err { min-height: 18px; margin: 0; font-size: 13px; color: #9a3412; }
.ag-bot { display: flex; justify-content: space-between; align-items: center; padding: 14px 26px 18px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--ink-3); }
.ag-back { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--ink-3); transition: color .2s, opacity .2s; }
.ag-back:hover { color: var(--ink); }
.ag-back[disabled] { opacity: 0; pointer-events: none; }
.ag-hint .demo { font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; padding: 3px 7px; border-radius: 4px; background: var(--paper-3); color: var(--ink-2); }

/* calendário */
.cal-wrap { display: grid; grid-template-columns: minmax(280px, 340px) minmax(200px, 1fr); gap: 32px; max-width: 760px; align-items: start; }
.mcal-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.mcal-h b { font-family: var(--serif); font-weight: 400; font-size: 20px; text-transform: capitalize; }
.mcal-h div { display: flex; gap: 6px; }
.mcal-h .circ { width: 30px; height: 30px; }
.mcal-h .circ[disabled] { opacity: .3; pointer-events: none; }
.mcal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.mcal .dw { font-family: var(--mono); font-size: 9.5px; letter-spacing: .1em; color: var(--ink-4); text-align: center; padding: 4px 0 8px; text-transform: uppercase; }
.day { aspect-ratio: 1; border-radius: 6px; display: grid; place-items: center; font-size: 13.5px; color: var(--ink-5, #c3c0bb); position: relative; font-variant-numeric: tabular-nums; }
.day.av { color: var(--ink); cursor: pointer; background: #fff; box-shadow: inset 0 0 0 1px var(--line); transition: background-color .2s, box-shadow .2s; }
.day.av::after { content: ""; position: absolute; bottom: 5px; width: 3px; height: 3px; border-radius: 50%; background: var(--verde); }
.day.av:hover { box-shadow: inset 0 0 0 1px var(--ink); }
.day.sel { background: var(--ink); color: var(--paper); box-shadow: none; }
.day.sel::after { background: var(--limao); }
.day.today { text-decoration: underline; text-underline-offset: 3px; }
.slots-h { font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 10px; min-height: 16px; }
.slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 6px; max-height: 300px; overflow-y: auto; padding-right: 4px; }
.slot { height: 40px; border-radius: 6px; font-size: 14px; font-variant-numeric: tabular-nums; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .2s, color .2s, box-shadow .2s; display: grid; place-items: center; line-height: 1.1; }
.slot small { display: block; font-size: 10px; color: var(--ink-3); }
.slot:hover { box-shadow: inset 0 0 0 1px var(--ink); }
.slot.sel { background: var(--ink); color: var(--paper); box-shadow: none; }
.slot.sel small { color: var(--on-2); }
.slots-empty { font-size: 13.5px; color: var(--ink-3); padding: 10px 0; }
.fmt { display: inline-flex; padding: 3px; border-radius: 8px; background: rgba(0, 0, 0, .05); margin-bottom: 16px; }
.fmt button { height: 30px; padding: 0 14px; border-radius: 6px; font-size: 13px; color: var(--ink-3); transition: background-color .2s, color .2s; }
.fmt button.on { background: #fff; color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .1); }
.consent { display: flex; gap: 10px; align-items: flex-start; font-size: 12.5px; color: var(--ink-3); line-height: 1.5; max-width: 620px; cursor: pointer; }
.consent input { margin-top: 2px; accent-color: #161615; width: 15px; height: 15px; flex: none; }
.pick { font-size: 14px; color: var(--ink-2); }
.pick b { color: var(--ink); font-weight: 500; }
.loading { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--ink-3); }
.loading i { width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid var(--line-2); border-top-color: var(--ink); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* confirmado */
.done-top { display: flex; align-items: center; gap: 14px; }
.done-ic { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--limao); color: #0c1f21; flex: none; }
.done-card { max-width: 620px; border-top: 1px solid var(--line); }
.done-card div { display: grid; grid-template-columns: 120px 1fr; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14.5px; }
.done-card span { font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); padding-top: 3px; }
.tl { max-width: 620px; display: grid; gap: 0; }
.tl-i { display: grid; grid-template-columns: 110px 14px 1fr; gap: 12px; align-items: start; font-size: 13.5px; color: var(--ink-2); }
.tl-i span { font-family: var(--mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); padding-top: 3px; text-align: right; }
.tl-i i { width: 9px; height: 9px; border-radius: 50%; margin-top: 5px; box-shadow: inset 0 0 0 1.5px var(--ink-4); position: relative; }
.tl-i i::after { content: ""; position: absolute; left: 4px; top: 11px; width: 1px; height: 26px; background: var(--line-2); }
.tl-i:last-child i::after { display: none; }
.tl-i.now i { background: var(--ink); box-shadow: none; }
.tl-i p { margin: 0 0 16px; }

@media (max-width: 900px) {
  .ag { grid-template-columns: 1fr; grid-template-rows: 150px 1fr; }
  .ag-side { padding: 14px 18px; flex-direction: row; align-items: center; gap: 12px; }
  .ag-side .logo b { display: none; }
  .ag-map { margin: 0; height: 100%; }
  .ag-core { width: 92px; height: 92px; }
  .ag-core b { font-size: 14px; }
  .ag-core small, .ag-core em { display: none; }
  .ag-node { display: none; }
  .ag-node.when { display: block; font-size: 10px; padding: 4px 7px; }
  .ag-side-foot { display: none; }
  .ag-top { padding: 14px 18px 0; }
  .aq { padding: 26px 20px 30px; }
  .opts.cols { grid-template-columns: 1fr; }
  .opts.cols .opt:nth-child(2) { border-top: 0; }
  .cal-wrap { grid-template-columns: 1fr; gap: 20px; }
  .slots { max-height: none; }
  .ag-bot { padding: 12px 18px 14px; }
  .tl-i { grid-template-columns: 84px 14px 1fr; }
}

/* ---------- painel lateral v3: foto + cartão de vidro com o resumo ---------- */
.ag-side { padding: 26px 30px; gap: 20px; }
.ag-side::after { display: none; }
.ag-bg { position: absolute; inset: 0; z-index: 0; background: #0c1f21; }
.ag-bg img { filter: grayscale(1) contrast(1.1) brightness(.42) !important; }
.ag-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12, 31, 33, .55), rgba(12, 31, 33, .25) 40%, rgba(12, 31, 33, .85)); }
.ag-logo { position: relative; z-index: 2; display: inline-block; }
.ag-logo img { height: 24px; width: auto; }
.agc { position: relative; z-index: 2; margin: auto 0; width: 100%; max-width: 420px; align-self: center; border-radius: 18px; padding: 22px 22px 8px; color: var(--on); background: rgba(247, 246, 245, .08); -webkit-backdrop-filter: blur(22px) saturate(140%); backdrop-filter: blur(22px) saturate(140%); box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .22), inset -1px -1px 0 rgba(255, 255, 255, .06), 0 30px 60px -30px rgba(0, 0, 0, .6); max-height: calc(100% - 140px); overflow-y: auto; scrollbar-width: none; }
.agc::-webkit-scrollbar { display: none; }
.agc-h { display: grid; gap: 4px; padding-bottom: 16px; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.agc-h small { font-family: var(--mono); font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--on-3); }
.agc-h b { font-family: var(--serif); font-weight: 400; font-size: 28px; line-height: 1.05; }
.agc-h span { font-size: 12px; color: var(--on-3); }
.agc-row { display: grid; grid-template-columns: 92px 1fr; gap: 12px; padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, .07); align-items: baseline; }
.agc-row:last-child { border-bottom: 0; }
.agc-row > span { font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--on-3); padding-top: 2px; }
.agc-row .v { font-size: 13.5px; color: var(--on); line-height: 1.45; display: flex; flex-wrap: wrap; gap: 5px; }
.agc-row .v.empty { color: rgba(247, 246, 245, .22); }
.agc-row .chip { font-size: 12px; padding: 3px 8px; border-radius: 999px; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); animation: chipIn .45s var(--ease-out) both; }
.agc-row.when .v:not(.empty) { color: var(--limao); }
.agc-row.fresh { animation: rowIn .6s var(--ease-out); }
@keyframes chipIn { from { opacity: 0; transform: translateY(4px) scale(.96); } }
@keyframes rowIn { from { background: rgba(225, 255, 93, .07); } }
.ag-side-foot { position: relative; z-index: 2; }
.ag-map, .ag-core, .ag-lines, .ag-node { display: none !important; }

@media (max-width: 900px) {
  .ag { grid-template-rows: auto 1fr; }
  .ag-side { padding: 12px 16px; flex-direction: row; align-items: center; gap: 12px; min-height: 64px; }
  .ag-logo img { height: 18px; }
  .agc { margin: 0 0 0 auto; padding: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; max-height: none; overflow: visible; width: auto; text-align: right; }
  .agc-h { border: 0; padding: 0; gap: 0; }
  .agc-h small { display: none; }
  .agc-h b { font-size: 16px; }
  .agc-h span { font-size: 11px; }
  .agc-rows { display: none; }
}