html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }

/* Dashed connecting line between steps */
.step-connector {
    background-image: repeating-linear-gradient(
        90deg,
        #00C897 0, #00C897 6px,
        transparent 6px, transparent 14px
    );
    background-size: 14px 2px;
    background-repeat: repeat-x;
    background-position: center;
}

/* FAQ accordion */
.faq-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.faq-body.open { max-height: 360px; }
.faq-icon { transition: transform 0.35s ease; }
.faq-item.open .faq-icon { transform: rotate(45deg); }

/* Protocol tag lift on hover */
.proto-tag { transition: transform 0.18s ease, box-shadow 0.18s ease; }
.proto-tag:hover { transform: translateY(-3px); }

/* Subtle stat counter entrance */
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}
.stat-num { animation: fadeUp 0.55s ease-out both; }

/* Marquee ticker */
@keyframes ticker {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
.ticker-track { animation: ticker 22s linear infinite; }
.ticker-track:hover { animation-play-state: paused; }

/* Step circle hover */
.step-circle { transition: background-color 0.25s ease, box-shadow 0.25s ease; }
.step-group:hover .step-circle {
    background-color: #00C897;
    box-shadow: 0 0 0 6px rgba(0, 200, 151, 0.15);
}

/* Feature strip hover */
.feature-strip { transition: box-shadow 0.25s ease, transform 0.25s ease; }
.feature-strip:hover { box-shadow: 0 8px 32px rgba(0,0,0,0.07); transform: translateY(-2px); }