/* Vacei — Elevation, glass and gradients.
   Depth is soft and low-contrast: wide, faint shadows plus a 1px white-ish
   border on frosted surfaces. Never a hard border-and-dark-shadow combination. */
:root {
  --shadow-topbar: 0 2px 12px rgba(0,0,0,0.06);
  --shadow-card:   0 3px 14px rgba(0,0,0,0.04);
  --shadow-raised: 0 4px 16px rgba(0,0,0,0.05);
  --shadow-nav-active: 0 2px 8px rgba(0,0,0,0.09);
  --shadow-glass:  0 16px 40px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.8);
  --shadow-cover:  0 10px 30px rgba(23,52,58,0.20);
  --shadow-lime:   0 16px 40px rgba(70,86,14,0.20);
  --shadow-brand:  0 8px 28px rgba(63,79,227,0.34);

  --blur-glass:   blur(20px) saturate(180%); /* @kind other */
  --blur-card:    blur(14px) saturate(150%); /* @kind other */
  --blur-on-cover: blur(8px); /* @kind other */

  --grad-canvas:    radial-gradient(1200px 700px at 14% 6%, #F3F3F3 0%, #EAEAEA 48%, #E4E4E5 100%); /* @kind color */
  --grad-cover:     linear-gradient(112deg, #33646E 0%, #4E7B84 34%, #6B939B 68%, #8FAEB3 100%); /* @kind color */
  --grad-cover-glow: radial-gradient(120% 90% at 88% 8%, rgba(255,255,255,0.16) 0%, transparent 58%); /* @kind color */
  --grad-assistant: radial-gradient(130% 66% at 12% 106%, rgba(132,140,48,0.26) 0%, rgba(132,140,48,0) 62%), radial-gradient(96% 56% at 94% 102%, rgba(132,140,48,0.16) 0%, rgba(132,140,48,0) 66%), linear-gradient(168deg, #E7EBB4 0%, #EEF29E 46%, #F9FD87 100%); /* @kind color */

  /* marketing shadows — flat paper, one soft lift */
  --shadow-shot:  0 18px 44px rgba(20,22,40,0.10);
  --shadow-sheet: 0 18px 44px rgba(20,22,40,0.14);
  --shadow-pill:  0 10px 24px rgba(20,22,40,0.08);

  --ease-swift: cubic-bezier(.4,.05,.2,1); /* @kind other */
  --ease-out-soft: cubic-bezier(.16,1,.3,1); /* @kind other */
  --t-marketing: .18s; /* @kind other */
  --t-fast:  .15s; /* @kind other */
  --t-mid:   .22s; /* @kind other */
  --t-panel: .36s; /* @kind other */
}

.v-glass { background: var(--glass); border: 1px solid var(--glass-border);
  -webkit-backdrop-filter: var(--blur-glass); backdrop-filter: var(--blur-glass);
  box-shadow: var(--shadow-glass); border-radius: var(--radius-shell); }
.v-card { background: rgba(255,255,255,0.62); border: 1px solid rgba(255,255,255,0.72);
  -webkit-backdrop-filter: var(--blur-card); backdrop-filter: var(--blur-card);
  box-shadow: var(--shadow-card); border-radius: var(--radius-card); }
.v-cover { background: var(--cover-2); border-radius: var(--radius-cover);
  box-shadow: var(--shadow-cover); }
.v-assistant { background: var(--grad-assistant); border-radius: var(--radius-cover);
  box-shadow: var(--shadow-lime); color: var(--lime-ink); }

@keyframes v-fadeUp { from { opacity: 0; transform: translateY(12px) } to { opacity: 1; transform: none } }
@keyframes v-pulseDot { 0%,100% { opacity: 1 } 50% { opacity: .35 } }
.v-fade-up { animation: v-fadeUp .6s ease both; }
.v-pulse-dot { animation: v-pulseDot 2.4s infinite; }
@media (prefers-reduced-motion: reduce) { .v-fade-up, .v-pulse-dot { animation: none } }