/* Living DNA: generated artwork, quiet light, and responsive detail.
   Brand artwork motion only. Interface motion (page, tabs, dialogs, buttons,
   toasts, typing, collapse) lives in motion.css, which loads on every page. */
.dna-motion-art { position:relative; isolation:isolate; overflow:hidden; }
/* The rotating sculpture is not used. Artwork stays the gold still underneath. */
.dna-motion-video { display:none !important; }
.hero-art.dna-motion-art::after {
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:linear-gradient(180deg,color-mix(in srgb, var(--brand-black) 0.0%, transparent) 40%,color-mix(in srgb, var(--brand-black) 72.94%, transparent));
}
.hero-art :is(.art-grain,.art-label,.art-caption) { z-index:2; }
.hero-art .art-grain {
  background:linear-gradient(115deg,transparent 20%,color-mix(in srgb, var(--brand-white) 6.67%, transparent) 45%,transparent 70%);
  background-size:220% 100%;
}
html[data-dna-motion="active"] .hero-art .art-grain { animation:dna-light-pass 16s ease-in-out infinite alternate; }
.next-action-art .dna-motion-video { object-position:85% center; }
body.dna-dashboard .next-action-art.dna-motion-art::after { z-index:1; }
body.dna-dashboard .next-action-art.dna-motion-art span { z-index:2; }
.closing-section.dna-motion-art {
  background:var(--brand-cream) url('assets/dna-formation-strands.jpg') 80% center/cover;
}
.closing-section.dna-motion-art::before {
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:linear-gradient(90deg,color-mix(in srgb, var(--brand-light-panel) 96.08%, transparent) 12%,color-mix(in srgb, var(--brand-light-panel) 90.98%, transparent) 52%,color-mix(in srgb, var(--brand-light-panel) 72.16%, transparent));
}
.closing-section.dna-motion-art > :not(video) { position:relative; z-index:2; }
.closing-section .dna-motion-video { object-position:center; }
.dna-motion-toggle {
  position:fixed; right:20px; bottom:20px; z-index:120; display:flex; align-items:center; gap:7px;
  min-height:44px; padding:10px 14px; border:1px solid var(--r-line,var(--brand-tan)); border-radius:100px;
  background:var(--r-surface,var(--brand-white)); color:var(--r-muted,var(--brand-muted));
  font:500 11px/1.4 var(--brand-body);
  box-shadow:0 3px 14px color-mix(in srgb, var(--brand-black) 3.14%, transparent); cursor:pointer;
  transition:background .2s,color .2s,box-shadow .2s;
}
.dna-refreshed .dna-motion-toggle { right:76px; }
.dna-motion-toggle[hidden] { display:none!important; }
.dna-motion-toggle svg { width:16px; height:16px; flex-shrink:0; }
.dna-motion-toggle:hover { color:var(--r-ink,var(--brand-black)); box-shadow:0 5px 20px color-mix(in srgb, var(--brand-black) 6.27%, transparent); }
.dna-motion-toggle:focus-visible { outline:2px solid var(--r-accent,var(--brand-gold)); outline-offset:4px; }
.dna-motion-arrived { animation:dna-section-arrive .7s var(--dna-reveal-delay,0ms) cubic-bezier(.16,1,.3,1) both; }

/* A little life in non-helix marks. The sidebar DNA mark stays a still. */
.dna-sidebar-logo svg,
.dna-sidebar-logo svg path { animation:none !important; }
html[data-dna-motion="active"] :is(.coach-welcome-mark,.small-leaf) { animation:dna-mark-breathe 7s ease-in-out infinite; }
.dna-sidebar-nav a svg,.dna-sidebar-bottom a svg { transition:transform .3s cubic-bezier(.16,1,.3,1); }
.dna-sidebar-nav a:hover svg,.dna-sidebar-bottom a:hover svg { transform:translateY(-2px); }
.primary-button span,.next-action .btn-gold span { display:inline-block; transition:transform .3s cubic-bezier(.16,1,.3,1); }
.primary-button:hover span,.next-action .btn-gold:hover span { transform:translate(2px,-2px); }
.journey-steps li { transition:transform .3s cubic-bezier(.16,1,.3,1); }
@media (hover:hover) and (pointer:fine) {
  .journey-steps li:hover { transform:translateX(5px); }
}
@keyframes dna-light-pass { from{background-position:100% center} to{background-position:0% center} }
@keyframes dna-mark-breathe { 0%,100%{opacity:.78;transform:scale(1)} 50%{opacity:1;transform:scale(1.06)} }
@keyframes dna-section-arrive { from{opacity:.45;transform:translateY(16px)} to{opacity:1;transform:none} }
html.dna-motion-hidden :is(.coach-welcome-mark,.small-leaf,.hero-art .art-grain) { animation-play-state:paused!important; }
html[data-dna-motion="paused"] :is(.hero-copy,.hero-art,.dna-refreshed main,.next-action,.dna-motion-arrived) { animation:none!important; }
html.dna-motion-restricted .dna-motion-video { opacity:0; }
@media (max-width:700px) {
  .hero-art .dna-motion-video { object-position:82% 58%; }
  .next-action-art .dna-motion-video { object-position:78% 60%; }
  .dna-motion-toggle { right:16px; bottom:16px; }
  .dna-refreshed .dna-motion-toggle { right:72px; }
}
@media (prefers-reduced-motion:reduce) {
  .dna-motion-video { display:none; }
  .dna-motion-arrived { animation:none; }
  .dna-sidebar-logo svg,.dna-sidebar-logo svg path,.coach-welcome-mark,.small-leaf,.hero-art .art-grain { animation:none!important; }
  .dna-motion-toggle { display:none; }
  .primary-button span,.next-action .btn-gold span,.dna-sidebar-nav a svg,.dna-sidebar-bottom a svg,.journey-steps li { transition:none; transform:none!important; }
}
@media print { .dna-motion-video,.dna-motion-toggle { display:none!important; } }