/* Lower-page demonstrations: a fast hit, an overshoot, then a readable hold.
   The hero and ticker keep their existing clocks and choreography. */
.feature.motion-section, .intelligence-visual.motion-section,
.section-scene { --lower-motion-cycle: 4.8s; }
.feature-menu .qr-card, .feature-menu .menu-chips > span,
.feature-operation .order-stack > div, .feature-control .control-art > div:not(.mini-report) > svg,
.intelligence-visual .invoice-art, .intelligence-visual .review-note,
.network-node, .case-business, .faq-question, .faq-answer, .faq-resolved,
.contact-emblem, .contact-satellite, .footer-token { animation-timing-function: var(--ease-out); }

.feature-menu .menu-art { padding-top: 60px; padding-bottom: 24px; }
.feature-menu .menu-chips > span:nth-child(2) { animation-delay: .08s; }
.feature-menu .menu-chips > span:nth-child(3) { animation-delay: .16s; }
@keyframes fogono-qr-card {
  0%, 6%, 100% { transform: translateY(4px) rotate(-8deg) scale(.8); }
  10% { transform: translateY(-10px) rotate(7deg) scale(1.28); }
  15%, 34% { transform: translateY(-5px) rotate(3deg) scale(1.12); }
  39%, 82% { transform: translateY(0) rotate(-4deg) scale(.98); }
  88% { transform: translateY(4px) rotate(-8deg) scale(.8); }
}
@keyframes fogono-menu-result {
  0%, 17%, 100% { opacity: .2; transform: translate(8px, 20px) rotate(-8deg) scale(.8); }
  21% { opacity: 1; transform: translate(4px, -4px) rotate(5deg) scale(1.2); }
  26%, 82% { opacity: 1; transform: translate(4px, 0) rotate(-2deg) scale(1.02); }
  88% { opacity: .2; transform: translate(8px, 20px) rotate(-8deg) scale(.8); }
}

.feature-operation .order-stack { height: 248px; min-height: 248px; }
.feature-operation .order-stack > div { top: 34px; left: 10%; right: 10%; }
.feature-operation .order-stack > div:nth-child(1) { animation-delay: -3.2s; }
.feature-operation .order-stack > div:nth-child(2) { animation-delay: -1.6s; }
@keyframes fogono-order-queue {
  0%, 25%, 100% { opacity: .65; transform: translateY(120px) rotate(4deg) scale(.8); }
  29% { opacity: 1; transform: translateY(56px) rotate(-2deg) scale(1.05); }
  34%, 58% { opacity: 1; transform: translateY(60px) rotate(0) scale(.98); }
  62% { opacity: 1; transform: translateY(-4px) rotate(-4deg) scale(1.16); }
  67%, 88% { opacity: 1; transform: translateY(0) rotate(-2deg) scale(1.08); }
  92% { opacity: 0; transform: translateY(-84px) rotate(7deg) scale(.88); }
  94% { opacity: 0; transform: translateY(190px) rotate(4deg) scale(.8); }
}

.feature-control .control-art { min-height: 284px; }
.feature-control .control-art > div:not(.mini-report) { top: 88px; gap: 8px; }
.feature-control .control-art > div:not(.mini-report) > svg { box-sizing: border-box; width: 56px; height: 56px; padding: 12px; }
.feature-control .control-art > div:not(.mini-report) > svg:nth-child(2) { animation-delay: .08s; }
.feature-control .control-art > div:not(.mini-report) > svg:nth-child(3) { animation-delay: .16s; }
@keyframes fogono-operation-icon {
  0%, 7%, 100% { transform: translateY(4px) rotate(-7deg) scale(.78); }
  11% { transform: translateY(-18px) rotate(8deg) scale(1.4); }
  16%, 35% { transform: translateY(-5px) rotate(-3deg) scale(1.12); }
  41%, 82% { transform: translateY(0) rotate(0) scale(1); }
  90% { transform: translateY(4px) rotate(-7deg) scale(.78); }
}
@keyframes fogono-report-bar {
  0%, 24%, 100% { transform: scaleY(.12); }
  28% { transform: scaleY(1.32); }
  33%, 80% { transform: scaleY(1); }
  88% { transform: scaleY(.12); }
}

