/* Lumen Edge material cues, restrained to Atreon's existing monochrome language. */
:root {
  --atreon-lumen-rim: inset 0 0 0 1px rgba(242,244,241,.105);
  --atreon-lumen-rim-strong: inset 0 0 0 1px rgba(242,244,241,.19);
  --atreon-lumen-surface: radial-gradient(ellipse at 50% 112%, rgba(101,111,108,.34) 0%, rgba(24,29,29,.92) 36%, #0b0d0e 72%);
  --atreon-lumen-surface-soft: radial-gradient(ellipse at 50% 118%, rgba(92,102,99,.22) 0%, rgba(17,21,21,.96) 52%, #0b0d0e 82%);
  --atreon-lumen-focus: 0 0 0 1px rgba(238,241,237,.82), 0 0 18px rgba(238,241,237,.12);
  --atreon-lumen-ease: cubic-bezier(.15,.83,.66,1);
}

/* The dashboard gets engineered depth without adding another decorative line. */
.leader-console {
  background: var(--atreon-lumen-surface);
  box-shadow: var(--atreon-lumen-rim), 0 30px 70px rgba(0,0,0,.22);
}

.leader-screen {
  background: radial-gradient(ellipse at 50% 108%, rgba(118,128,124,.08), transparent 50%);
}

.leader-card-grid article,
.leader-queue,
.leader-actions-panel {
  background: var(--atreon-lumen-surface-soft);
  box-shadow: inset 0 0 0 1px rgba(242,244,241,.025);
}

.leader-tabs button {
  position: relative;
  transition: color .42s var(--atreon-lumen-ease), background .42s var(--atreon-lumen-ease), box-shadow .42s var(--atreon-lumen-ease);
}

.leader-tabs button[aria-selected="true"] {
  background: radial-gradient(ellipse at 50% 115%, #545e5b 0%, #151a1a 46%, #0b0d0e 82%);
  color: #f3f4f1;
  box-shadow: var(--atreon-lumen-rim-strong), inset 0 -12px 24px rgba(238,241,237,.025);
}

.leader-actions-panel button {
  transition: color .32s var(--atreon-lumen-ease), background .32s var(--atreon-lumen-ease), box-shadow .32s var(--atreon-lumen-ease);
}
.leader-actions-panel button:hover {
  background: radial-gradient(ellipse at 50% 120%, rgba(118,128,124,.45), rgba(20,25,24,.96) 58%);
  color: #f1f3ef;
  box-shadow: var(--atreon-lumen-rim-strong);
}
.leader-actions-panel button:focus-visible {
  position: relative;
  z-index: 1;
  outline: 0;
  box-shadow: var(--atreon-lumen-focus);
}

/* The featured plan feels illuminated from within, not outlined by an animated stripe. */
.plan-featured {
  background: radial-gradient(ellipse at 50% 112%, #4f5956 0%, #1b201f 31%, #111514 70%);
  box-shadow: var(--atreon-lumen-rim), 0 24px 54px rgba(17,20,18,.12);
}
.plan-featured:hover {
  box-shadow: var(--atreon-lumen-rim-strong), 0 26px 60px rgba(17,20,18,.16);
}

.plan-grid { perspective: 1200px; }
.plan-card {
  overflow: hidden;
  transform-origin: center bottom;
  transition: transform .62s var(--atreon-lumen-ease), box-shadow .62s var(--atreon-lumen-ease), border-color .62s var(--atreon-lumen-ease);
}
.plan-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 112%, rgba(45,55,52,.11), transparent 58%);
  opacity: 0;
  transition: opacity .62s var(--atreon-lumen-ease);
}
.plan-featured::before { background: radial-gradient(ellipse at 50% 112%, rgba(238,241,237,.12), transparent 56%); }
.plan-card > * { position: relative; z-index: 1; }

@media (hover: hover) and (pointer: fine) {
  .plan-card:hover,
  .plan-card:focus-within {
    z-index: 3;
    transform: translateY(-10px) scale(1.012);
    border-color: #aeb5b1;
    box-shadow: inset 0 0 0 1px rgba(17,20,18,.13), 0 28px 62px rgba(16,20,18,.17);
  }
  .plan-featured:hover,
  .plan-featured:focus-within {
    border-color: #6f7875;
    box-shadow: var(--atreon-lumen-rim-strong), 0 30px 68px rgba(17,20,18,.24);
  }
  .plan-card:hover::before,
  .plan-card:focus-within::before { opacity: 1; }
}

/* Focus and form feedback stay subtle, accessible, and monochrome. */
.contact-form {
  background: radial-gradient(ellipse at 50% 112%, rgba(87,97,94,.24), rgba(18,22,22,.98) 48%, #0d1011 84%);
  box-shadow: var(--atreon-lumen-rim), 0 30px 70px rgba(0,0,0,.16);
}

.contact-form input,
.contact-form select,
.contact-form textarea {
  transition: border-color .28s var(--atreon-lumen-ease), box-shadow .28s var(--atreon-lumen-ease), background .28s var(--atreon-lumen-ease);
}
.contact-form input:hover,
.contact-form select:hover,
.contact-form textarea:hover { border-color: #66706d; }
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  border-color: #eef0ed;
  background: rgba(238,241,237,.018);
  box-shadow: 0 8px 15px -14px rgba(238,241,237,.95);
}

.form-submit {
  box-shadow: var(--atreon-lumen-rim);
  transition: transform .42s var(--atreon-lumen-ease), box-shadow .42s var(--atreon-lumen-ease), background .42s var(--atreon-lumen-ease);
}
.form-submit:hover {
  transform: translateY(-2px);
  box-shadow: var(--atreon-lumen-rim-strong), 0 14px 30px rgba(0,0,0,.2);
}
.form-submit:focus-visible {
  outline: 0;
  box-shadow: var(--atreon-lumen-focus);
}

/* Atri now shares the same quiet material depth as the command center. */
.chat-launcher,
.chat-panel {
  background: var(--atreon-lumen-surface-soft);
  box-shadow: var(--atreon-lumen-rim), 0 22px 48px rgba(0,0,0,.28);
}
.chat-launcher:hover,
.chat-widget.open .chat-launcher { box-shadow: var(--atreon-lumen-rim-strong), 0 18px 42px rgba(0,0,0,.3); }
.chat-options button {
  transition: color .3s var(--atreon-lumen-ease), background .3s var(--atreon-lumen-ease), box-shadow .3s var(--atreon-lumen-ease);
}
.chat-options button:hover,
.chat-options button:focus-visible {
  outline: 0;
  color: #f2f4f1;
  background: radial-gradient(ellipse at 50% 120%, rgba(112,122,119,.4), rgba(18,23,22,.96) 60%);
  box-shadow: var(--atreon-lumen-rim-strong);
}

@media (max-width: 720px) {
  .leader-console,
  .contact-form,
  .chat-panel { box-shadow: var(--atreon-lumen-rim); }
}

@media (prefers-reduced-motion: reduce) {
  .leader-tabs button,
  .leader-actions-panel button,
  .contact-form input,
  .contact-form select,
  .contact-form textarea,
  .form-submit,
  .chat-options button,
  .plan-card,
  .plan-card::before { transition: none; }
}
