/*
 * index archive CARD styles — <style> C (dentro if use_tosc_archive_cards). Fase 6.
 */
        .bon-tosc-archive {
            background: #f8fafc;
            color: #050505;
        }
        .bon-tosc-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 1rem;
            max-width: calc((280px * 4) + (1rem * 3));
            margin-left: auto;
            margin-right: auto;
        }
        .bon-tosc-card {
            display: flex;
            flex-direction: column;
            overflow: hidden;
            border-radius: 0.3rem !important;
            background: #ffffff;
            border: 1px solid #e5e7eb;
            box-shadow: 0 18px 42px rgba(15,23,42,0.11);
            cursor: pointer;
            transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
            min-height: 100%;
        }
        .bon-tosc-card:hover {
            transform: translateY(-4px);
            border-color: rgba(220,38,38,0.26);
            box-shadow: 0 26px 62px rgba(15,23,42,0.16);
        }
        .bon-tosc-card__image {
            position: relative;
            aspect-ratio: 16 / 10;
            background: #e2e8f0;
            overflow: hidden;
            border-radius: 0.3rem 0.3rem 0 0;
        }
        .bon-tosc-card__image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transition: transform 0.5s ease;
        }
        .bon-tosc-card:hover .bon-tosc-card__image img {
            transform: scale(1.04);
        }
        .bon-tosc-card__body {
            display: flex;
            flex: 1;
            flex-direction: column;
            padding: 0.88rem 1rem 1rem;
        }
        .bon-tosc-card__meta {
            display: flex;
            flex-wrap: wrap;
            gap: 0.45rem;
            margin-bottom: 0.7rem;
        }
        .bon-tosc-card__pill {
            display: inline-flex;
            align-items: center;
            border-radius: 0;
            background: transparent;
            color: #475569;
            padding: 0;
            font-size: 0.75rem;
            font-weight: 700;
            line-height: 1.25;
        }
        .bon-tosc-card__title {
            color: #050505;
            font-size: var(--bon-card-title-size, 0.8rem);
            font-weight: var(--bon-card-title-weight, 800);
            line-height: var(--bon-card-title-line, 1.3);
            letter-spacing: var(--bon-card-title-tracking, 0.08em);
            text-transform: uppercase;
            margin: 0 0 0.5rem;
        }
        .bon-tosc-card__excerpt {
            color: #334155;
            font-size: 0.8rem;
            line-height: 1.3;
            margin: 0 0 0.8rem;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        .bon-tosc-card__tag {
            align-self: flex-start;
            margin-top: auto;
            border-radius: 0;
            background: transparent;
            color: #b91c1c;
            padding: 0;
            font-size: 0.7rem;
            font-weight: 800;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }
        .bon-tosc-card--routes-map {
            border-color: rgba(22, 163, 74, 0.32) !important;
        }
        .bon-tosc-card--routes-map:hover {
            border-color: #16a34a !important;
        }
        .bon-tosc-card--routes-map .bon-tosc-card__image::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(15, 23, 42, 0.02), rgba(15, 23, 42, 0.38));
            pointer-events: none;
        }
        .bon-tosc-card--routes-map .bon-tosc-card__tag {
            color: #16a34a !important;
        }
        @media (max-width: 1180px) {
            .bon-tosc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
        }
        @media (max-width: 920px) {
            .bon-tosc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        }
        @media (max-width: 720px) {
            .bon-tosc-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 0.75rem;
                padding-inline: 0.75rem;
            }
            .bon-tosc-card__body { padding: 0.72rem; }
            .bon-tosc-card__image { aspect-ratio: 4 / 3; }
            .bon-tosc-card__title {
                font-size: 0.78rem;
                line-height: 1.08;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }
            .bon-tosc-card__excerpt,
            .bon-tosc-card__tag {
                display: none;
            }
        }

        /* Phase 5 UX theme pass: archive cards */
        .bon-tosc-archive {
            background: var(--bon-bg) !important;
            color: var(--bon-text) !important;
        }
        .bon-tosc-card {
            background: var(--bon-surface) !important;
            color: var(--bon-text) !important;
            border-color: var(--bon-border) !important;
            box-shadow: var(--bon-shadow-card) !important;
        }
        .bon-tosc-card:hover {
            border-color: var(--bon-brand) !important;
            box-shadow: var(--bon-shadow-panel) !important;
        }
        .bon-tosc-card__image {
            background: var(--bon-surface-soft) !important;
        }
        .bon-tosc-card__pill {
            background: transparent !important;
            color: var(--bon-text-muted) !important;
            border: 0 !important;
        }
        .bon-tosc-card__title {
            color: var(--bon-heading) !important;
        }
        .bon-tosc-card__excerpt {
            color: var(--bon-text-muted) !important;
        }
        .bon-tosc-card__tag {
            background: transparent !important;
            color: var(--bon-brand) !important;
            border: 0 !important;
        }