.intelligence-visual { padding-block: 96px 88px; }
.intelligence-visual .invoice-art > div:nth-of-type(3) { animation-delay: .12s; }
@keyframes fogono-invoice-paper {
  0%, 6%, 100% { transform: translateY(14px) rotate(-9deg) scale(.82); }
  10% { transform: translateY(-12px) rotate(6deg) scale(1.26); }
  15%, 34% { transform: translateY(-3px) rotate(-3deg) scale(1.08); }
  40%, 82% { transform: translateY(0) rotate(-3deg) scale(1); }
  89% { transform: translateY(14px) rotate(-9deg) scale(.82); }
}
@keyframes fogono-invoice-paper-mobile {
  0%, 6%, 100% { transform: translateY(10px) rotate(-7deg) scale(.82); }
  10% { transform: translateY(-8px) rotate(4deg) scale(1.16); }
  15%, 34% { transform: translateY(-2px) rotate(-3deg) scale(1.04); }
  40%, 82% { transform: translateY(0) rotate(-3deg) scale(.98); }
  89% { transform: translateY(10px) rotate(-7deg) scale(.82); }
}
@media (max-width: 1199px) {
  .intelligence-visual .invoice-art { animation-name: fogono-invoice-paper-mobile; }
}

.module-network { --network-rise: 70px; height: 280px; }
.network-node { width: clamp(52px, 5vw, 84px); height: clamp(52px, 5vw, 84px); padding: 14px; }
.network-hub { width: clamp(68px, 6vw, 100px); height: clamp(68px, 6vw, 100px); padding: 18px; }
.network-order, .packet-in-bottom { animation-delay: .44s; }
.network-hub { animation-delay: .88s; }
.network-wallet { animation-delay: 1.6s; }
.network-stock { animation-delay: 2.04s; }
.packet-out-top { animation-delay: 1.24s; }
.packet-out-bottom { animation-delay: 1.68s; }
.network-packet { width: 24px; height: 24px; margin: -12px; }
.business-one { animation-delay: 1.04s; }
.business-two { animation-delay: 1.6s; }
.business-three { animation-delay: 2.16s; }
.case-packet-two { animation-delay: .56s; }
.case-packet-three { animation-delay: 1.12s; }
.satellite-one { animation-delay: .4s; }
.satellite-two { animation-delay: 2s; }
.token-two { animation-delay: .96s; }
.token-three { animation-delay: 1.92s; }
.token-four { animation-delay: 2.88s; }
.token-one { left: 14%; }
.token-three { left: 62%; }
.token-four { left: 86%; }
.footer-track { left: 14%; right: 14%; }
.footer-packet { left: 14%; }
@keyframes section-footer-packet {
  0%, 10% { transform: translateX(0) rotate(0) scale(.8); opacity: 0; }
  14%, 30% { transform: translateX(0) rotate(0) scale(1.2); opacity: 1; }
  34%, 50% { transform: translateX(24cqw) rotate(90deg) scale(1.2); opacity: 1; }
  54%, 70% { transform: translateX(48cqw) rotate(180deg) scale(1.2); opacity: 1; }
  74%, 82% { transform: translateX(72cqw) rotate(270deg) scale(1.2); opacity: 1; }
  88%, 100% { transform: translateX(72cqw) rotate(360deg) scale(.8); opacity: 0; }
}
@keyframes section-node-pop {
  0%, 6%, 100% { transform: translate(-50%, -50%) rotate(-5deg) scale(.76); }
  10% { transform: translate(-50%, -50%) rotate(-9deg) scale(.86); }
  14% { transform: translate(-50%, -50%) rotate(7deg) scale(1.34); }
  19%, 34% { transform: translate(-50%, -50%) rotate(-3deg) scale(1.1); }
  41%, 84% { transform: translate(-50%, -50%) rotate(0) scale(1); }
  92% { transform: translate(-50%, -50%) rotate(-5deg) scale(.76); }
}
@keyframes section-hub-wave {
  0%, 16%, 100% { transform: translate(-50%, -50%) scale(.65); opacity: .25; }
  20%, 30% { transform: translate(-50%, -50%) scale(1.5); opacity: 1; }
  38%, 80% { transform: translate(-50%, -50%) scale(.9); opacity: .35; }
  90% { transform: translate(-50%, -50%) scale(.65); opacity: .25; }
}

