.spark-forms-interest {
    display: grid;
    gap: 0.85rem;
    margin-top: 1.5rem;
}

.spark-forms-interest .va-forms-interest__label {
    color: var(--motif-color-text-on-light-strong);
    font-weight: 700;
    letter-spacing: 0;
}

.spark-forms-interest .va-forms-interest__controls {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.7rem;
}

.spark-forms-interest .va-forms-interest__input {
    width: 100%;
    min-height: var(--layout-control-min-height);
    padding: 0 1rem;
    border-radius: var(--motif-radius-control);
    border: 1px solid color-mix(in oklch, var(--motif-color-accent-secondary) 22%, var(--motif-field-border));
    background:
        linear-gradient(
            145deg,
            var(--motif-field-background),
            color-mix(in oklch, var(--motif-color-accent-secondary) 4%, white)
        );
    color: var(--motif-field-text);
    font: inherit;
    transition:
        border-color var(--motif-motion-duration-fast) var(--motif-motion-ease-standard),
        box-shadow var(--motif-motion-duration-fast) var(--motif-motion-ease-standard);
}

.spark-forms-interest .va-forms-interest__input:focus,
.spark-forms-interest .va-forms-interest__input:focus-visible {
    outline: none;
    border-color: var(--motif-field-border-focus);
    box-shadow: var(--motif-field-focus-shadow);
}

/* Submit also carries .spark-btn .spark-btn--solid; these higher-specificity
   declarations mirror it so the control reads identically regardless of which
   plugin/base stylesheet loads last. */
.spark-forms-interest .va-forms-interest__button {
    width: 100%;
    justify-content: center;
    min-height: var(--layout-control-min-height);
    padding: 0.85rem 1.6rem;
    border: 1px solid var(--motif-color-accent-primary);
    border-radius: var(--motif-radius-control);
    background: linear-gradient(
        135deg,
        color-mix(in oklch, var(--motif-color-accent-primary) 88%, white),
        var(--motif-color-accent-primary) 52%,
        color-mix(in oklch, var(--motif-color-accent-primary) 82%, var(--motif-color-accent-secondary))
    );
    color: var(--motif-button-primary-text);
    font-weight: 700;
    letter-spacing: var(--motif-tracking-uppercase-base);
    text-transform: uppercase;
    box-shadow: 0 10px 24px color-mix(in oklch, var(--motif-color-accent-primary) 24%, transparent);
    transition:
        box-shadow var(--motif-motion-duration-fast) var(--motif-motion-ease-standard),
        filter var(--motif-motion-duration-fast) var(--motif-motion-ease-standard),
        transform var(--motif-motion-duration-fast) var(--motif-motion-ease-standard);
}

.spark-forms-interest .va-forms-interest__button:hover {
    filter: saturate(1.08) brightness(0.98);
    box-shadow: 0 14px 30px color-mix(in oklch, var(--motif-color-accent-primary) 30%, transparent);
    transform: translateY(-2px);
}

.spark-forms-interest .va-forms-interest__note {
    padding-top: 0.2rem;
    color: var(--motif-color-text-on-light-medium);
    font-size: var(--motif-type-caption);
}

.spark-forms-interest .va-forms-interest__status,
.spark-forms-interest-status {
    min-height: var(--motif-plugin-status-min-height);
    color: var(--motif-color-accent-secondary);
    font-weight: 700;
}
