/* mobile-home.css — mobile rules extracted from home-styles.css.
   Loaded immediately after home-styles.css so the cascade is unchanged. */

@media (max-width: 576px) {
    .bob-hero-card {
        display: block;
        background: var(--bs-gray-50, #f8f9fa);
        border: 1px solid var(--bs-gray-200, #e9ecef);
        border-radius: 16px;
        padding: 12px 14px;
    }

    .bob-hero-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }

    .bob-hero-actions-label {
        font-size: 13px;
        font-weight: 600;
        color: var(--bs-gray-500, #adb5bd);
        margin-right: 2px;
    }

    .bob-hero-action {
        background: #fff;
        border: 1px solid var(--bs-gray-200, #e9ecef);
        border-radius: 20px;
        padding: 7px 13px;
        font-size: 13px;
        font-weight: 500;
        color: var(--bs-gray-700, #495057);
        cursor: pointer;
        white-space: nowrap;
        display: inline-flex;
        align-items: center;
        transition: all 0.15s ease;
        -webkit-tap-highlight-color: transparent;
    }

    .bob-hero-action:active {
        background: var(--bs-primary-50, #fff5eb);
        border-color: var(--bs-primary-300, #feb272);
        color: var(--bs-primary-700, #c45d0a);
    }
}