/* ============================================================================
   Features page modernization — matches the home green-accent card language.
   Static override (loaded after the Vite bundle) so it deploys without a build.
   Hero untouched.
   ============================================================================ */

/* Feature cards: green gradient icon, green-tinted hover, bolder check badges */
.feature-card {
    border-radius: 20px;
    transition: transform .3s cubic-bezier(.16, 1, .3, 1), box-shadow .3s ease, border-color .3s ease;
}
.feature-card:hover {
    transform: translateY(-6px);
    border-color: #cceee2;
    box-shadow: 0 24px 50px rgba(16, 185, 129, .12);
}
.feature-icon {
    border-radius: 16px;
    background: linear-gradient(135deg, #10b981, #0d9c6f);
    color: #fff;
    box-shadow: 0 8px 18px rgba(16, 185, 129, .30);
}
.feature-chip {
    background: #ecfdf5;
    border-color: #d1fae5;
    color: #047857;
}
.feature-points div { background: #fff; }
.feature-points div::before {
    background: linear-gradient(135deg, #10b981, #0d9c6f);
    color: #fff;
}

/* Overview panel + checklist */
.overview-number { color: rgba(16, 185, 129, .22); }
.overview-mini-list div { background: #fff; }
.overview-mini-list div::before {
    background: linear-gradient(135deg, #10b981, #0d9c6f);
    color: #fff;
}
.panel {
    border-radius: 20px;
    transition: transform .3s cubic-bezier(.16, 1, .3, 1), box-shadow .3s ease, border-color .3s ease;
}
.panel:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 46px rgba(16, 185, 129, .10);
    border-color: #cceee2;
}
.outcome-box { background: #fff; transition: border-color .3s ease, box-shadow .3s ease; }
.outcome-box:hover { border-color: #cceee2; box-shadow: 0 12px 28px rgba(16, 185, 129, .08); }

/* Process: green circular node number + green hover (matches home timeline) */
.process-card {
    border-radius: 18px;
    transition: transform .3s cubic-bezier(.16, 1, .3, 1), box-shadow .3s ease, border-color .3s ease;
}
.process-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 46px rgba(16, 185, 129, .11);
    border-color: #cceee2;
}
.process-card .num {
    display: inline-grid;
    place-items: center;
    min-width: 56px; height: 42px;
    padding: 0 14px;
    border-radius: 13px;
    background: linear-gradient(135deg, #10b981, #0d9c6f);
    color: #fff;
    font-weight: 800;
    font-size: 15px;
    letter-spacing: .02em;
    box-shadow: 0 8px 18px rgba(16, 185, 129, .28);
    margin-bottom: 6px;
}

/* FAQ polish */
.faq-item { transition: border-color .3s ease, box-shadow .3s ease; }
.faq-item:hover { border-color: #cceee2; }
.faq-item.active { border-color: #cceee2; box-shadow: 0 16px 40px rgba(16, 185, 129, .08); }
.faq-icon { transition: transform .3s ease, background .3s ease, color .3s ease; }
.faq-item.active .faq-icon { transform: rotate(45deg); }