@layer components {

    /* ══════════════════════════════════════════════════════════════
       Marketing signup form — panel and footnote, nothing more.

       The fields are the project-owned form controls: <app-textbox>
       for text, <app-checkbox> for consent, .c-deadline-chips for an
       option pick. app-common.css imports forms/ and marketing/
       together and the marketing layout emits <app-head-assets>, so
       those controls arrive styled and token-themed on a marketing
       page with no help from this file.

       The panel repeats .c-deadline-filter's four declarations rather
       than borrowing a class named for filtering. If a third marketing
       panel appears, extract .c-marketing-panel and drop both.
       ══════════════════════════════════════════════════════════════ */
    .c-signup {
        padding: var(--space-6);
        background: var(--color-surface);
        border: 1px solid var(--color-line);
        border-radius: var(--radius-sm);
    }

    .c-signup__note {
        margin-top: var(--space-4);
        padding-top: var(--space-4);
        border-top: 1px solid var(--color-line);
        font-size: var(--fs-ui-sm);
        color: var(--color-ink-mute);
        max-width: var(--measure-body);
    }
}