/* Sage 2.0 widget CTA shell — premium, restrained, not generic-AI-SaaS.
   Loaded only when the shell renders (flag on). Dark glossy launcher + light panel;
   theme-neutral; mobile-safe bottom sheet; respects prefers-reduced-motion. */

.sagew { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 1000; }

/* Lift the "N saved · View saved" pill above the launcher so they never overlap. */
.v2-savedpill { bottom: 5.75rem !important; }

/* ---- Launcher ---- */
.sagew__launcher {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .7rem 1.05rem .7rem .85rem; border: 0; cursor: pointer;
  border-radius: 999px; color: #fff; font: 600 .95rem/1 Montserrat, system-ui, sans-serif;
  background: linear-gradient(135deg, #0A2A4E 0%, #123f74 55%, #1f6f4a 130%);
  box-shadow: 0 10px 28px rgba(6, 24, 46, .34), inset 0 1px 0 rgba(255, 255, 255, .12);
  transition: transform .18s ease, box-shadow .18s ease;
}
.sagew__launcher:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(6, 24, 46, .42); }
.sagew__launcher:focus-visible { outline: 3px solid #7fb0ff; outline-offset: 3px; }

.sagew__spark {
  width: 18px; height: 18px; border-radius: 50%; flex: none;
  background: radial-gradient(circle at 30% 30%, #b8f5d0, #3fce8a 45%, #1f9d6b 75%);
  box-shadow: 0 0 0 3px rgba(63, 206, 138, .18); animation: sagew-pulse 3.2s ease-in-out infinite;
}
.sagew__spark--sm { width: 14px; height: 14px; }
@keyframes sagew-pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.12); opacity: .78; } }

/* ---- Panel ---- */
.sagew__panel {
  position: absolute; right: 0; bottom: calc(100% + .75rem); width: min(22rem, calc(100vw - 2.5rem));
  background: #fff; color: #0E1B2A; border: 1px solid #E4EBF3; border-radius: 18px; overflow: hidden;
  box-shadow: 0 24px 60px rgba(6, 24, 46, .28);
  transform-origin: bottom right; animation: sagew-in .22s cubic-bezier(.2, .8, .2, 1);
}
@keyframes sagew-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }

.sagew__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: .85rem 1rem; color: #fff; background: linear-gradient(135deg, #0A2A4E, #123f74);
}
.sagew__brand { display: inline-flex; align-items: center; gap: .5rem; }
.sagew__title { font: 700 1rem/1 Montserrat, system-ui, sans-serif; }
.sagew__close { background: none; border: 0; color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; padding: .1rem .3rem; border-radius: 8px; }
.sagew__close:focus-visible { outline: 2px solid #7fb0ff; outline-offset: 2px; }

.sagew__body { padding: 1rem; }
.sagew__opener { margin: 0 0 .85rem; font-size: .95rem; line-height: 1.5; color: #0E1B2A; }

.sagew__ctas { display: grid; gap: .5rem; }
.sagew__cta {
  display: flex; align-items: center; justify-content: space-between; gap: .5rem;
  text-align: left; width: 100%; box-sizing: border-box; cursor: pointer;
  padding: .7rem .85rem; border-radius: 12px; border: 1px solid #E4EBF3; background: #F7FAFF;
  color: #0A2A4E; font: 600 .9rem/1.25 Montserrat, system-ui, sans-serif; text-decoration: none;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.sagew__cta:hover { background: #eef4ff; border-color: #b9d0f0; transform: translateY(-1px); }
.sagew__cta:focus-visible { outline: 2px solid #1f6f4a; outline-offset: 2px; }
.sagew__cta--primary { background: linear-gradient(135deg, #1f6f4a, #2e8a5c); color: #fff; border-color: transparent; }
.sagew__cta--primary:hover { background: linear-gradient(135deg, #1c6543, #2a7f54); }
.sagew__cta::after { content: "→"; opacity: .6; }

.sagew__invite { margin-top: .85rem; padding-top: .85rem; border-top: 1px solid #EEF2F7; }
.sagew__label { display: block; font-weight: 600; font-size: .82rem; margin-bottom: .35rem; }
.sagew__invite input[type="email"] {
  width: 100%; box-sizing: border-box; padding: .6rem .7rem; border: 1px solid #D8E0EA;
  border-radius: 10px; margin-bottom: .55rem; font-size: .92rem;
}
.sagew__submit { width: 100%; }
.sagew__fineprint { margin: .5rem 0 0; font-size: .72rem; color: #5B6B7C; }
.sagew__hp { position: absolute; left: -9999px; }
.sagew__foot { padding: .6rem 1rem; background: #F5F8FC; border-top: 1px solid #EEF2F7; font-size: .72rem; color: #9DB4D0; }

/* Mobile: dock as a bottom sheet. */
@media (max-width: 480px) {
  .sagew { right: .9rem; bottom: .9rem; }
  .sagew__panel { position: fixed; right: .75rem; left: .75rem; bottom: 4.75rem; width: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .sagew__launcher, .sagew__panel, .sagew__spark, .sagew__cta { animation: none !important; transition: none !important; }
}