/* Flow refinement. Deliberately scoped to preserve /new3 for comparison. */
.flow-refined { --flow-line: #dad6ec; --flow-line-strong: #b9aedf; --flow-radius: 22px; }
.flow-refined .header { border-bottom-color: var(--flow-line); }
.flow-refined .reading-progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: linear-gradient(90deg,#526cf3,#ab6be9); transform: scaleX(var(--reading-progress,0)); transform-origin: left; pointer-events: none; }
.flow-refined .hero { isolation: isolate; }
.flow-refined .hero__bg::before { content: ''; position: absolute; inset: -5%; background: radial-gradient(ellipse at 35% 25%,#ccd6ff80,transparent 45%),radial-gradient(ellipse at 72% 35%,#e2cbff90,transparent 40%); opacity: .55; animation: flow-aurora 14s ease-in-out infinite alternate; animation-play-state: paused; }
.motion-enabled .flow-refined .hero.flow-in-view .hero__bg::before { animation-play-state: running; }
.motion-enabled .flow-refined .hero__content { animation: flow-intro 1s cubic-bezier(.16,1,.3,1) both; }
.flow-refined .hero__title .text-gradient { padding-bottom: .05em; }
.flow-refined .btn { border-radius: 12px; }
.flow-refined .btn--ghost { border-color: var(--flow-line-strong); box-shadow: none; }
.flow-refined .btn--primary { border: 1px solid #6555df; box-shadow: 0 5px 15px #6651cf14; }
.flow-refined .btn:focus-visible, .flow-refined .product__link:focus-visible, .flow-refined summary:focus-visible { outline: 3px solid #9b85ee; outline-offset: 4px; }
.flow-refined .btn > span[aria-hidden] { transition: transform .25s; }
.flow-refined .btn:hover > span[aria-hidden], .flow-refined .btn:focus-visible > span[aria-hidden] { transform: translate(2px,-2px); }
.flow-refined .eco-node { border-radius: 12px; border-color: var(--flow-line); box-shadow: 0 5px 18px #42327d08; }
.flow-refined .eco-node.is-active { border-color: #9480e1; box-shadow: 0 0 0 3px #9480e10c,0 8px 28px #7162f51a; }
.flow-refined .ecosystem__core { border: 1px solid #ddd6f2; border-radius: 25%; }
.flow-refined .journey { border-block: 1px solid #392952; }
.flow-refined .journey__logo { transform: rotate(calc(var(--journey-progress,0)*180deg)); border: 1px solid #e2d8f7; box-shadow: 0 0 55px #a580eb20; }
.flow-refined .journey__steps li { opacity: .72; }
.flow-refined .journey__steps li.is-current { opacity: 1; }
.flow-refined .journey__caption { top: 6%; }
.flow-refined .journey__number { bottom: 6%; }
.flow-refined .journey__visual::before, .flow-refined .journey__visual::after { content: ''; position: absolute; inset: 12.5%; border: 1px solid #c3b3ff18; border-radius: 50%; pointer-events: none; }
.flow-refined .journey__visual::after { inset: 21%; border-style: dashed; transform: rotate(calc(var(--journey-progress,0)*-90deg)); }
.flow-refined .journey__satellite { position: absolute; inset: 12.5%; border-radius: 50%; transform: rotate(calc(-90deg + var(--journey-progress,0)*360deg)); pointer-events: none; }
.flow-refined .journey__satellite::after { content: ''; position: absolute; right: -4px; top: calc(50% - 4px); width: 8px; height: 8px; border-radius: 50%; background: #dfcdff; box-shadow: 0 0 20px #c5a1ff; }
.flow-refined .card { border: 1px solid var(--flow-line); border-radius: var(--flow-radius); box-shadow: 0 4px 16px #34245104; transition: border-color .25s,box-shadow .25s,transform .25s; }
.flow-refined .card:hover, .flow-refined .card:focus-within { border-color: #ad9bdf; box-shadow: 0 12px 32px #3424510a; }
.flow-refined .card::before, .flow-refined .product::before { border-radius: inherit; }
.flow-refined .card__icon { border: 1px solid #dcd5f4; border-radius: 12px; }
.flow-refined .stats { border-color: var(--flow-line); }
.flow-refined .stat { border-right-color: var(--flow-line); }
.flow-refined .manifesto { width: min(1320px,calc(100% - 48px)); margin: 24px auto; border: 1px solid #384462; border-radius: 28px; background-clip: padding-box; }
.flow-refined .manifesto__light { border-radius: inherit; }
.flow-refined .product { border: 1px solid var(--flow-line); border-radius: 24px; overflow: hidden; box-shadow: 0 -8px 32px #2c194d0b; transition: border-color .3s,box-shadow .3s; isolation: isolate; }
.flow-refined .product:hover { transform: none; border-color: #aa98d8; box-shadow: 0 -8px 32px #2c194d12; }
.flow-refined .product:focus-within { border-color: #9480d0; }
.flow-refined .product-art { border: 1px solid #3220500a; border-radius: 16px; background-clip: padding-box; }
.flow-refined .product-art img { transform: translateY(calc((.5 - var(--art-progress,.5))*14px)) scale(calc(.97 + var(--art-progress,.5)*.06)); }
.flow-refined .product-art__ring { border-color: #7c60af2b; border-top-color: #9270c46b; animation: flow-product-orbit 20s linear infinite; animation-play-state: paused; }
.motion-enabled .flow-refined .product.flow-in-view .product-art__ring { animation-play-state: running; }
.flow-refined .product__link { border-radius: 6px; border-bottom: 0; padding: 10px 12px; margin-left: -12px; }
.flow-refined .product__link:hover { background: #f1edfa; }
.flow-refined .feature { border-color: #ffffff24; border-radius: var(--flow-radius); }
.flow-refined .timeline { isolation: isolate; }
.flow-refined .timeline::after { content: ''; position: absolute; top: 24px; left: 10%; right: 10%; height: 2px; background: linear-gradient(90deg,#5b6de9,#9e6bdc); transform: scaleX(var(--process-progress,0)); transform-origin: left; z-index: -1; }
.flow-refined .timeline::before { background: #dfd8ef; z-index: -1; }
@media (min-width: 1025px) { .flow-refined .timeline::before { left: 10%; right: 10%; } }
.flow-refined .timeline__marker { background: #faf9ff; border: 1px solid #cfc5e7; box-shadow: 0 0 0 8px #faf9ff; transition: border-color .4s,box-shadow .4s; }
.flow-refined .timeline__marker span { color: #7162bc; }
.flow-refined .timeline__step.is-reached .timeline__marker { border-color: #9174d4; box-shadow: 0 0 0 8px #faf9ff,0 0 0 9px #b8a4e73b; }
.flow-refined .faq-item { border: 1px solid var(--flow-line); border-radius: 16px; background: #fff; transition: border-color .3s,box-shadow .3s; }
.flow-refined .faq-item[open] { border-color: #a795d4; box-shadow: 0 6px 24px #3b245a08; }
.flow-refined .faq-question { padding: 21px 24px; }
.flow-refined .faq-question:focus-visible { outline-offset: -5px; }
.flow-refined .faq-answer { padding: 0 24px 24px; }
.flow-refined .cta__card { border: 1px solid #303d59; border-radius: 28px; }
.flow-refined .cta__form-wrapper { border: 1px solid #e2daef; border-radius: 20px; }
.flow-refined .form-group input, .flow-refined .form-group textarea { border: 1px solid #c8c0db; border-radius: 10px; background: #fcfbff; }
.flow-refined .form-group input:focus, .flow-refined .form-group textarea:focus { border-color: #8d71d5; box-shadow: 0 0 0 3px #8d71d521; }
.flow-refined #motion-toggle { border-color: #cfc6e3; border-radius: 10px; }
@keyframes flow-aurora { to { transform: translate3d(3%,-2%,0) scale(1.07); opacity: .8; } }
@keyframes flow-intro { from { opacity: .4; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes flow-product-orbit { to { transform: rotate(360deg); } }
@media (max-width: 1024px) {
  .flow-refined .timeline::after { top: 24px; bottom: 24px; left: 23px; right: auto; width: 2px; height: auto; transform: scaleY(var(--process-progress,0)); transform-origin: top; background: linear-gradient(#5b6de9,#9e6bdc); }
  .flow-refined .timeline::before { top: 24px; bottom: 24px; }
}
@media (max-width: 600px) {
  .flow-refined .manifesto { width: calc(100% - 24px); border-radius: 22px; margin: 12px auto; }
  .flow-refined .manifesto .container { width: calc(100% - 40px); }
  .flow-refined .product { padding: 12px 12px 20px; border-radius: 22px; }
  .flow-refined .product-art { height: 200px; margin: 0 0 24px; border-radius: 12px; }
  .flow-refined .product > :not(.product-art) { margin-left: 10px; margin-right: 10px; }
  .flow-refined .product__link { margin-left: 0; }
  .flow-refined .product__text { font-size: 14px; }
  .flow-refined .faq-question { padding: 18px; }
  .flow-refined .faq-answer { padding: 0 18px 22px; }
  .flow-refined .cta__card { padding: 26px 16px; border-radius: 24px; }
  .flow-refined .cta__form-wrapper { padding: 22px 16px; border-radius: 16px; }
  .flow-refined .journey__visual { width: 200px; }
}
.motion-off .flow-refined .product-art img { transform: none; }
.motion-off .flow-refined .reading-progress { display: none; }
@media (prefers-reduced-motion: reduce) {
  .flow-refined .hero__bg::before, .flow-refined .product-art img { transform: none; }
  .flow-refined .reading-progress { display: none; }
}
