/* SITE4 (Gex, 2026-10-15): the pop-ups stand out from the cloth behind them: the page blurred and darkened, a gold
   edge round the panel, and the preview pop-up's plain top; heroes for AI Setup and Download */

.w-scrim { -webkit-backdrop-filter: blur(6px) saturate(.6); backdrop-filter: blur(6px) saturate(.6); background: rgba(4,8,15,.70); }
.w-dlg { box-shadow: 0 0 0 1.5px var(--t-gold), 0 36px 100px rgba(0,0,0,.72); }
[data-theme="dark"] .w-dlg { background: #15231F; }
.w-dlg__top--plain { background: var(--t-header); }
.w-dlg__top--plain h2 { text-shadow: none; }

/* AI Setup: the conversation */
.a-win { width: 100%; max-width: 560px; }
.a-bi { width: 18px; height: 18px; color: var(--t-gold); }
.a-chat { border-radius: 0; background: transparent; padding: 22px; min-height: 330px; align-content: start; }
.a-chat .c-msg { white-space: normal; }
.a-chat .c-msg--ai { background: rgba(255,255,255,.06); color: var(--t-terminal-text); box-shadow: inset 0 0 0 1px rgba(255,255,255,.10); }
.a-chat .c-msg--key { display: flex; }
.a-chat .c-msg--key b { display: block; } .a-chat .c-msg--key span { display: block; font-size: 13px; opacity: .8; }
.a-chat .c-fp { width: 22px; height: 22px; margin-left: auto; color: var(--t-gold); }
.a-chat .c-keys { width: 28px; height: 28px; flex: none; }

/* Download: the console, the phone and the agent */
.dl-apps { position: relative; width: 100%; max-width: 600px; padding: 0 0 56px; }
.dl-win { width: 88%; }
.dl-win img { display: block; width: 100%; height: auto; }
.dl-phone { position: absolute; right: 0; top: 48px; width: 34%; max-width: 190px; aspect-ratio: 9 / 18.5; padding: 7px; border-radius: 26px;
  background: #05080F; box-shadow: 0 0 0 1px rgba(255,255,255,.14), 0 24px 60px rgba(0,0,0,.6); }
.dl-phone__in { height: 100%; border-radius: 20px; background: var(--t-terminal-ground); display: flex; flex-direction: column; align-items: center;
  padding: 16px 12px; gap: 6px; color: var(--t-terminal-text); font-size: 12px; }
.dl-phone__top { align-self: stretch; display: flex; align-items: center; gap: 6px; font: 700 13px var(--t-font-product); }
.dl-phone__top .w-xstick { width: 18px; height: 18px; }
.dl-phone__sh { width: 64px; height: 64px; margin-top: 18%; }
.dl-phone__on { font: 700 22px/26px var(--t-font-brand); color: var(--t-cream); }
.dl-phone__row { margin-top: auto; align-self: stretch; display: flex; align-items: center; justify-content: space-between; padding: 10px;
  border-radius: 10px; background: rgba(255,255,255,.06); }
.dl-sw { width: 30px; height: 18px; border-radius: 9px; background: var(--t-gold); position: relative; }
.dl-sw::after { content: ""; position: absolute; right: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #FFFFFF; }

@container (max-width: 760px) {
  .dl-apps { padding-bottom: 64px; }
  .dl-phone { top: 28px; border-radius: 20px; padding: 5px; } .dl-phone__in { border-radius: 16px; padding: 10px 8px; font-size: 10px; }
  .dl-phone__sh { width: 40px; height: 40px; } .dl-phone__on { font-size: 17px; line-height: 20px; }
  .dl-phone__row { padding: 6px; }   .a-chat { min-height: 0; padding: 16px; } .a-chat .c-msg { font-size: 14px; line-height: 21px; }
}

/* round 3: the agent as a service: one still app tile, an outlined cog (Gex: static, simple) */
.dl-svc { position: absolute; left: 4%; bottom: 0; display: flex; align-items: center; gap: 16px; padding: 14px 22px 14px 14px; border-radius: 14px;
  background: var(--t-header); color: var(--t-on-header); box-shadow: inset 0 0 0 1.5px var(--t-gold), 0 18px 40px rgba(0,0,0,.55); line-height: 20px; }
.dl-svc b { display: block; font-size: 16px; } .dl-svc div span { display: block; font-size: 13px; opacity: .8; }
.dl-svc__app { flex: none; width: 56px; height: 56px; border-radius: 14px; background: var(--t-loch); display: grid; place-items: center; opacity: 1 !important; }
.dl-cog { width: 42px; height: 42px; }
.dl-cog path, .dl-cog circle { fill: none; stroke: var(--t-gold); stroke-width: 2.6; stroke-linejoin: round; }
@container (max-width: 760px) { .dl-svc { left: 0; padding: 10px 16px 10px 10px; } .dl-svc__app { width: 44px; height: 44px; } .dl-cog { width: 34px; height: 34px; } }