.faq-question { left: 12%; top: 36px; }
.faq-answer { right: 14%; }
.faq-resolved { right: 10%; bottom: 28px; }
@keyframes section-question {
  0%, 6%, 100% { transform: rotate(-9deg) scale(.78); }
  10% { transform: rotate(7deg) scale(1.22); }
  15%, 33% { transform: rotate(-3deg) scale(1.04); }
  40%, 82% { transform: rotate(-5deg) scale(.94); }
  90% { transform: rotate(-9deg) scale(.78); }
}
@keyframes section-answer {
  0%, 15%, 100% { transform: translateX(12px) rotate(7deg) scale(.76); opacity: .25; }
  19% { transform: translateX(-4px) rotate(-7deg) scale(1.26); opacity: 1; }
  24%, 76% { transform: translateX(0) rotate(-3deg) scale(1.06); opacity: 1; }
  84% { transform: translateX(12px) rotate(7deg) scale(.76); opacity: .25; }
}
@keyframes section-answer-check {
  0%, 24%, 100% { transform: rotate(-30deg) scale(.7); opacity: 0; }
  28% { transform: rotate(10deg) scale(1.38); opacity: 1; }
  33%, 76% { transform: rotate(-4deg) scale(1.06); opacity: 1; }
  85% { transform: rotate(12deg) scale(.7); opacity: 0; }
}

.contact-orbit { animation-duration: 7.2s; }
.orbit-two { animation-delay: -1.8s; }
@keyframes section-orbit {
  0%, 8% { transform: translate(-50%, -50%) rotate(25deg) scale(.78); }
  11%, 33% { transform: translate(-50%, -50%) rotate(115deg) scale(1.04); }
  36%, 58% { transform: translate(-50%, -50%) rotate(205deg) scale(.78); }
  61%, 83% { transform: translate(-50%, -50%) rotate(295deg) scale(1.04); }
  86%, 100% { transform: translate(-50%, -50%) rotate(385deg) scale(.78); }
}
@keyframes section-contact-emblem {
  0%, 6%, 100% { transform: translate(-50%, -50%) rotate(-9deg) scale(.78); }
  10% { transform: translate(-50%, -50%) rotate(10deg) scale(1.3); }
  15%, 34% { transform: translate(-50%, -50%) rotate(-4deg) scale(1.1); }
  40%, 78% { transform: translate(-50%, -50%) rotate(3deg) scale(1); }
  88% { transform: translate(-50%, -50%) rotate(-9deg) scale(.78); }
}

.workflow-demo .scene-icon { animation-name: impact-workflow-icon; animation-duration: 4s; animation-timing-function: var(--ease-out); animation-iteration-count: infinite; }
@keyframes impact-workflow-icon {
  0%, 8%, 100% { transform: rotate(-5deg) scale(.8); }
  12% { transform: rotate(7deg) scale(1.3); }
  17%, 75% { transform: rotate(-2deg) scale(1.04); }
  86% { transform: rotate(-5deg) scale(.8); }
}

/* One entrance for each lower section; reading positions remain stable after it. */
@media (prefers-reduced-motion: no-preference) {
  .will-reveal {
    opacity: 0;
    transform: translateY(36px);
    transition: opacity 220ms var(--ease-out), transform 360ms var(--ease-out);
  }
  .will-reveal:is(.feature, .module-card, .intelligence-visual, .workflow-demo, .case-label) {
    transform: translateY(40px) scale(.94);
  }
  .will-reveal.is-visible { opacity: 1; transform: translateY(0) scale(1); }
  .will-reveal:focus-within { opacity: 1; transform: none; transition: none; }
}
body[data-motion="paused"] .will-reveal { opacity: 1; transform: none; transition: none; }

.case-origin {
  animation-name: impact-case-origin;
  animation-duration: var(--lower-motion-cycle, 4.8s);
  animation-timing-function: var(--ease-out);
  animation-iteration-count: infinite;
}
.case-origin::before { inset: -8px; }
@keyframes impact-case-origin {
  0%, 6%, 100% { transform: translate(-50%, -50%) rotate(-2deg) scale(.86); }
  10% { transform: translate(-50%, -50%) rotate(2deg) scale(1.12); }
  15%, 34% { transform: translate(-50%, -50%) rotate(-1deg) scale(1.02); }
  41%, 82% { transform: translate(-50%, -50%) rotate(0) scale(1); }
  90% { transform: translate(-50%, -50%) rotate(-2deg) scale(.86); }
}
@keyframes section-origin-ring {
  0%, 6%, 100% { transform: rotate(0) scale(.75); opacity: .35; }
  10% { transform: rotate(-6deg) scale(1.2); opacity: 1; }
  15%, 32% { transform: rotate(3deg) scale(1); opacity: 1; }
  40%, 80% { transform: rotate(0) scale(.9); opacity: .65; }
  90% { transform: rotate(0) scale(.75); opacity: .35; }
}
@media (prefers-reduced-motion: reduce) {
  body:not([data-motion-opt-in="true"]) .case-origin { transform: translate(-50%, -50%); }
  body:not([data-motion-opt-in="true"]) .case-origin::before { transform: rotate(0) scale(1); opacity: .7; }
}
