/*
 * File: public/css/credit-cards/finder-card-list.css
 * Version: RB-FINDER-CARD-CSS-V1.1.0-20260812
 * Parity baseline: exact category-pages.css supplied with category card V4.3.2.
 * Finder exception: the former action column is placed at the bottom.
 */

/* public\css\credit-cards\category-pages.css — exact mirrored baseline */
   
   /* Global Page Styles */
    .section-title { font-weight: 700; color: #212529; }
    #card-listings-container > *:not(:last-child) { margin-bottom: 1.25rem; }

/* Sleek, Low-Height Category Hero */
.category-hero-sleek {
    background-color: #f0fff8; /* Kept the light green background */
    padding: 1.5rem 0; /* Reduced padding for a slim profile */
    border-bottom: 1px solid #d6eee3;
}

.hero-sleek-icon {
    font-size: 3rem; /* Smaller, more subtle icon */
    color: #198754;
    opacity: 0.7;
    line-height: 1;
}

.hero-sleek-title {
    font-size: 1.5rem; /* Reduced title size for a sleeker look */
    font-weight: 700;
    color: #0b4f30;
    margin: 0;
}

.hero-sleek-subtitle {
    font-size: 1rem;
    color: #495057;
    margin-top: 0.1rem;
}

.category-hero-sleek .btn {
    padding: 0.5rem 1rem; /* Smaller buttons to fit the slim design */
    font-size: 0.9rem;
    font-weight: 500;
    white-space: nowrap; /* Prevents buttons from wrapping on small screens */
}

/* Responsive adjustments for mobile */
@media (max-width: 991.98px) {
    .category-hero-sleek {
       text-align: center;
    }
    .hero-sleek-icon {
        margin: 0 auto 0.75rem; /* Center icon above text on mobile */
    }
    .hero-sleek-title {
        font-size: 1.3rem;
    }
    .hero-sleek-subtitle {
        font-size: 0.95rem;
    }
}    


    /* Value Prop Section */
    .feature-box {
        background: #fff;
        padding: 2rem;
        border-radius: 12px;
        height: 100%;
        border: 1px solid #dee2e6;
        transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    }
    .feature-box:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.06);
    }
    .feature-icon {
        font-size: 2.5rem;
        margin-bottom: 1rem;
    }
    
    /* Pro Tip Section */
    .pro-tip-box {
        display: flex;
        align-items: center;
        background: #fff;
        border: 1px solid #dee2e6;
        padding: 2rem;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    }
    .pro-tip-icon {
        font-size: 2.5rem;
        margin-right: 1.5rem;
    }

    /* FAQ Section */
    .accordion-item {
        border-radius: 8px !important;
        margin-bottom: 1rem;
        border: 1px solid #dee2e6;
    }
    .accordion-button {
        font-weight: 600;
    }
    .accordion-button:not(.collapsed) { 
        background-color: #e8f3ee; 
        color: #0b4f30;
        box-shadow: none;
    }

    /* for the new card style like finder page */

    /* --- Smart Card CSS (Finder Clone) --- */
    .smart-card-wrapper { 
        background: #fff; 
        border: 1px solid #e2e8f0; 
        border-radius: 12px; 
        overflow: hidden; 
        position: relative;
        transition: transform 0.2s, box-shadow 0.2s;
        margin-bottom: 1.5rem;
    }
    .smart-card-wrapper:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.08);
        border-color: #cbd5e1;
    }

    /* Grid Layout */
    .card-main-grid {
        display: grid;
        grid-template-columns: 160px 1fr 200px; /* Visual | Content | Actions */
        gap: 1.5rem;
        padding: 1.25rem;
        align-items: start;
    }

    /* Visual Column */
    .col-visual { display: flex; flex-direction: column; align-items: center; }
    .card-img-wrapper { 
        height: 100px; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; 
    }
    .card-img-wrapper img { max-width: 100%; max-height: 100%; object-fit: contain; }

    /* Portrait/tall credit card image handling.
    Default horizontal card image behavior remains unchanged. */
    .card-img-wrapper.rb-card-img-portrait {
        height: 124px;
    }

    .card-img-wrapper.rb-card-img-portrait img.rb-credit-card-product-img {
        width: auto;
        max-width: 82px;
        max-height: 124px;
        object-fit: contain;
    }

    /* Mini Stats Grid */
    .mini-stats-grid { display: grid; grid-template-columns: 1fr; gap: 4px; width: 100%; }
    .mini-stat-box { 
        background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 4px; 
        padding: 2px 6px; display: flex; justify-content: space-between; align-items: center; 
    }
    .mini-stat-label { font-size: 0.65rem; color: #64748b; font-weight: 600; text-transform: uppercase; }
    .mini-stat-val { font-size: 0.75rem; font-weight: 700; color: #334155; }

    /* Content Column */
    .col-content { display: flex; flex-direction: column; }
    .product-title { font-size: 1.2rem; font-weight: 800; color: #0f172a; margin-bottom: 4px; text-decoration: none; line-height: 1.2; }
    .product-title:hover { color: #0d6efd; }
    .provider-line { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
    .provider-logo-small { height: 16px; width: auto; }
    .provider-name { font-size: 0.75rem; color: #64748b; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }

    /* The 2-Letter Fallback Badge (Matches Admin V2 Style) */
    .provider-logo-fallback {
        height: 20px;
        width: 20px;
        font-size: 0.55rem;
        flex-shrink: 0;
        box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    }

    /* Highlights */
    .value-highlight-box { 
        display: inline-flex; align-items: center; background: #ecfdf5; border: 1px solid #bbf7d0; 
        color: #15803d; padding: 4px 8px; border-radius: 4px; font-weight: 700; font-size: 0.85rem; margin-bottom: 8px; width: fit-content;
    }
    .ratings-row { display: flex; gap: 12px; margin-bottom: 8px; font-size: 0.75rem; color: #64748b; }
    .best-for-line { font-size: 0.8rem; color: #475569; margin-bottom: 4px; }
    .bonus-text { font-size: 0.85rem; color: #334155; line-height: 1.4; margin-top: 4px; }
    .plain-features { font-size: 0.75rem; color: #64748b; margin-top: 8px; line-height: 1.4; }

    /* Actions Column */
    .col-actions { display: flex; flex-direction: column; justify-content: center; height: 100%; border-left: 1px solid #f1f5f9; padding-left: 1.5rem; gap: 10px; }

    /* Drawer */
    .details-drawer { border-top: 1px solid #e2e8f0; background: #fff; }
    .drawer-tabs { display: flex; background: #f8fafc; border-bottom: 1px solid #e2e8f0; }
    .drawer-tab { flex: 1; padding: 10px; text-align: center; font-size: 0.85rem; font-weight: 600; color: #64748b; border: none; background: transparent; border-bottom: 2px solid transparent; transition: all 0.2s; }
    .drawer-tab:hover { background: #e2e8f0; color: #0f172a; }
    .drawer-tab.active { background: #fff; color: #0d6efd; border-bottom-color: #0d6efd; }
    .drawer-content { padding: 1.5rem; }

    /* new css for extra drawer clode */

    /* Drawer close action */
    .drawer-close-details {
        border: none;
        border-left: 1px solid #e2e8f0;
        background: #ffffff;
        color: #64748b;
        padding: 10px 14px;
        font-size: 0.78rem;
        font-weight: 800;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        white-space: nowrap;
        transition: all 0.2s ease;
        flex: 0 0 auto;
        cursor: pointer;
    }

    .drawer-close-details:hover {
        background: #fff7ed;
        color: #c2410c;
    }

    .drawer-close-details i {
        font-size: 0.85rem;
    }

    /* Mobile: keep close action compact */
    @media (max-width: 767.98px) {
        .drawer-tabs {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
        }

        .drawer-tab {
            flex: 0 0 auto;
            min-width: 96px;
        }

        .drawer-close-details {
            padding: 10px 12px;
            flex: 0 0 auto;
        }

        .drawer-close-details span {
            display: none;
        }

        .drawer-close-details i {
            font-size: 1rem;
        }
    }

    /* new css for extra drawer close */



    /* Badges */
    .badge-top-right { position: absolute; top: 0; right: 0; font-size: 0.6rem; text-transform: lowercase; letter-spacing: 0.5px; padding: 3px 10px; background-color: #f1f5f9; color: #64748b; border-bottom-left-radius: 4px; z-index: 10; font-weight: 600; }
    .badge-top-right.featured { background-color: #fffbeb; color: #b45309; border: 1px solid #fcd34d; border-top: 0; border-right: 0; }

    
    /* Responsive */
    /*
    @media (max-width: 991px) {
        .card-main-grid { grid-template-columns: 1fr; gap: 1rem; }
        .col-visual { flex-direction: row; align-items: center; gap: 1rem; border-bottom: 1px solid #f1f5f9; padding-bottom: 1rem; }
        .card-img-wrapper { width: 100px; height: 70px; margin-bottom: 0; }
        .mini-stats-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
        .col-actions { border-left: none; padding-left: 0; border-top: 1px solid #f1f5f9; padding-top: 1rem; flex-direction: row; }
    }
    */

    @media (max-width: 991px) {
        .card-main-grid { grid-template-columns: 1fr; gap: 1rem; }
        .col-visual { flex-direction: row; align-items: center; gap: 1rem; border-bottom: 1px solid #f1f5f9; padding-bottom: 1rem; }
        .card-img-wrapper { width: 100px; height: 70px; margin-bottom: 0; }
        .mini-stats-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
        .col-actions { border-left: none; padding-left: 0; border-top: 1px solid #f1f5f9; padding-top: 1rem; flex-direction: row; }

        .card-img-wrapper.rb-card-img-portrait {
            width: 82px;
            height: 112px;
            flex: 0 0 82px;
            margin-bottom: 0;
        }

        .card-img-wrapper.rb-card-img-portrait img.rb-credit-card-product-img {
            width: auto;
            max-width: 72px;
            max-height: 112px;
        }
    } 


    /* for the new card style like finder page */


    /* Css for drawer */

    /* Drawer Transitions */
    .details-drawer {
        display: none; /* Hidden by default */
        border-top: 1px solid #e2e8f0;
        background-color: #fff;
        overflow: hidden;
    }

    .details-drawer.show {
        display: block; /* Show when active */
        animation: slideDown 0.3s ease-out forwards;
    }

    @keyframes slideDown {
        from { opacity: 0; transform: translateY(-10px); }
        to { opacity: 1; transform: translateY(0); }
    }

    /* Tab Content */
    .tab-pane {
        animation: fadeIn 0.3s ease-in;
    }

    @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }
    /* Css for drawer */


    
    
    /* --- HORIZONTAL DISCOVERY RIBBON (NextGen Style) --- */
    .discovery-track-wrapper {
        width: 100%;
        overflow: hidden;
    }

    .discovery-ribbon-track {
        display: flex;
        overflow-x: auto;
        gap: 1.5rem; /* 24px gap */
        scroll-snap-type: x mandatory;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none; /* Hide in Firefox */
    }

    .discovery-ribbon-track::-webkit-scrollbar {
        display: none; /* Hide in Chrome/Safari */
    }

    /* Card Sizing Engine */
    .discovery-card {
        /* DEFAULT (Mobile): Shows 1 full card, and the edge of the next one (hinting to swipe) */
        flex: 0 0 calc(85% - 1.5rem); 
        scroll-snap-align: start;
        border-radius: 12px !important; 
        background: #ffffff;
        position: relative;
    }

    /* Tablet (Shows ~2.5 cards) */
    @media (min-width: 768px) {
        .discovery-card {
            flex: 0 0 calc(45% - 1.5rem); 
        }
    }

    /* Desktop (Exactly 4 Cards Edge-to-Edge) */
    @media (min-width: 992px) {
        .discovery-card {
            /* 100% divided by 4 cards = 25%. Minus the gap math. */
            flex: 0 0 calc(25% - 1.125rem); 
        }
    }

    /* --- NEXTGEN COMPACT STYLES (Ported from Featured Banner) --- */
    .nextgen-promos {
        color: #000;
        font-weight: 500;
        line-height: 1.3;
        -webkit-font-smoothing: antialiased;
    }
    .promo-label {
        font-weight: 700;
        text-transform: uppercase;
        font-size: 0.65rem;
    }

    /* NUCLEAR OVERRIDE AGAINST GLOBAL TRUNCATION (From your code) */
    .promo-raw-text, .promo-raw-text p, .promo-raw-text ul, .promo-raw-text li {
        display: inline !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #000 !important;
        list-style: none !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        word-wrap: break-word !important;
    }

    .nextgen-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        margin-top: 4px;
    }
    .nextgen-chip {
        border-radius: 4px;
        padding: 2px 6px;
        font-size: 0.65rem;
        line-height: 1.2;
        white-space: nowrap;
        border: 1px solid;
    }
    .chip-fee { background-color: #f0f9ff; color: #0369a1; border-color: #bae6fd; }
    .chip-fee strong { color: #0284c7; }
    .chip-purch { background-color: #fdf4ff; color: #a21caf; border-color: #f5d0fe; }
    .chip-purch strong { color: #86198f; }
    .chip-cash { background-color: #f0fdf4; color: #047857; border-color: #bbf7d0; }
    .chip-cash strong { color: #059669; }

    /* Premium Light Yellow Value Box */
    .nextgen-value-display {
        background-color: #fffbeb;
        border: 1px solid #fde68a; 
        border-radius: 6px;
        padding: 4px 8px;
        text-align: center;
        box-shadow: 0 1px 2px rgba(245, 158, 11, 0.05);
    }
    .value-label {
        font-size: 0.6rem;
        text-transform: uppercase;
        color: #92400e; 
        font-weight: 700; 
        display: block;
        line-height: 1;
    }
    .value-amount {
        font-size: 1.05rem;
        font-weight: 800;
        line-height: 1;
        display: block;
        margin-top: 2px;
    }

    /* UI Polish */
    .discovery-scroll-btn {
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-color: #cbd5e1;
        color: #475569;
        transition: all 0.2s ease;
    }

    .discovery-scroll-btn:hover {
        background-color: #f1f5f9 !important;
        color: #0f172a;
    }

    .transition-hover {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .transition-hover:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 20px -5px rgba(0,0,0,0.1), 0 8px 10px -6px rgba(0,0,0,0.1) !important;
    }

    /* Utility: Clamps text to preserve symmetry */
    .line-clamp-2 {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;  
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .line-clamp-3 {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;  
        overflow: hidden;
        text-overflow: ellipsis;
    }



    /* ========================================================= */
    /* --- SMART FILTER CALCULATOR BAR --- */
    /* ========================================================= */

    /* STICKY WRAPPER */
    .sticky-calc-wrapper {
        position: sticky;
        top: 15px;
        z-index: 900;
        transition: top 0.3s;
    }

    /* CARD STYLING */
    #calculator-bar {
        border-radius: 12px;
        background: #f1f5f9; /* Premium Tinted Background */
        border: 1px solid #e2e8f0;
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.025) !important;
        padding: 12px 16px !important;
    }

    /* SYMMETRY ENGINE: Safely Scoped to the Calculator */
    #calculator-bar .form-control, 
    #calculator-bar .input-group-text, 
    #calculator-bar .ts-control, 
    #calculator-bar .filter-pill {
        height: 38px !important;
        min-height: 38px !important;
        font-size: 0.9rem !important;
        display: flex;
        align-items: center;
        background-color: #ffffff !important; /* Force pure white to pop */
    }

    /* INPUTS */
    #calculator-bar .form-control:focus { box-shadow: none; border-color: #0d6efd; }

    /* TOGGLE PILLS */
    #calculator-bar .filter-pill {
        transition: all 0.2s ease;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        border: 1px solid #e2e8f0 !important;
    }
    #calculator-bar .filter-pill:hover {
        background-color: #f8fafc !important;
        border-color: #cbd5e1 !important;
        transform: translateY(-1px);
    }

    /* SWITCH COLOR */
    #calculator-bar .form-check-input:checked { 
        background-color: #3b82f6; 
        border-color: #3b82f6; 
    }

    /* TOMSELECT OVERRIDES */
    #calculator-bar .ts-control { 
        border-radius: 6px !important; 
        border-color: #dee2e6; 
        padding-top: 0 !important; 
        padding-bottom: 0 !important;
    }
    #calculator-bar .ts-control > input { height: 100% !important; margin: 0 !important; }
    #calculator-bar .ts-dropdown { border-radius: 8px; box-shadow: 0 10px 25px rgba(0,0,0,0.15); z-index: 1050; } 
    
    


    /* ========================================================= */
    /* --- NEXT-GEN CARD MIDDLE COLUMN UI --- */
    /* ========================================================= */

    /* Rating Pills */
    .rating-pill {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 2px 8px;
        border-radius: 12px;
        font-size: 0.75rem;
    }

    /* Premium Value Chip (1st Yr Value) */
    .nextgen-value-chip {
        background: #ecfdf5; 
        border: 1px solid #a7f3d0; 
        color: #065f46; 
        padding: 4px 10px; 
        border-radius: 6px; 
        font-size: 0.8rem; 
        font-weight: 500; 
        display: inline-flex; 
        align-items: center;
    }

    /* Base Premium Chip (Metal, FYF, Rewards) */
    .nextgen-badge-chip {
        padding: 4px 8px; 
        border-radius: 6px; 
        font-size: 0.7rem; 
        font-weight: 700; 
        border: 1px solid; 
        display: inline-flex; 
        align-items: center; 
        gap: 4px;
    }

    /* Metal Specific Chip */
    .metal-chip {
        background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%); 
        border-color: #cbd5e1; 
        color: #334155;
    }

    /* Unified Offer Box */
    .nextgen-offer-box {
        background: #f8fbff; /* Very soft blue tint */
        border: 1px dashed #93c5fd; 
        border-radius: 8px; 
        padding: 10px 12px;
    }

    /* Offer Lines inside the Box */
    .offer-line {
        display: flex; 
        align-items: flex-start; 
        gap: 10px; 
        font-size: 0.8rem; 
        line-height: 1.4; 
        color: #334155;
    }

    .offer-icon {
        width: 24px; 
        height: 24px; 
        border-radius: 6px; 
        display: flex; 
        align-items: center; 
        justify-content: center; 
        flex-shrink: 0; 
        font-size: 0.85rem;
    }

    .offer-text {
        flex: 1 1 auto;
        min-width: 0;
        word-wrap: break-word;
    }

    .offer-expiry {
        display: inline-block; 
        background: #fee2e2; 
        color: #991b1b; 
        padding: 1px 6px; 
        border-radius: 4px; 
        font-size: 0.65rem; 
        font-weight: 700; 
        margin-left: 6px;
        white-space: nowrap;
    }


    /* --- PREMIUM RANKING HEADERS --- */
    /* this css block for 3 pages: Best overall, top ranked cards and top promotions page */
    .premium-ranking-header {
        width: 100%;
        padding: 8px 20px;
        font-size: 0.75rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        display: flex;
        align-items: center;
        border-bottom: 1px solid rgba(0,0,0,0.05);
    }
    
    /* 1. Gold (Top Ranked) */
    .premium-gold {
        background: linear-gradient(90deg, #fffbeb 0%, #fef3c7 100%);
        color: #92400e;
        border-bottom: 1px solid #fde68a;
    }
    
    /* 2. Dark/Executive (Best Overall) */
    .premium-dark {
        background: linear-gradient(90deg, #1e293b 0%, #0f172a 100%);
        color: #f8fafc;
        border-bottom: 1px solid #020617;
    }
    
    /* 3. Trusted Blue (Editor's Pick) */
    .premium-blue {
        background: linear-gradient(90deg, #f0f9ff 0%, #e0f2fe 100%);
        color: #0369a1;
        border-bottom: 1px solid #bae6fd;
    }
    
    /* 4. Alert Red (Promotions) */
    .premium-red {
        background: linear-gradient(90deg, #fef2f2 0%, #fee2e2 100%);
        color: #b91c1c;
        border-bottom: 1px solid #fecaca;
    }


    /* ========================================================= */
    /* --- NEXT-GEN CATEGORY HEADERS (Leaderboards) --- */
    /* ========================================================= */
    .nextgen-cat-header {
        position: relative;
        padding-top: 1rem;
    }

    /* The Floating Icon Box */
    .ng-icon-box {
        width: 52px;
        height: 52px;
        border-radius: 14px;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        font-size: 1.5rem;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0,0,0,0.02);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Typography Tweaks */
    .ng-pretitle {
        font-size: 0.65rem;
        font-weight: 800;
        letter-spacing: 1.5px;
        color: #64748b;
        text-transform: uppercase;
        margin-bottom: 2px;
        display: block;
    }

    .ng-title {
        font-weight: 900;
        font-size: 1.75rem;
        color: #0f172a;
        letter-spacing: -0.5px;
        line-height: 1.2;
    }

    /* Dynamic Gradient Accent Lines */
    .ng-accent-line {
        height: 4px;
        width: 60px;
        border-radius: 4px;
        margin-top: 1.25rem;
    }

    .grad-success { background: linear-gradient(90deg, #10b981 0%, #34d399 100%); box-shadow: 0 2px 4px rgba(16, 185, 129, 0.2); }
    .grad-info    { background: linear-gradient(90deg, #0ea5e9 0%, #38bdf8 100%); box-shadow: 0 2px 4px rgba(14, 165, 233, 0.2); }
    .grad-danger  { background: linear-gradient(90deg, #ef4444 0%, #f87171 100%); box-shadow: 0 2px 4px rgba(239, 68, 68, 0.2); }
    .grad-primary { background: linear-gradient(90deg, #3b82f6 0%, #60a5fa 100%); box-shadow: 0 2px 4px rgba(59, 130, 246, 0.2); }
    .grad-dark    { background: linear-gradient(90deg, #1e293b 0%, #475569 100%); box-shadow: 0 2px 4px rgba(30, 41, 59, 0.2); }
    .grad-warning { background: linear-gradient(90deg, #f59e0b 0%, #fbbf24 100%); box-shadow: 0 2px 4px rgba(245, 158, 11, 0.2); }


    /* === CSS to replace legacy rewards tab with the new upgrade rewards tab */

    /* ========================================================= */
    /* --- Rewards Drawer V2: scoped to drawer Rewards tab only --- */
    /* ========================================================= */

    .drawer-rewards-v2 {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        color: #0f172a;
    }

    .drawer-rewards-v2-empty {
        border: 1px dashed #cbd5e1;
        background: #f8fafc;
        color: #64748b;
        border-radius: 10px;
        padding: 0.9rem 1rem;
        font-size: 0.85rem;
        font-weight: 600;
    }

    /* Top offer section */
    .drawer-rewards-v2-offer {
        border-radius: 14px;
        padding: 1rem;
        border: 1px solid #dbeafe;
        background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
        color: #0f172a;
        box-shadow: 0 10px 25px rgba(15, 23, 42, 0.04);
    }

    .drawer-rewards-v2-offer-main {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }

    .drawer-rewards-v2-eyebrow {
        display: inline-flex;
        align-items: center;
        width: fit-content;
        background: rgba(13, 110, 253, 0.1);
        color: #0d6efd;
        border: 1px solid rgba(13, 110, 253, 0.18);
        border-radius: 999px;
        padding: 0.25rem 0.65rem;
        font-size: 0.72rem;
        font-weight: 800;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .drawer-rewards-v2-offer-message {
        font-size: 0.92rem;
        font-weight: 700;
        line-height: 1.45;
        color: #111827;
        white-space: pre-line;
    }

    .drawer-rewards-v2-bonus-grid {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 170px;
        gap: 0.75rem;
    }

    .drawer-rewards-v2-bonus-card {
        border: 1px solid rgba(148, 163, 184, 0.28);
        background: rgba(255, 255, 255, 0.78);
        border-radius: 12px;
        padding: 0.8rem;
    }

    .drawer-rewards-v2-mini-label {
        display: block;
        color: #64748b;
        font-size: 0.68rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        margin-bottom: 0.25rem;
    }

    .drawer-rewards-v2-bonus-text {
        font-size: 0.86rem;
        line-height: 1.45;
        color: #1e293b;
        font-weight: 600;
    }

    .drawer-rewards-v2-bonus-value-card {
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .drawer-rewards-v2-bonus-value {
        color: #047857;
        font-size: 1.25rem;
        font-weight: 900;
        line-height: 1.1;
    }

    .drawer-rewards-v2-details-note {
        border-top: 1px solid rgba(148, 163, 184, 0.22);
        padding-top: 0.75rem;
    }

    .drawer-rewards-v2-details-title {
        color: #334155;
        font-size: 0.76rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        margin-bottom: 0.3rem;
    }

    .drawer-rewards-v2-details-copy {
        color: #334155;
        font-size: 0.84rem;
        line-height: 1.55;
    }

    /* Optional admin-selected color tokens */
    .drawer-rewards-v2-offer-red {
        background: linear-gradient(135deg, #fff1f2 0%, #ffffff 100%);
        border-color: #fecdd3;
    }

    .drawer-rewards-v2-offer-red .drawer-rewards-v2-eyebrow {
        color: #be123c;
        background: rgba(244, 63, 94, 0.1);
        border-color: rgba(244, 63, 94, 0.18);
    }

    .drawer-rewards-v2-offer-blue {
        background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
        border-color: #bfdbfe;
    }

    .drawer-rewards-v2-offer-green {
        background: linear-gradient(135deg, #ecfdf5 0%, #ffffff 100%);
        border-color: #bbf7d0;
    }

    .drawer-rewards-v2-offer-green .drawer-rewards-v2-eyebrow {
        color: #047857;
        background: rgba(16, 185, 129, 0.1);
        border-color: rgba(16, 185, 129, 0.18);
    }

    .drawer-rewards-v2-offer-orange {
        background: linear-gradient(135deg, #fff7ed 0%, #ffffff 100%);
        border-color: #fed7aa;
    }

    .drawer-rewards-v2-offer-orange .drawer-rewards-v2-eyebrow {
        color: #c2410c;
        background: rgba(249, 115, 22, 0.1);
        border-color: rgba(249, 115, 22, 0.18);
    }

    .drawer-rewards-v2-offer-yellow {
        background: linear-gradient(135deg, #fffbeb 0%, #ffffff 100%);
        border-color: #fde68a;
    }

    .drawer-rewards-v2-offer-yellow .drawer-rewards-v2-eyebrow {
        color: #92400e;
        background: rgba(245, 158, 11, 0.12);
        border-color: rgba(245, 158, 11, 0.2);
    }

    .drawer-rewards-v2-offer-purple {
        background: linear-gradient(135deg, #f5f3ff 0%, #ffffff 100%);
        border-color: #ddd6fe;
    }

    .drawer-rewards-v2-offer-purple .drawer-rewards-v2-eyebrow {
        color: #6d28d9;
        background: rgba(124, 58, 237, 0.1);
        border-color: rgba(124, 58, 237, 0.18);
    }

    .drawer-rewards-v2-offer-dark {
        background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
        border-color: #334155;
        color: #ffffff;
    }

    .drawer-rewards-v2-offer-dark .drawer-rewards-v2-eyebrow {
        color: #fde68a;
        background: rgba(255, 255, 255, 0.08);
        border-color: rgba(255, 255, 255, 0.14);
    }

    .drawer-rewards-v2-offer-dark .drawer-rewards-v2-offer-message,
    .drawer-rewards-v2-offer-dark .drawer-rewards-v2-bonus-text,
    .drawer-rewards-v2-offer-dark .drawer-rewards-v2-details-title,
    .drawer-rewards-v2-offer-dark .drawer-rewards-v2-details-copy {
        color: #f8fafc;
    }

    .drawer-rewards-v2-offer-dark .drawer-rewards-v2-mini-label {
        color: #cbd5e1;
    }

    .drawer-rewards-v2-offer-dark .drawer-rewards-v2-bonus-card {
        background: rgba(255, 255, 255, 0.08);
        border-color: rgba(255, 255, 255, 0.12);
    }

    .drawer-rewards-v2-offer-light {
        background: #ffffff;
        border-color: #e2e8f0;
    }

    /* Standard sections */
    .drawer-rewards-v2-section {
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        background: #ffffff;
        padding: 1rem;
    }

    .drawer-rewards-v2-section-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 0.75rem;
        margin-bottom: 0.75rem;
    }

    .drawer-rewards-v2-section-kicker {
        display: block;
        color: #64748b;
        font-size: 0.66rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        margin-bottom: 0.12rem;
    }

    .drawer-rewards-v2-section-title {
        margin: 0;
        color: #0f172a;
        font-size: 0.98rem;
        font-weight: 900;
        line-height: 1.25;
    }

    .drawer-rewards-v2-summary {
        margin: 0 0 0.85rem;
        color: #475569;
        font-size: 0.86rem;
        line-height: 1.55;
        background: #f8fafc;
        border: 1px solid #edf2f7;
        border-radius: 10px;
        padding: 0.75rem 0.85rem;
        white-space: pre-line;
    }

    /* Item cards */
    .drawer-rewards-v2-item-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
    }

    .drawer-rewards-v2-item {
        display: flex;
        gap: 0.7rem;
        align-items: flex-start;
        border: 1px solid #e5e7eb;
        background: #ffffff;
        border-radius: 12px;
        padding: 0.8rem;
        min-width: 0;
    }

    .drawer-rewards-v2-item-icon {
        width: 30px;
        height: 30px;
        border-radius: 9px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        font-size: 0.85rem;
    }

    .drawer-rewards-v2-item-icon-reward {
        color: #0d6efd;
        background: rgba(13, 110, 253, 0.1);
    }

    .drawer-rewards-v2-item-icon-perk {
        color: #b45309;
        background: rgba(245, 158, 11, 0.12);
    }

    .drawer-rewards-v2-item-icon-insurance {
        color: #047857;
        background: rgba(16, 185, 129, 0.12);
    }

    .drawer-rewards-v2-item-body {
        min-width: 0;
    }

    .drawer-rewards-v2-item-body h5 {
        margin: 0 0 0.22rem;
        color: #111827;
        font-size: 0.86rem;
        font-weight: 900;
        line-height: 1.3;
    }

    .drawer-rewards-v2-item-body p {
        margin: 0;
        color: #475569;
        font-size: 0.8rem;
        line-height: 1.45;
    }

    /* Earn rates */
    .drawer-rewards-v2-earn-section {
        background: #f8fafc;
    }

    .drawer-rewards-v2-rate-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.6rem;
    }

    .drawer-rewards-v2-rate-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        border: 1px solid #e2e8f0;
        background: #ffffff;
        border-radius: 10px;
        padding: 0.65rem 0.75rem;
    }

    .drawer-rewards-v2-rate-card span {
        color: #475569;
        font-size: 0.78rem;
        font-weight: 800;
    }

    .drawer-rewards-v2-rate-card strong {
        color: #0f172a;
        font-size: 0.88rem;
        font-weight: 900;
        white-space: nowrap;
    }

    /* Mobile */
    @media (max-width: 767.98px) {
        .drawer-rewards-v2-bonus-grid {
            grid-template-columns: 1fr;
        }

        .drawer-rewards-v2-item-grid {
            grid-template-columns: 1fr;
        }

        .drawer-rewards-v2-rate-grid {
            grid-template-columns: 1fr;
        }

        .drawer-rewards-v2-section,
        .drawer-rewards-v2-offer {
            padding: 0.85rem;
        }
    }


    /* ========================================================= */
    /* --- RateBuddy Verdict Summary: Pros & Cons drawer only --- */
    /* ========================================================= */

    .ratebuddy-verdict-summary {
        border: 1px solid #dbeafe;
        background: linear-gradient(135deg, #f8fbff 0%, #ffffff 100%);
        border-radius: 12px;
        padding: 0.9rem 1rem;
        box-shadow: 0 8px 18px rgba(15, 23, 42, 0.035);
    }

    .ratebuddy-verdict-summary-label {
        color: #0d6efd;
        font-size: 0.68rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.07em;
        margin-bottom: 0.35rem;
    }

    .ratebuddy-verdict-summary-text {
        color: #1e293b;
        font-size: 0.88rem;
        line-height: 1.55;
        font-weight: 600;
        white-space: pre-line;
    } 
    
    
    /* ========================================================= */
    /* --- Headline Promo Banner: fallback when no rankingBadge --- */
    /* ========================================================= */

    .premium-headline-promo-header {
        overflow: hidden;
    }

    .premium-headline-promo-header span {
        display: inline-block;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* White / bright text group */
    .premium-headline-dark {
        background: linear-gradient(135deg, #111827 0%, #1f2937 100%);
        color: #ffffff;
    }

    .premium-headline-red {
        background: linear-gradient(135deg, #b91c1c 0%, #dc2626 100%);
        color: #ffffff;
    }

    .premium-headline-blue {
        background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 100%);
        color: #ffffff;
    }

    .premium-headline-green {
        background: linear-gradient(135deg, #047857 0%, #059669 100%);
        color: #ffffff;
    }

    .premium-headline-purple {
        background: linear-gradient(135deg, #6d28d9 0%, #7c3aed 100%);
        color: #ffffff;
    }

    /* Dark text group for max contrast */
    .premium-headline-yellow {
        background: linear-gradient(135deg, #facc15 0%, #fde047 100%);
        color: #111827;
    }

    .premium-headline-light {
        background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);
        color: #111827;
        border-bottom: 1px solid #e2e8f0;
    }

    .premium-headline-orange {
        background: linear-gradient(135deg, #fb923c 0%, #fdba74 100%);
        color: #111827;
    }


    /* =========================================================
   PUBLIC RATEBUDDY REBATE — CATEGORY CARD
   Scoped to rebate-enabled cards only.
   ========================================================= */

.rb-public-rebate-panel {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid #86efac;
    border-radius: 10px;
    background: linear-gradient(
        145deg,
        #f0fdf4 0%,
        #ecfdf5 100%
    );
    box-shadow: 0 3px 10px rgba(21, 128, 61, 0.08);
    color: #14532d;
}

.rb-public-rebate-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.45rem;
}

.rb-public-rebate-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: #166534;
    font-size: 0.64rem;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.rb-public-rebate-amount {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0.15rem 0.48rem;
    border-radius: 999px;
    background: #15803d;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1.2;
    white-space: nowrap;
}

.rb-public-rebate-headline {
    color: #14532d;
    font-size: 0.77rem;
    font-weight: 800;
    line-height: 1.35;
}

.rb-public-rebate-supporting {
    margin-top: 0.3rem;
    color: #3f6212;
    font-size: 0.67rem;
    font-weight: 600;
    line-height: 1.35;
}

.rb-public-rebate-cta {
    min-height: 38px;
    padding: 0.45rem 0.65rem;
    line-height: 1.25;
    white-space: normal;
}

@media (max-width: 991px) {
    .col-actions.has-public-rebate {
        flex-direction: column;
        align-items: stretch;
    }

    .col-actions.has-public-rebate > * {
        width: 100%;
    }
}

/* ========================================================================== */
/* RATEBUDDY CATEGORY CARD COMPONENT — RB-CATEGORY-CARD-V4.3.2-20260811      */
/* Loaded once through /css/credit-cards/category-pages.css.                  */
/* ========================================================================== */

/* new css for newly designed raked pages */

            /* ========================================================= */
            /* Top Ranked card banner only                               */
            /* Other page banners remain unchanged                       */
            /* ========================================================= */

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-header {
                text-transform: none;
                letter-spacing: 0;
                font-weight: 650;
                font-size: 0.84rem;
                line-height: 1.25;
                justify-content: flex-start;
                gap: 0.55rem;
                padding: 0.58rem 0.9rem;
                border-bottom: 1px solid rgba(15, 23, 42, 0.08);
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-header i {
                font-size: 0.9rem !important;
                line-height: 1;
            }

            .smart-card-wrapper .rb-top-ranked-award-copy {
                min-width: 0;
                display: flex;
                flex-direction: column;
                gap: 0.08rem;
            }

            .smart-card-wrapper .rb-top-ranked-award-title {
                display: block;
                font-weight: 750;
                color: inherit;
                overflow-wrap: anywhere;
            }

            .smart-card-wrapper .rb-top-ranked-award-subtitle {
                display: block;
                font-size: 0.73rem;
                font-weight: 500;
                line-height: 1.25;
                color: rgba(71, 85, 105, 0.88);
                overflow-wrap: anywhere;
            }

            /* Neutral defaults */
            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-light {
                background: #f8fafc;
                color: #334155;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-white {
                background: #ffffff;
                color: #334155;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-grey {
                background: #f1f5f9;
                color: #334155;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-black {
                background: #111827;
                color: #ffffff;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-black .rb-top-ranked-award-subtitle {
                color: rgba(255, 255, 255, 0.76);
            }

            /* Admin color choices for Top Ranked only */
            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-blue {
                background: #eff6ff;
                color: #1d4ed8;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-navy {
                background: #eef2ff;
                color: #1e3a8a;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-sky {
                background: #f0f9ff;
                color: #0369a1;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-green,
            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-success {
                background: #f0fdf4;
                color: #166534;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-emerald {
                background: #ecfdf5;
                color: #047857;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-teal {
                background: #f0fdfa;
                color: #0f766e;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-purple {
                background: #faf5ff;
                color: #7e22ce;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-red,
            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-danger {
                background: #fef2f2;
                color: #b91c1c;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-rose {
                background: #fff1f2;
                color: #be123c;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-orange,
            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-warning {
                background: #fff7ed;
                color: #c2410c;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-yellow,
            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-gold {
                background: #fffbeb;
                color: #92400e;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-premium {
                background: #f8fafc;
                color: #111827;
            }

            .smart-card-wrapper .premium-ranking-header.rb-top-ranked-award-value {
                background: #f7fee7;
                color: #3f6212;
            }



        /* new css for newly designed raked pages */

        .finder-drawer-grid { 
            display: flex; 
            flex-wrap: wrap; 
            border: 1px solid #e2e8f0; 
            border-radius: 8px; 
            overflow: hidden; 
            background: #fff; 
        }
        
        /* Standard Cell: Flexbox for Side-by-Side Single Line */
        .finder-cell { 
            width: 50%; 
            padding: 6px 12px; /* Compact padding */
            border-bottom: 1px solid #f1f5f9; 
            border-right: 1px solid #f1f5f9; 
            font-size: 0.9rem;
            display: flex; 
            justify-content: space-between; /* Pushes Label Left, Value Right */
            align-items: center; 
        }
        
        .finder-cell:nth-child(2n) { border-right: none; }
        
        /* Full Width Cell: Stacked Layout for Lists */
        .finder-cell-full { 
            width: 100%; 
            display: block; /* Override Flex to stack label above list */
            border-right: none; 
            background-color: #f8fafc; 
            padding: 10px 15px;
        }
        
        .f-label { 
            color: #64748b; 
            font-weight: 700; 
            text-transform: uppercase; 
            font-size: 0.7rem; 
            letter-spacing: 0.5px; 
            margin-bottom: 0; /* Remove margin for single line */
        }
        
        .finder-cell-full .f-label {
            margin-bottom: 6px; /* Restore margin for full width sections */
        }

        .f-value { 
            color: #1e293b; 
            font-weight: 600; 
            font-size: 0.9rem; 
            text-align: right; 
        }
        
        .f-list { margin: 0; padding-left: 0; list-style: none; }
        .f-list li { margin-bottom: 4px; display: flex; align-items: flex-start; gap: 8px; font-size: 0.85rem; line-height: 1.4; color: #334155; }
        
        .reward-row { display: flex; justify-content: space-between; padding: 6px 12px; border-bottom: 1px solid #f1f5f9; font-size: 0.9rem; }
        .reward-row:last-child { border-bottom: none; }


       /* css for text above action button */ 
        .action-promo-box {
            width: 100%;
            border: 1px dashed rgba(37, 99, 235, 0.32);
            background: linear-gradient(135deg, #f8fbff 0%, #ffffff 100%);
            border-radius: 14px;
            padding: 0.6rem 0.7rem;
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.035);
        }

        .action-promo-icon {
            width: 24px;
            height: 24px;
            min-width: 24px;
            border-radius: 999px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(37, 99, 235, 0.08);
            color: #2563eb;
            border: 1px solid rgba(37, 99, 235, 0.14);
            font-size: 0.78rem;
            margin-top: 1px;
        }

        .action-promo-copy {
            min-width: 0;
            flex: 1 1 auto;
            line-height: 1.25;
        }

        .action-promo-title {
            color: #0f172a;
            font-size: 0.74rem;
            font-weight: 800;
            letter-spacing: -0.01em;
            overflow-wrap: anywhere;
        }

        .action-promo-description {
            color: #64748b;
            font-size: 0.68rem;
            font-weight: 400;
            margin-top: 0.12rem;
            overflow-wrap: anywhere;
        }    

        .cta-trust-note {
            margin-top: 0.08rem;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.18rem;
            color: #64748b;
            font-size: 0.61rem;
            font-weight: 500;
            line-height: 0.95;
            white-space: nowrap;
        }

        .cta-trust-note i {
            color: #2563eb;
            font-size: 0.66rem;
            line-height: 0.95;
        }

        @media (max-width: 380px) {
            .cta-trust-note {
                font-size: 0.57rem;
                line-height: 1.05;
                white-space: normal;
            }
        } 

        .track-cc-inquiry i {
            line-height: 1;
            flex-shrink: 0;
        } 
        

    /* Reward details v2 further enhancement */

    /* ========================================================= */
    /* Full-width flat list layout for Perks + Insurance only    */
    /* Fixes nested/half-width grid behavior                     */
    /* ========================================================= */

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-full-list-grid {
        display: grid;
        grid-template-columns: 1fr !important;
        gap: 0.42rem;
        width: 100%;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-full-list-item {
        width: 100%;
        display: flex;
        align-items: flex-start;
        gap: 0.52rem;
        padding: 0.52rem 0.66rem;
        border-radius: 9px;
        min-height: auto;
        background: linear-gradient(135deg, #ffffff 0%, #fbfdff 100%);
        box-shadow: 0 4px 10px rgba(15, 23, 42, 0.025);
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-item-icon {
        width: 23px;
        height: 23px;
        min-width: 23px;
        border-radius: 7px;
        font-size: 0.68rem;
        margin-top: 0.02rem;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-item-body {
        flex: 1 1 auto;
        min-width: 0;
        line-height: 1.28;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-item-body h5 {
        display: inline;
        margin: 0;
        font-size: 0.77rem;
        font-weight: 850;
        line-height: 1.28;
        color: #0f172a;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-item-body h5 + p::before {
        content: ": ";
        font-weight: 850;
        color: #0f172a;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-item-body p {
        display: inline;
        margin: 0;
        font-size: 0.75rem;
        font-weight: 500;
        line-height: 1.28;
        color: #475569;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-description-only {
        display: block;
        position: relative;
        padding-left: 0.7rem;
        color: #334155;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-description-only::before {
        content: "•";
        position: absolute;
        left: 0;
        top: 0;
        color: #0d6efd;
        font-weight: 900;
    }

    /* Keep title-only rows clean */
    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-item-body h5:only-child {
        display: block;
    }

    /* Perks tone */
    .smart-card-wrapper .drawer-rewards-v2-section-perks .drawer-rewards-v2-full-list-item {
        border-color: #f1e7d4;
        background: linear-gradient(135deg, #fffaf2 0%, #ffffff 100%);
    }

    /* Insurance tone */
    .smart-card-wrapper .drawer-rewards-v2-section-insurance .drawer-rewards-v2-full-list-item {
        border-color: #dcefe7;
        background: linear-gradient(135deg, #f3fff9 0%, #ffffff 100%);
    }

    /* Slightly tighter section spacing for these two sections */
    .smart-card-wrapper .drawer-rewards-v2-section-full-list {
        padding: 0.75rem 0.85rem;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-section-head {
        margin-bottom: 0.48rem;
    }

    .smart-card-wrapper .drawer-rewards-v2-section-full-list .drawer-rewards-v2-summary {
        margin-bottom: 0.55rem;
        padding: 0.55rem 0.68rem;
        font-size: 0.8rem;
        line-height: 1.35;
    }

    /* =================================================================== */
    /* RATEBUDDY MODERN RESOURCE CARD — V4                                 */
    /* The selector scope prevents these rules from affecting other cards. */
    /* =================================================================== */

    .smart-card-wrapper.rb-modern-resource-card {
        background: #ffffff;
        border: 1px solid #38a169;
        border-radius: 18px;
        box-shadow: 0 12px 32px rgba(15, 23, 42, 0.07);
        overflow: hidden;
        transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
    }

    .smart-card-wrapper.rb-modern-resource-card:hover {
        border-color: #1f8a55;
        box-shadow: 0 18px 42px rgba(15, 23, 42, 0.1);
        transform: translateY(-2px);
    }

    .smart-card-wrapper.rb-modern-resource-card:focus-within {
        border-color: #16794a;
        box-shadow: 0 0 0 3px rgba(46, 160, 103, 0.14), 0 18px 42px rgba(15, 23, 42, 0.1);
    }

    .smart-card-wrapper .rb-modern-card-main {
        --rb-card-edge-offset: 1.4rem;
        display: grid;
        grid-template-columns: 188px minmax(0, 1fr) 276px;
        gap: 1.4rem;
        align-items: stretch;
        min-height: 350px;
        padding: 1.4rem;
        background: #ffffff;
    }

    /* Product image and quick facts */
    .smart-card-wrapper .rb-modern-card-visual {
        display: flex;
        flex-direction: column;
        min-width: 0;
        padding-right: 0.2rem;
    }

    /* Keeps the original ribbon style directly above the product image. */
    .smart-card-wrapper .rb-modern-card-image-stage {
        display: flex;
        flex-direction: column;
        width: 100%;
        min-width: 0;
    }

    .smart-card-wrapper .rb-modern-card-image-link {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 126px;
        padding: 0.45rem;
        border-radius: 14px;
        background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
        text-decoration: none;
    }

    .smart-card-wrapper .rb-modern-card-image {
        display: block;
        width: auto;
        max-width: 100%;
        max-height: 118px;
        object-fit: contain;
        filter: drop-shadow(0 10px 14px rgba(15, 23, 42, 0.13));
        transition: transform 180ms ease;
    }

    .smart-card-wrapper .rb-modern-card-image-link:hover .rb-modern-card-image {
        transform: translateY(-2px) scale(1.015);
    }

    .smart-card-wrapper .rb-modern-card-facts {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.62rem;
        margin-top: 0.95rem;
    }

    .smart-card-wrapper .rb-modern-card-fact {
        display: block;
        width: 100%;
        padding: 0;
        background: transparent;
    }

    .smart-card-wrapper .rb-modern-card-fact-marker {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 0.5rem;
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding: 0.36rem 0.48rem;
        border-radius: 5px 7px 4px 6px;
        background: linear-gradient(100deg, #dff3e7 0%, #edf8f1 100%);
        box-shadow: inset 0 -1px 0 rgba(41, 123, 76, 0.08);
    }

    .smart-card-wrapper .rb-modern-card-fact-label {
        color: #40594a;
        font-size: 0.69rem;
        font-weight: 760;
        line-height: 1.2;
        letter-spacing: 0.01em;
        text-transform: none;
    }

    .smart-card-wrapper .rb-modern-card-fact-value {
        color: #0b6038;
        font-size: 0.73rem;
        font-weight: 860;
        line-height: 1.2;
        text-align: right;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-modern-card-fact-value--stacked {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 0.12rem;
        white-space: normal;
    }

    .smart-card-wrapper .rb-modern-card-fact-value--stacked small {
        color: #16794a;
        font-size: 0.55rem;
        font-weight: 750;
    }

    /* The parent supplies one uninterrupted highlight behind label + value. */
    .smart-card-wrapper .rb-modern-card-fact-label,
    .smart-card-wrapper .rb-modern-card-fact-value:not(.rb-modern-card-fact-value--stacked),
    .smart-card-wrapper .rb-modern-card-fact-value--stacked > span,
    .smart-card-wrapper .rb-modern-card-fact-value--stacked > small {
        display: inline-block;
        padding: 0;
        border-radius: 0;
        background: transparent;
    }

    .smart-card-wrapper .rb-modern-left-rebate {
        align-self: flex-start;
        margin: 0 10px 0 0;
    }

    .smart-card-wrapper .rb-modern-left-rebate > span {
        display: inline-block;
        padding: 0;
        background: transparent;
    }

    .smart-card-wrapper .rb-modern-left-rebate strong {
        color: #5b3b00;
        font-weight: 900;
    }

    /* Diploma-inspired cash-rebate ribbon used in both money-making zones. */
    .smart-card-wrapper .rb-cash-rebate-ribbon {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 0.38rem;
        width: fit-content;
        max-width: calc(100% - 10px);
        padding: 0.44rem 0.62rem 0.44rem 0.54rem;
        border-radius: 5px 2px 2px 5px;
        background: linear-gradient(135deg, #ffd75a 0%, #ffe98d 58%, #fff3b6 100%);
        box-shadow: 0 7px 16px rgba(139, 101, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.72);
        color: #654600;
        font-size: 0.68rem;
        font-weight: 800;
        line-height: 1.25;
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon::after {
        content: "";
        position: absolute;
        top: 0;
        right: -10px;
        width: 11px;
        height: 100%;
        background: #ffe487;
        clip-path: polygon(0 0, 100% 50%, 0 100%, 36% 50%);
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon::before {
        content: "";
        position: absolute;
        bottom: -5px;
        left: 5px;
        width: 0;
        height: 0;
        border-top: 5px solid #a97900;
        border-left: 5px solid transparent;
        opacity: 0.72;
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon > i {
        flex: 0 0 auto;
        color: #9b6800;
        font-size: 0.82rem;
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon strong {
        color: #4f3300;
        font-weight: 920;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon--left {
        font-size: 0.63rem;
    }

    /* ========================================================= */
    /* COMPACT LEFT-COLUMN FACTS + CASH REBATE                    */
    /* ========================================================= */

    .smart-card-wrapper .rb-modern-card-facts {
        gap: 0.28rem;
        margin-top: 0.62rem;
    }

    .smart-card-wrapper .rb-modern-card-fact-marker {
        gap: 0.35rem;
        padding: 0.25rem 0.4rem;
        border-radius: 5px;
    }

    .smart-card-wrapper .rb-modern-card-fact-label {
        font-size: 0.63rem;
        line-height: 1.15;
    }

    .smart-card-wrapper .rb-modern-card-fact-value {
        font-size: 0.68rem;
        line-height: 1.15;
    }

    .smart-card-wrapper .rb-modern-card-fact-value--stacked {
        gap: 0.05rem;
    }

    .smart-card-wrapper .rb-modern-card-fact-value--stacked small {
        font-size: 0.5rem;
    }

    /* Retain the compact original ribbon while positioning it above the image. */
    .smart-card-wrapper .rb-modern-left-rebate {
        margin: 0 10px 0 0;
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon--left {
        justify-content: flex-start;
        align-items: flex-start;
        gap: 0.3rem;
        box-sizing: border-box;
        width: calc(100% + var(--rb-card-edge-offset) - 10px);
        max-width: none;
        margin-left: calc(-1 * var(--rb-card-edge-offset));
        padding: 0.44rem 0.52rem 0.44rem 0.7rem;
        background: linear-gradient(135deg, #ffcf35 0%, #ffe57a 56%, #fff0aa 100%);
        color: #553900;
        font-size: 0.7rem;
        line-height: 1.2;
        text-align: left;
        letter-spacing: -0.01em;
        box-shadow: 0 6px 14px rgba(139, 101, 0, 0.22),
                    inset 0 1px 0 rgba(255, 255, 255, 0.76);
        white-space: normal;
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon--left strong {
        display: inline-block;
        margin-left: 0.18rem;
        font-size: 0.78rem;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon--left > i {
        margin-top: 0.08rem;
        font-size: 0.78rem;
    }

    .smart-card-wrapper .rb-modern-left-rebate > .rb-left-rebate-copy {
        display: block;
        flex: 1 1 auto;
        min-width: 0;
        padding: 0;
        background: transparent;
        line-height: 1.3;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .smart-card-wrapper .rb-left-rebate-copy > span {
        display: inline;
        min-width: 0;
        white-space: normal;
    }

    /* The three-column tablet layout has the narrowest image rail. */
    @media (min-width: 768px) and (max-width: 1199.98px) {
        .smart-card-wrapper .rb-cash-rebate-ribbon--left {
            gap: 0.2rem;
            padding: 0.4rem 0.38rem 0.4rem 0.55rem;
            font-size: 0.64rem;
            letter-spacing: -0.015em;
        }

        .smart-card-wrapper .rb-cash-rebate-ribbon--left strong {
            font-size: 0.71rem;
        }

        .smart-card-wrapper .rb-cash-rebate-ribbon--left > i {
            font-size: 0.72rem;
        }
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon--left::after {
        right: -9px;
        width: 10px;
    }

    .smart-card-wrapper .rb-cash-rebate-ribbon--left::before {
        bottom: -5px;
        border-top-width: 5px;
        border-left-width: 5px;
    }


    /* Main information column */
    .smart-card-wrapper .rb-modern-card-content {
        display: flex;
        flex-direction: column;
        min-width: 0;
        height: 100%;
        padding: 0.1rem 0;
    }

    .smart-card-wrapper .rb-modern-card-kicker {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 0.75rem;
        margin-bottom: 0.5rem;
    }

    .smart-card-wrapper .rb-modern-provider-line {
        display: inline-flex;
        align-items: center;
        gap: 0.42rem;
        min-width: 0;
        margin: 0;
    }

    .smart-card-wrapper .rb-modern-provider-logo {
        width: auto;
        max-width: 74px;
        height: 21px;
        object-fit: contain;
    }

    .smart-card-wrapper .rb-modern-provider-fallback {
        align-items: center;
        justify-content: center;
        width: 26px;
        height: 26px;
        border: 1px solid #dbe4df;
        border-radius: 8px;
        background: #f8fafc;
        color: #475569;
        font-size: 0.65rem;
        font-weight: 850;
    }

    .smart-card-wrapper .rb-modern-provider-line .provider-name {
        color: #526158;
        font-size: 0.69rem;
        font-weight: 800;
        letter-spacing: 0.055em;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-modern-best-for {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 0.32rem;
        min-width: 0;
    }

    /* Mobile placement remains hidden on desktop and tablet. */
    .smart-card-wrapper .rb-modern-best-for--mobile {
        display: none;
    }


    .smart-card-wrapper .rb-modern-best-for-label {
        align-self: center;
        color: #64748b;
        font-size: 0.6rem;
        font-weight: 800;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-modern-category-chip {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.25rem 0.46rem;
        border: 1px solid #e2e8f0;
        border-radius: 999px;
        background: #f8fafc;
        color: #334155;
        font-size: 0.62rem;
        font-weight: 700;
        line-height: 1;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-modern-card-title {
        display: inline-block;
        margin: 0 0 0.45rem;
        color: #101d16;
        font-size: clamp(1.18rem, 1.4vw, 1.48rem);
        font-weight: 850;
        line-height: 1.18;
        letter-spacing: -0.025em;
        text-decoration: none;
        overflow-wrap: anywhere;
    }

    .smart-card-wrapper .rb-modern-card-title:hover {
        color: #087443;
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: 3px;
    }

    .smart-card-wrapper .rb-modern-ratings {
        display: flex;
        flex-wrap: wrap;
        gap: 0.48rem 1rem;
        margin: 0.08rem 0 1rem;
    }

    .smart-card-wrapper .rb-modern-rating-line {
        display: inline-flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 0.28rem;
        padding: 0.3rem 0.44rem;
        border-radius: 5px 7px 4px 6px;
        background: linear-gradient(100deg, #ffeca0 0%, #fff7ce 100%);
        box-shadow: inset 0 -1px 0 rgba(151, 112, 0, 0.08);
        color: #27342d;
        font-size: 0.67rem;
        line-height: 1.15;
        text-decoration: none;
        white-space: nowrap;
        transition: transform 150ms ease, background-color 150ms ease, box-shadow 150ms ease;
    }

    .smart-card-wrapper .rb-modern-rating-line:hover,
    .smart-card-wrapper .rb-modern-rating-line:focus {
        transform: translateY(-1px);
        background: linear-gradient(100deg, #ffe378 0%, #fff3b7 100%);
        box-shadow: 0 4px 9px rgba(151, 112, 0, 0.12);
        color: #1f2c25;
        text-decoration: none;
    }

    .smart-card-wrapper .rb-modern-rating-line:focus-visible {
        outline: 3px solid rgba(34, 139, 84, 0.2);
        outline-offset: 2px;
    }

    .smart-card-wrapper .rb-modern-rating-name {
        font-weight: 820;
    }

    .smart-card-wrapper .rb-modern-rating-stars {
        display: inline-flex;
        gap: 0.06rem;
        color: #f2ad00;
        font-size: 0.69rem;
        letter-spacing: -0.04em;
    }

    .smart-card-wrapper .rb-modern-rating-stars--trustpilot {
        color: #16884f;
    }

    .smart-card-wrapper .rb-modern-rating-line strong {
        font-weight: 850;
    }

    .smart-card-wrapper .rb-modern-rating-line small {
        color: #748078;
        font-size: 0.57rem;
        font-weight: 640;
    }

    .smart-card-wrapper .rb-first-year-value-highlight {
        display: inline-flex;
        align-items: center;
        width: fit-content;
        max-width: 100%;
        margin: 0;
    }

    .smart-card-wrapper .rb-first-year-value-summary {
        display: inline-flex;
        align-items: center;
        gap: 0.42rem;
        max-width: 100%;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
        color: inherit;
        cursor: pointer;
        font: inherit;
        text-align: left;
    }

    .smart-card-wrapper .rb-first-year-value-summary:focus-visible {
        border-radius: 8px;
        outline: 3px solid rgba(8, 116, 67, 0.22);
        outline-offset: 3px;
    }

    .smart-card-wrapper .rb-modern-value-summary-row {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.62rem;
        margin: 0 0 0.95rem;
    }

    .smart-card-wrapper .rb-first-year-value-marker {
        display: inline-flex;
        align-items: baseline;
        flex-wrap: nowrap;
        gap: 0.46rem;
        padding: 0.34rem 0.5rem;
        border-radius: 6px 8px 5px 7px;
        background: linear-gradient(100deg, #bdebcf 0%, #e0f7e8 100%);
        box-shadow: inset 0 -1px 0 rgba(20, 112, 62, 0.1);
        color: #17432b;
    }

    .smart-card-wrapper .rb-first-year-value-label {
        display: inline-block;
        padding: 0;
        border-radius: 0;
        background: transparent;
        font-size: 0.76rem;
        font-weight: 790;
    }

    .smart-card-wrapper .rb-first-year-value-marker strong {
        display: inline-block;
        padding: 0;
        border-radius: 0;
        background: transparent;
        color: #075c36;
        font-size: 1.12rem;
        font-weight: 920;
        letter-spacing: -0.035em;
        line-height: 1;
    }

    .smart-card-wrapper .rb-first-year-value-info {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #33805a;
        cursor: pointer;
        font-size: 0.78rem;
    }

    .smart-card-wrapper .rb-first-year-value-summary:hover .rb-first-year-value-info,
    .smart-card-wrapper .rb-first-year-value-summary:focus-visible .rb-first-year-value-info {
        color: #075c36;
    }

    /* The native Popover API places this panel in the browser's top layer. */
    .smart-card-wrapper .rb-fyv-popover {
        position: fixed;
        inset: 0;
        width: min(92vw, 720px);
        max-width: 720px;
        max-height: min(88vh, 780px);
        margin: auto;
        padding: 0;
        overflow: hidden;
        border: 1px solid rgba(164, 199, 178, 0.9);
        border-radius: 22px;
        background: #f8fbf9;
        box-shadow: 0 28px 80px rgba(7, 40, 23, 0.34);
        color: #23372c;
    }

    .smart-card-wrapper .rb-fyv-popover[popover] {
        display: none;
    }

    .smart-card-wrapper .rb-fyv-popover:popover-open {
        display: block;
    }

    .smart-card-wrapper .rb-fyv-popover::backdrop {
        background: rgba(7, 24, 15, 0.58);
        backdrop-filter: blur(4px);
    }

    .smart-card-wrapper .rb-fyv-popover-shell {
        display: grid;
        grid-template-rows: auto minmax(0, 1fr);
        max-height: min(88vh, 780px);
    }

    .smart-card-wrapper .rb-fyv-popover-toolbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding: 1rem 1.05rem;
        border-bottom: 1px solid #d9e8df;
        background: #fff;
    }

    .smart-card-wrapper .rb-fyv-popover-heading {
        display: flex;
        min-width: 0;
        flex-direction: column;
        gap: 0.08rem;
    }

    .smart-card-wrapper .rb-fyv-popover-heading small {
        color: #087443;
        font-size: 0.62rem;
        font-weight: 850;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-fyv-popover-heading strong {
        color: #173d29;
        font-size: 1rem;
        font-weight: 900;
        line-height: 1.2;
    }

    .smart-card-wrapper .rb-fyv-popover-heading > span {
        overflow: hidden;
        color: #68786e;
        font-size: 0.67rem;
        font-weight: 650;
        line-height: 1.35;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-fyv-popover-close {
        display: inline-flex;
        width: 40px;
        height: 40px;
        flex: 0 0 40px;
        align-items: center;
        justify-content: center;
        margin: 0;
        padding: 0;
        border: 1px solid #d5e4db;
        border-radius: 50%;
        background: #f5faf7;
        color: #254d37;
        cursor: pointer;
        font-size: 0.9rem;
        transition: background-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
    }

    .smart-card-wrapper .rb-fyv-popover-close:hover,
    .smart-card-wrapper .rb-fyv-popover-close:focus-visible {
        background: #e5f3eb;
        color: #075c36;
        transform: scale(1.04);
    }

    .smart-card-wrapper .rb-fyv-popover-close:focus-visible {
        outline: 3px solid rgba(8, 116, 67, 0.22);
        outline-offset: 2px;
    }

    .smart-card-wrapper .rb-fyv-popover-scroll {
        min-height: 0;
        max-height: calc(min(88vh, 780px) - 84px);
        padding: 1rem;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
    }

    .smart-card-wrapper .rb-fyv-popover-scroll .rb-fyv-breakdown-panel {
        margin-top: 0;
        box-shadow: none;
    }

    html:has(.rb-fyv-popover:popover-open),
    body:has(.rb-fyv-popover:popover-open) {
        overflow: hidden;
    }

    /* ========================================================= */
    /* First-year value calculation disclosure                    */
    /* ========================================================= */

    .smart-card-wrapper .rb-fyv-breakdown-panel {
        width: 100%;
        margin-top: 0.62rem;
        overflow: hidden;
        border: 1px solid #cae3d4;
        border-radius: 16px;
        background: #fff;
        box-shadow: 0 14px 34px rgba(25, 80, 49, 0.13);
        color: #23372c;
        text-align: left;
    }

    .smart-card-wrapper .rb-fyv-breakdown-header {
        display: flex;
        align-items: center;
        gap: 0.68rem;
        padding: 0.82rem 0.88rem;
        border-bottom: 1px solid #dcebe2;
        background: linear-gradient(135deg, #f2fbf6 0%, #e9f7ef 100%);
    }

    .smart-card-wrapper .rb-fyv-breakdown-header-icon {
        display: inline-flex;
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        background: #d8f0e2;
        color: #087443;
        font-size: 0.92rem;
    }

    .smart-card-wrapper .rb-fyv-breakdown-header > span:last-child,
    .smart-card-wrapper .rb-fyv-equation-label,
    .smart-card-wrapper .rb-fyv-total-row > span,
    .smart-card-wrapper .rb-fyv-rebate-copy {
        display: flex;
        min-width: 0;
        flex-direction: column;
        gap: 0.08rem;
    }

    .smart-card-wrapper .rb-fyv-breakdown-header strong {
        color: #17432b;
        font-size: 0.78rem;
        font-weight: 880;
        line-height: 1.3;
    }

    .smart-card-wrapper .rb-fyv-breakdown-header small {
        color: #668072;
        font-size: 0.62rem;
        line-height: 1.35;
    }

    .smart-card-wrapper .rb-fyv-equation {
        padding: 0.3rem 0.88rem;
    }

    .smart-card-wrapper .rb-fyv-equation-row {
        display: grid;
        grid-template-columns: 22px minmax(0, 1fr) auto;
        align-items: center;
        gap: 0.54rem;
        padding: 0.62rem 0;
        border-bottom: 1px solid #edf2ef;
    }

    .smart-card-wrapper .rb-fyv-equation-row:last-child {
        border-bottom: 0;
    }

    .smart-card-wrapper .rb-fyv-equation-sign {
        display: inline-flex;
        width: 22px;
        height: 22px;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        font-size: 0.74rem;
        font-weight: 900;
    }

    .smart-card-wrapper .rb-fyv-equation-sign--plus {
        background: #e1f4e8;
        color: #087443;
    }

    .smart-card-wrapper .rb-fyv-equation-sign--minus {
        background: #f7eee1;
        color: #986313;
    }

    .smart-card-wrapper .rb-fyv-equation-label strong {
        color: #33473b;
        font-size: 0.69rem;
        font-weight: 820;
        line-height: 1.3;
    }

    .smart-card-wrapper .rb-fyv-equation-label small {
        color: #77847c;
        font-size: 0.58rem;
        line-height: 1.38;
    }

    .smart-card-wrapper .rb-fyv-equation-value {
        color: #263b2f;
        font-size: 0.75rem;
        font-weight: 900;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-fyv-equation-value--waived {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        color: #087443;
    }

    .smart-card-wrapper .rb-fyv-equation-value--waived s {
        color: #8a958e;
        font-size: 0.65rem;
        font-weight: 650;
    }

    .smart-card-wrapper .rb-fyv-total-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.8rem;
        padding: 0.78rem 0.88rem;
        border-top: 1px solid #d8e9df;
        background: #f3faf6;
    }

    .smart-card-wrapper .rb-fyv-total-row small {
        color: #4f6f5c;
        font-size: 0.61rem;
        font-weight: 820;
        letter-spacing: 0.035em;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-fyv-total-row > span > strong {
        color: #6d7d73;
        font-size: 0.57rem;
        font-weight: 650;
        line-height: 1.35;
    }

    .smart-card-wrapper .rb-fyv-total-row > strong {
        color: #075c36;
        font-size: 1.06rem;
        font-weight: 930;
        letter-spacing: -0.035em;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-fyv-category-details {
        margin: 0.72rem 0.78rem 0;
        overflow: hidden;
        border: 1px solid #e0e9e3;
        border-radius: 11px;
        background: #fbfdfc;
    }

    .smart-card-wrapper .rb-fyv-category-details > summary {
        display: flex;
        align-items: center;
        gap: 0.42rem;
        padding: 0.62rem 0.7rem;
        color: #315b43;
        cursor: pointer;
        list-style: none;
        font-size: 0.64rem;
        font-weight: 820;
    }

    .smart-card-wrapper .rb-fyv-category-details > summary::-webkit-details-marker {
        display: none;
    }

    .smart-card-wrapper .rb-fyv-category-details[open] > summary {
        border-bottom: 1px solid #e3ebe6;
        background: #f3f9f5;
    }

    .smart-card-wrapper .rb-fyv-category-details .table-responsive {
        overflow-x: auto;
    }

    .smart-card-wrapper .rb-fyv-category-details table {
        min-width: 390px;
        color: #3c4d43;
        font-size: 0.58rem;
    }

    .smart-card-wrapper .rb-fyv-category-details th,
    .smart-card-wrapper .rb-fyv-category-details td {
        padding: 0.46rem 0.5rem;
        border-color: #edf2ef;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-fyv-category-details thead th {
        color: #627269;
        background: #f8fbf9;
        font-weight: 820;
    }

    .smart-card-wrapper .rb-fyv-rebate-row {
        display: grid;
        grid-template-columns: 30px minmax(0, 1fr) auto;
        align-items: center;
        gap: 0.58rem;
        margin: 0.72rem 0.78rem 0;
        padding: 0.68rem 0.72rem;
        border: 1px solid #ead88e;
        border-radius: 12px;
        background: linear-gradient(105deg, #fff7cf 0%, #fffbea 100%);
    }

    .smart-card-wrapper .rb-fyv-rebate-icon {
        display: inline-flex;
        width: 30px;
        height: 30px;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        background: #f5df78;
        color: #6e5200;
    }

    .smart-card-wrapper .rb-fyv-rebate-copy strong {
        color: #594500;
        font-size: 0.69rem;
        font-weight: 880;
    }

    .smart-card-wrapper .rb-fyv-rebate-copy small {
        color: #776a3f;
        font-size: 0.56rem;
        line-height: 1.36;
    }

    .smart-card-wrapper .rb-fyv-rebate-value {
        color: #5b4400;
        font-size: 0.78rem;
        font-weight: 920;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-fyv-combined-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.7rem;
        margin: 0.48rem 0.78rem 0;
        padding: 0.58rem 0.7rem;
        border-radius: 10px;
        background: #193f2b;
        color: #fff;
        font-size: 0.62rem;
        font-weight: 770;
        line-height: 1.35;
    }

    .smart-card-wrapper .rb-fyv-combined-row strong {
        font-size: 0.82rem;
        font-weight: 920;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-fyv-warning-note {
        display: flex;
        align-items: flex-start;
        gap: 0.48rem;
        margin: 0.62rem 0.78rem 0;
        padding: 0.62rem 0.7rem;
        border-left: 3px solid #d69b2d;
        border-radius: 7px;
        background: #fff9ed;
        color: #6d5425;
        font-size: 0.57rem;
        line-height: 1.42;
    }

    .smart-card-wrapper .rb-fyv-warning-note > span {
        min-width: 0;
    }

    .smart-card-wrapper .rb-fyv-warning-note strong {
        display: block;
        margin-bottom: 0.16rem;
        font-size: 0.62rem;
        font-weight: 860;
    }

    .smart-card-wrapper .rb-fyv-warning-note ul {
        margin: 0;
        padding-left: 1rem;
    }

    .smart-card-wrapper .rb-fyv-method-note {
        display: flex;
        align-items: flex-start;
        gap: 0.42rem;
        margin: 0;
        padding: 0.72rem 0.88rem 0.8rem;
        color: #7a857e;
        font-size: 0.56rem;
        line-height: 1.45;
    }

    .smart-card-wrapper .rb-fyv-method-note i {
        margin-top: 0.08rem;
        flex: 0 0 auto;
        color: #4f8a68;
    }

    @media (max-width: 575.98px) {
        .smart-card-wrapper .rb-fyv-popover {
            width: calc(100vw - 20px);
            max-height: calc(100dvh - 20px);
            border-radius: 16px;
        }

        .smart-card-wrapper .rb-fyv-popover-shell {
            max-height: calc(100dvh - 20px);
        }

        .smart-card-wrapper .rb-fyv-popover-toolbar {
            padding: 0.82rem 0.86rem;
        }

        .smart-card-wrapper .rb-fyv-popover-heading > span {
            max-width: 72vw;
        }

        .smart-card-wrapper .rb-fyv-popover-scroll {
            max-height: calc(100dvh - 104px);
            padding: 0.68rem;
        }

        .smart-card-wrapper .rb-first-year-value-marker {
            align-items: center;
            flex-wrap: wrap;
        }

        .smart-card-wrapper .rb-first-year-value-marker strong {
            line-height: 1.08;
        }

        .smart-card-wrapper .rb-fyv-equation {
            padding-right: 0.72rem;
            padding-left: 0.72rem;
        }

        .smart-card-wrapper .rb-fyv-equation-row {
            grid-template-columns: 22px minmax(0, 1fr);
            gap: 0.48rem;
        }

        .smart-card-wrapper .rb-fyv-equation-value {
            grid-column: 2;
            justify-self: start;
        }

        .smart-card-wrapper .rb-fyv-total-row,
        .smart-card-wrapper .rb-fyv-combined-row {
            align-items: flex-start;
            flex-direction: column;
        }

        .smart-card-wrapper .rb-fyv-rebate-row {
            grid-template-columns: 30px minmax(0, 1fr);
        }

        .smart-card-wrapper .rb-fyv-rebate-value {
            grid-column: 2;
            justify-self: start;
        }
    }

    .smart-card-wrapper .rb-reward-program-highlight {
        display: inline-flex;
        align-items: baseline;
        gap: 0.42rem;
        max-width: 100%;
        padding: 0.34rem 0.5rem;
        border-radius: 6px 8px 5px 7px;
        background: linear-gradient(100deg, #dce8ff 0%, #f2f6ff 100%);
        box-shadow: inset 0 -1px 0 rgba(44, 82, 145, 0.09);
        color: #29486f;
        font-size: 0.75rem;
        font-weight: 790;
        line-height: 1.15;
    }

    .smart-card-wrapper .rb-reward-program-highlight strong {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        color: #153f78;
        font-size: 0.86rem;
        font-weight: 900;
        overflow-wrap: anywhere;
    }

    .smart-card-wrapper .rb-reward-program-highlight strong i {
        color: #3c6eae;
        font-size: 0.72rem;
    }

    .smart-card-wrapper .rb-modern-value-row {
        display: flex;
        flex-wrap: wrap;
        gap: 0.4rem 0.65rem;
        margin-bottom: 1rem;
    }

    .smart-card-wrapper .rb-modern-value-chip,
    .smart-card-wrapper .rb-modern-info-chip,
    .smart-card-wrapper .rb-modern-metal-chip,
    .smart-card-wrapper .rb-modern-reward-chip {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        min-height: 29px;
        padding: 0.35rem 0.56rem;
        border: 1px solid #dce8e1;
        border-radius: 9px;
        background: #f7fbf8;
        color: #264435;
        font-size: 0.68rem;
        font-weight: 720;
        line-height: 1.15;
    }

    .smart-card-wrapper .rb-modern-value-chip {
        border-color: #bfe4cf;
        background: #effaf3;
        color: #11663b;
    }

    .smart-card-wrapper .rb-modern-info-chip {
        border-color: #cfe8f1;
        background: #f0f9fc;
        color: #155e75;
    }

    .smart-card-wrapper .rb-modern-metal-chip {
        border-color: #d5d9dc;
        background: linear-gradient(135deg, #eef0f1 0%, #ffffff 50%, #d9dddf 100%);
        color: #30363a;
    }

    .smart-card-wrapper .rb-modern-reward-chip {
        border-color: #eedca6;
        background: #fffaf0;
        color: #6d4c0d;
    }

    /* Push public-facing offer messaging into the lower part of column 2.
       This creates breathing room above without changing existing promos. */
    .smart-card-wrapper .rb-modern-message-stack {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        margin-top: 0.38rem;
        padding-top: 0;
    }

    /* ========================================================= */
    /* REBATE HEADLINE + INLINE EXPIRATION                        */
    /* ========================================================= */

    .smart-card-wrapper .rb-public-rebate-badge-highlight {
        display: inline-flex;
        align-items: flex-start;
        align-self: flex-start;
        gap: 0.3rem;
        width: fit-content;
        max-width: 100%;
        margin: 0 0 0.82rem 0.12rem;
        padding: 0;
        background: transparent;
        color: #145f3a;
        font-size: 0.72rem;
        font-weight: 820;
        line-height: 1.5;
    }

    .smart-card-wrapper .rb-public-rebate-badge-highlight > i {
        flex: 0 0 auto;
        margin-top: 0.18rem;
        color: #16834b;
        font-size: 0.74rem;
    }

    .smart-card-wrapper .rb-public-rebate-copy {
        display: inline;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .smart-card-wrapper .rb-public-rebate-headline-text {
        display: inline;
        padding: 0 0.16rem;
        background: linear-gradient(180deg, transparent 24%, #dff7e8 24%, #dff7e8 90%, transparent 90%);
        -webkit-box-decoration-break: clone;
        box-decoration-break: clone;
    }

    .smart-card-wrapper .rb-public-rebate-expiry-inline {
        display: inline;
        margin-left: 0.42rem;
        padding: 0.04rem 0.2rem;
        background: linear-gradient(
            180deg,
            transparent 8%,
            #ffeb9f 8%,
            #ffeb9f 96%,
            transparent 96%
        );
        -webkit-box-decoration-break: clone;
        box-decoration-break: clone;
        color: #744d00;
        font-size: 0.69rem;
        font-weight: 780;
        line-height: 1.5;
        white-space: normal;
    }


    .smart-card-wrapper .rb-public-rebate-expiry-inline:first-child {
        margin-left: 0;
    }

    .smart-card-wrapper .rb-public-rebate-expiry-inline i {
        margin-right: 0.12rem;
        color: #a36d00;
        font-size: 0.68rem;
    }

    .smart-card-wrapper .rb-public-rebate-expiry-inline strong {
        color: #5f3e00;
        font-weight: 900;
        white-space: nowrap;
    }

    /* Offer information */
    .smart-card-wrapper .rb-modern-offer-box {
        display: grid;
        gap: 0.5rem;
        margin: 0 0 0.72rem;
        padding: 0.72rem 0.78rem;
        border: 1px solid #dcebe2;
        border-radius: 13px;
        background: linear-gradient(135deg, #f8fcf9 0%, #ffffff 100%);
    }

    .smart-card-wrapper .rb-modern-offer-promo {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 0.3rem 0.62rem;
        padding-bottom: 0.48rem;
        border-bottom: 1px solid #e5eee9;
        color: #31443a;
        font-size: 0.79rem;
        line-height: 1.45;
    }

    .smart-card-wrapper .rb-modern-offer-promo strong {
        color: #0b6b3a;
        font-size: 0.82rem;
    }

    .smart-card-wrapper .rb-modern-offer-promo span {
        color: #526158;
        font-style: italic;
    }

    .smart-card-wrapper .rb-modern-offer-line {
        display: flex;
        align-items: flex-start;
        gap: 0.52rem;
        min-width: 0;
        color: #334155;
        font-size: 0.79rem;
        line-height: 1.48;
    }

    .smart-card-wrapper .rb-modern-offer-line .offer-text {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    .smart-card-wrapper .rb-modern-offer-line .offer-text strong {
        color: #17231c;
        font-weight: 820;
    }

    .smart-card-wrapper .rb-modern-offer-icon {
        display: inline-flex;
        flex: 0 0 27px;
        align-items: center;
        justify-content: center;
        width: 27px;
        height: 27px;
        border: 1px solid transparent;
        border-radius: 8px;
        font-size: 0.72rem;
    }

    .smart-card-wrapper .rb-modern-offer-icon--gift {
        border-color: #bce4cd;
        background: #ecf9f1;
        color: #087443;
    }

    .smart-card-wrapper .rb-modern-offer-icon--transfer {
        border-color: #cbdcf5;
        background: #f1f6fd;
        color: #1d4ed8;
    }

    .smart-card-wrapper .rb-modern-offer-icon--general {
        border-color: #f0dfaf;
        background: #fff9e8;
        color: #9a6700;
    }

    .smart-card-wrapper .rb-modern-offer-line .offer-expiry {
        display: inline-block;
        margin-left: 0.25rem;
        color: #7c5a16;
        font-size: 0.7rem;
        font-weight: 750;
        white-space: normal;
    }

    /* Full-width card highlights */
    .smart-card-wrapper .rb-modern-highlights-footer {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 170px minmax(0, 1fr);
        gap: 0.78rem 1rem;
        align-items: start;
        padding-top: 1rem;
        border-top: 1px solid #e1e9e4;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .smart-card-wrapper .rb-modern-highlights-heading {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
    }

    .smart-card-wrapper .rb-modern-highlights-heading > span {
        display: inline-flex;
        align-items: center;
        gap: 0.32rem;
        color: #234132;
        font-size: 0.72rem;
        font-weight: 850;
        letter-spacing: 0.035em;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-modern-highlights-heading > span i {
        color: #16834b;
    }

    .smart-card-wrapper .rb-modern-highlight-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.48rem 1rem;
        min-width: 0;
    }

    .smart-card-wrapper .rb-modern-highlight-list > span {
        display: inline-flex;
        align-items: flex-start;
        gap: 0.28rem;
        color: #3d4c44;
        font-size: 0.72rem;
        font-weight: 650;
        line-height: 1.4;
    }

    .smart-card-wrapper .rb-modern-highlight-list > span i {
        margin-top: 0.08rem;
        color: #27905a;
        font-size: 0.65rem;
    }

    .smart-card-wrapper .rb-modern-more-features {
        display: inline-flex;
        align-items: center;
        gap: 0.22rem;
        padding: 0;
        border: 0;
        background: transparent;
        color: #087443;
        font-size: 0.66rem;
        font-weight: 800;
        line-height: 1.35;
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: 2px;
    }

    /* Action column */
    .smart-card-wrapper .rb-modern-card-actions {
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-width: 0;
        padding-left: 1.35rem;
        border-left: 1px solid #e3ebe6;
    }

    .smart-card-wrapper .rb-modern-action-promo {
        margin-bottom: 0.7rem;
        border-color: #d7e5dc;
        background: #fbfdfc;
        box-shadow: none;
    }

    .smart-card-wrapper .rb-modern-action-promo .action-promo-title {
        font-size: 0.8rem;
    }

    .smart-card-wrapper .rb-modern-action-promo .action-promo-description {
        font-size: 0.74rem;
        line-height: 1.42;
    }

    .smart-card-wrapper .rb-modern-button-stack {
        display: grid;
        gap: 0.52rem;
        width: 100%;
    }

    .smart-card-wrapper .rb-modern-primary-actions {
        display: grid;
        gap: 0.52rem;
        width: 100%;
    }

    .smart-card-wrapper .rb-modern-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.42rem;
        width: 100%;
        min-height: 43px;
        padding: 0.62rem 0.7rem;
        border: 1px solid transparent;
        border-radius: 10px;
        font-size: 0.78rem;
        font-weight: 850;
        line-height: 1.2;
        letter-spacing: -0.005em;
        text-decoration: none;
        transition: transform 150ms ease, box-shadow 150ms ease, background-color 150ms ease, border-color 150ms ease;
    }

    .smart-card-wrapper .rb-modern-btn:hover {
        transform: translateY(-1px);
    }

    .smart-card-wrapper .rb-modern-btn:focus-visible,
    .smart-card-wrapper .rb-modern-breakdown-toggle:focus-visible,
    .smart-card-wrapper .rb-modern-more-features:focus-visible {
        outline: 3px solid rgba(34, 139, 84, 0.24);
        outline-offset: 2px;
    }

    .smart-card-wrapper .rb-modern-btn--apply {
        border-color: #075c36;
        background: #087443;
        color: #ffffff;
        box-shadow: 0 7px 15px rgba(8, 116, 67, 0.2);
    }

    .smart-card-wrapper .rb-modern-btn--apply:hover,
    .smart-card-wrapper .rb-modern-btn--apply:focus {
        border-color: #06482b;
        background: #065f38;
        color: #ffffff;
        box-shadow: 0 9px 18px rgba(8, 116, 67, 0.25);
    }

    .smart-card-wrapper .rb-modern-btn--rebate {
        padding-left: 0.95rem;
        padding-right: 1.05rem;
        border-color: #d3a514;
        border-radius: 5px;
        background: linear-gradient(135deg, #ffd75a 0%, #ffe98d 58%, #fff3b6 100%);
        clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%, 7px 50%);
        color: #4f3300;
        filter: drop-shadow(0 6px 8px rgba(139, 101, 0, 0.18));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
    }

    .smart-card-wrapper .rb-modern-btn--rebate:hover,
    .smart-card-wrapper .rb-modern-btn--rebate:focus {
        border-color: #b98700;
        background: linear-gradient(135deg, #ffce32 0%, #ffe171 58%, #ffefaa 100%);
        color: #3f2900;
        filter: drop-shadow(0 8px 10px rgba(139, 101, 0, 0.23));
    }

    .smart-card-wrapper .rb-modern-btn--learn {
        min-height: 33px;
        padding-top: 0.34rem;
        padding-bottom: 0.34rem;
        border-color: #d5dadd;
        background: #eef0f1;
        color: #171b19;
        font-size: 0.69rem;
        font-weight: 850;
    }

    .smart-card-wrapper .rb-modern-btn--learn:hover,
    .smart-card-wrapper .rb-modern-btn--learn:focus {
        border-color: #bdc5c0;
        background: #e2e6e4;
        color: #0c110e;
    }

    .smart-card-wrapper .rb-modern-secure-note {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0.25rem;
        margin: 0.02rem 0;
        color: #64748b;
        font-size: 0.6rem;
        font-weight: 620;
        line-height: 1.3;
        text-align: center;
    }

    .smart-card-wrapper .rb-modern-secure-note i {
        color: #218a53;
    }

    .smart-card-wrapper .rb-modern-secure-note a {
        color: #176b40;
        font-weight: 800;
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: 2px;
    }

    .smart-card-wrapper .rb-modern-secure-note a:hover,
    .smart-card-wrapper .rb-modern-secure-note a:focus {
        color: #084f2c;
    }

    .smart-card-wrapper .rb-modern-secure-note-separator {
        color: #a0aaa4;
    }

    .smart-card-wrapper .rb-modern-breakdown-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.3rem;
        margin-top: 0.72rem;
        padding: 0.2rem;
        border: 0;
        background: transparent;
        color: #385044;
        font-size: 0.68rem;
        font-weight: 780;
        line-height: 1.3;
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: 3px;
    }

    .smart-card-wrapper .rb-modern-breakdown-toggle:hover {
        color: #087443;
    }

    /* Drawer continuity */
    .smart-card-wrapper.rb-modern-resource-card .details-drawer {
        border-top: 1px solid #dce7e0;
        background: #ffffff;
    }

    /* Large tablet */
    @media (max-width: 1199.98px) {
        .smart-card-wrapper .rb-modern-card-main {
            --rb-card-edge-offset: 1.15rem;
            grid-template-columns: 166px minmax(0, 1fr) 246px;
            gap: 1rem;
            padding: 1.15rem;
        }

        .smart-card-wrapper .rb-modern-card-actions {
            padding-left: 1rem;
        }

        .smart-card-wrapper .rb-modern-best-for {
            justify-content: flex-start;
        }

        .smart-card-wrapper .rb-modern-card-kicker {
            flex-direction: column;
            gap: 0.4rem;
        }
    }

    /* Tablet: image/content above a full-width action area */
    @media (max-width: 991.98px) {
        .smart-card-wrapper .rb-modern-card-main {
            grid-template-columns: 170px minmax(0, 1fr);
            min-height: 0;
        }

        .smart-card-wrapper .rb-modern-card-actions {
            grid-column: 1 / -1;
            display: grid;
            grid-template-columns: 1fr;
            gap: 0.65rem;
            padding: 1rem 0 0;
            border-top: 1px solid #e3ebe6;
            border-left: 0;
        }

        .smart-card-wrapper .rb-modern-action-promo {
            margin: 0;
        }

        .smart-card-wrapper .rb-modern-button-stack {
            grid-template-columns: 1fr;
            align-content: start;
        }

        .smart-card-wrapper .rb-modern-primary-actions {
            grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        }

        .smart-card-wrapper .rb-modern-btn--learn {
            grid-column: auto;
        }

        .smart-card-wrapper .rb-modern-secure-note {
            margin-top: 0;
        }

        .smart-card-wrapper .rb-modern-breakdown-toggle {
            margin-top: 0;
        }
    }

    /* Mobile */
    @media (max-width: 767.98px) {
        .smart-card-wrapper.rb-modern-resource-card {
            border-radius: 15px;
        }

        .smart-card-wrapper .rb-modern-card-main {
            --rb-card-edge-offset: 1rem;
            grid-template-columns: 1fr;
            gap: 1rem;
            padding: 1rem;
        }

        .smart-card-wrapper .rb-modern-card-visual {
            display: grid;
            grid-template-columns: 1fr;
            gap: 0.5rem;
            align-items: center;
            padding: 0 0 0.9rem;
            border-bottom: 1px solid #e5ece8;
        }

        .smart-card-wrapper .rb-modern-card-image-stage {
            width: 100%;
            min-width: 0;
        }

        .smart-card-wrapper .rb-modern-card-image-link {
            min-height: 100px;
            padding: 0;
        }

        .smart-card-wrapper .rb-modern-card-image {
            max-height: 96px;
        }

        .smart-card-wrapper .rb-modern-card-facts {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            align-items: stretch;
            gap: 0.3rem;
            width: 100%;
            min-width: 0;
            margin-top: 0;
        }

        .smart-card-wrapper .rb-modern-card-fact {
            min-width: 0;
        }

        .smart-card-wrapper .rb-modern-card-fact-marker {
            grid-template-columns: 1fr;
            align-content: center;
            gap: 0.1rem;
            height: 100%;
            padding: 0.32rem 0.36rem;
        }

        .smart-card-wrapper .rb-modern-card-fact-label,
        .smart-card-wrapper .rb-modern-card-fact-value {
            min-width: 0;
            max-width: 100%;
        }

        .smart-card-wrapper .rb-modern-card-fact-value {
            display: block;
            box-sizing: border-box;
            width: 100%;
            text-align: left;
            white-space: nowrap;
            font-size: clamp(0.58rem, 2.7vw, 0.68rem);
        }

        .smart-card-wrapper .rb-modern-left-rebate {
            grid-column: auto;
            margin: 0 10px 0 calc(-1 * var(--rb-card-edge-offset));
        }

        .smart-card-wrapper .rb-modern-card-kicker {
            align-items: flex-start;
        }

        .smart-card-wrapper .rb-modern-card-title {
            font-size: 1.22rem;
        }

        .smart-card-wrapper .rb-modern-value-summary-row {
            align-items: flex-start;
        }

        .smart-card-wrapper .rb-modern-card-actions {
            grid-column: auto;
            display: flex;
            gap: 0.65rem;
            margin-top: 0.15rem;
            padding: 1rem 0 0;
        }

        .smart-card-wrapper .rb-modern-action-promo {
            margin: 0 0 0.1rem;
        }

        .smart-card-wrapper .rb-modern-button-stack {
            display: grid;
            grid-template-columns: 1fr;
            gap: 0.68rem;
            width: 100%;
        }

        .smart-card-wrapper .rb-modern-primary-actions {
            grid-template-columns: 1fr;
            gap: 0.68rem;
        }

        .smart-card-wrapper .rb-modern-btn {
            min-height: 52px;
            padding: 0.78rem 0.9rem;
            border-radius: 12px;
            font-size: 0.88rem;
            box-shadow: 0 8px 18px rgba(15, 75, 43, 0.13);
        }

        .smart-card-wrapper .rb-modern-btn--learn {
            min-height: 37px;
            padding: 0.42rem 0.76rem;
            border-radius: 10px;
            font-size: 0.74rem;
            box-shadow: 0 4px 10px rgba(15, 75, 43, 0.08);
        }

        .smart-card-wrapper .rb-modern-secure-note {
            margin-top: 0;
            font-size: 0.66rem;
        }

        .smart-card-wrapper .rb-modern-breakdown-toggle {
            min-height: 38px;
            margin-top: 0.1rem;
            font-size: 0.72rem;
        }

        .smart-card-wrapper .rb-modern-highlights-footer {
            grid-template-columns: 1fr;
            gap: 0.62rem;
        }

        .smart-card-wrapper .rb-modern-highlights-heading {
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
        }

        .smart-card-wrapper .rb-modern-highlight-list {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .smart-card-wrapper .drawer-tabs {
            overflow-x: auto;
            justify-content: flex-start;
        }

        .smart-card-wrapper .drawer-tab {
            flex: 0 0 auto;
            min-width: 112px;
        }

        /* Keep the provider above the title and move Best for below the title. */
        .smart-card-wrapper .rb-modern-best-for--desktop {
            display: none;
        }

        .smart-card-wrapper .rb-modern-best-for--mobile {
            display: flex;
            justify-content: flex-start;
            gap: 0.32rem;
            width: 100%;
            margin: 0 0 0.68rem;
        }

    }

    @media (max-width: 420px) {
        .smart-card-wrapper .rb-modern-card-visual {
            grid-template-columns: 1fr;
        }

        .smart-card-wrapper .rb-modern-card-facts {
            grid-template-columns: 1fr;
            align-items: stretch;
        }

        .smart-card-wrapper .rb-modern-card-fact-marker {
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
        }

        .smart-card-wrapper .rb-modern-card-fact-value {
            text-align: right;
            font-size: 0.68rem;
        }

        .smart-card-wrapper .rb-modern-card-kicker {
            align-items: stretch;
        }

        .smart-card-wrapper .rb-modern-best-for {
            justify-content: flex-start;
        }

        .smart-card-wrapper .rb-modern-highlight-list {
            grid-template-columns: 1fr;
        }

        .smart-card-wrapper .rb-modern-highlights-heading {
            align-items: flex-start;
            flex-direction: column;
        }
    }

    /* ================================================================== */
    /* MODULAR DETAILS DRAWER — V3                                        */
    /* Details, Rewards, Features and RateBuddy verdict remain independent */
    /* partials inside one responsive shell.                               */
    /* ================================================================== */
    .smart-card-wrapper .rb-modern-drawer {
        border-top: 1px solid #b9dbc8;
        background: #f5faf7;
    }

    .smart-card-wrapper .rb-modern-drawer-tabs {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
        align-items: stretch;
        gap: 0;
        overflow: visible;
        border-bottom: 1px solid #dbe8e0;
        background: #edf6f0;
    }

    .smart-card-wrapper .rb-modern-drawer-tabs.has-verdict {
        grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
    }

    .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.62rem;
        min-width: 0;
        padding: 0.82rem 0.72rem;
        border: 0;
        border-right: 1px solid #dbe8e0;
        border-bottom: 3px solid transparent;
        background: transparent;
        color: #52645a;
        text-align: left;
        transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
    }

    .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab:hover {
        background: #e3f1e8;
        color: #174d32;
    }

    .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab.active {
        border-bottom-color: #16804a;
        background: #ffffff;
        color: #0d6338;
        box-shadow: inset 0 1px 0 #ffffff;
    }

    .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab > span:last-child {
        display: flex;
        flex-direction: column;
        min-width: 0;
        line-height: 1.15;
    }

    .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab strong {
        color: inherit;
        font-size: 0.79rem;
        font-weight: 850;
    }

    .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab small {
        margin-top: 0.18rem;
        overflow: hidden;
        color: #75837b;
        font-size: 0.61rem;
        font-weight: 650;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .smart-card-wrapper .rb-modern-drawer-tab-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 29px;
        height: 29px;
        flex: 0 0 29px;
        border: 1px solid #cfe2d6;
        border-radius: 9px;
        background: rgba(255, 255, 255, 0.72);
        color: #26764a;
        font-size: 0.85rem;
    }

    .smart-card-wrapper .drawer-tab.active .rb-modern-drawer-tab-icon {
        border-color: #9dd0b2;
        background: #e5f6ec;
        color: #087443;
    }

    .smart-card-wrapper .rb-modern-drawer-close {
        min-width: 82px;
        border: 0;
        border-left: 1px solid #dbe8e0;
        background: #ffffff;
        color: #53635a;
        font-size: 0.72rem;
        font-weight: 800;
    }

    .smart-card-wrapper .rb-modern-drawer-close:hover {
        background: #f0f5f2;
        color: #123e29;
    }

    .smart-card-wrapper .rb-modern-drawer-content {
        padding: 1.18rem;
        background:
            radial-gradient(circle at top right, rgba(36, 144, 84, 0.06), transparent 30%),
            #f6faf7;
    }

    .smart-card-wrapper .rb-modern-drawer-content > .tab-pane {
        animation: rbDrawerPaneIn 180ms ease-out;
    }

    @keyframes rbDrawerPaneIn {
        from { opacity: 0; transform: translateY(4px); }
        to { opacity: 1; transform: translateY(0); }
    }

    .smart-card-wrapper .rb-drawer-section {
        padding: 1.15rem;
        border: 1px solid #dce8e1;
        border-radius: 16px;
        background: #ffffff;
        box-shadow: 0 7px 20px rgba(31, 78, 50, 0.05);
    }

    .smart-card-wrapper .rb-drawer-section-header {
        display: flex;
        align-items: flex-start;
        gap: 0.82rem;
        margin-bottom: 1rem;
    }

    .smart-card-wrapper .rb-drawer-section-header--split {
        justify-content: space-between;
    }

    .smart-card-wrapper .rb-drawer-section-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 39px;
        height: 39px;
        flex: 0 0 39px;
        border: 1px solid transparent;
        border-radius: 12px;
        font-size: 1rem;
    }

    .smart-card-wrapper .rb-drawer-section-icon--green {
        border-color: #bde3cc;
        background: #e9f8ef;
        color: #087443;
    }

    .smart-card-wrapper .rb-drawer-section-icon--blue {
        border-color: #c8e1eb;
        background: #eef8fb;
        color: #17647e;
    }

    .smart-card-wrapper .rb-drawer-section-icon--purple {
        border-color: #dcd1ed;
        background: #f5f0fb;
        color: #69459a;
    }

    .smart-card-wrapper .rb-drawer-section-icon--gold {
        border-color: #ead8a5;
        background: #fff8e8;
        color: #8b6100;
    }

    .smart-card-wrapper .rb-drawer-eyebrow {
        margin: 0 0 0.18rem;
        color: #21804d;
        font-size: 0.61rem;
        font-weight: 850;
        letter-spacing: 0.09em;
        line-height: 1.2;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-drawer-section-title {
        margin: 0;
        color: #132a1d;
        font-size: 1rem;
        font-weight: 850;
        letter-spacing: -0.01em;
        line-height: 1.25;
    }

    .smart-card-wrapper .rb-drawer-section-copy {
        margin: 0.22rem 0 0;
        color: #65746b;
        font-size: 0.73rem;
        line-height: 1.45;
    }

    /* Details */
    .smart-card-wrapper .rb-drawer-metric-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.68rem;
    }

    .smart-card-wrapper .rb-drawer-metric {
        display: flex;
        align-items: flex-start;
        gap: 0.65rem;
        min-width: 0;
        padding: 0.78rem;
        border: 1px solid #e1e9e4;
        border-radius: 13px;
        background: #fbfdfc;
    }

    .smart-card-wrapper .rb-drawer-metric--featured {
        border-color: #b9dec8;
        background: linear-gradient(145deg, #eef9f2, #ffffff);
    }

    .smart-card-wrapper .rb-drawer-metric-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 31px;
        height: 31px;
        flex: 0 0 31px;
        border-radius: 9px;
        background: #edf5f0;
        color: #28774b;
        font-size: 0.83rem;
    }

    .smart-card-wrapper .rb-drawer-metric > div {
        display: flex;
        flex-direction: column;
        min-width: 0;
    }

    .smart-card-wrapper .rb-drawer-metric-label {
        color: #718078;
        font-size: 0.61rem;
        font-weight: 780;
        letter-spacing: 0.04em;
        line-height: 1.2;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-drawer-metric-value {
        margin-top: 0.22rem;
        color: #162a1d;
        font-size: 0.94rem;
        font-weight: 850;
        line-height: 1.2;
    }

    .smart-card-wrapper .rb-drawer-metric-value--success {
        color: #087443;
    }

    .smart-card-wrapper .rb-drawer-metric small {
        margin-top: 0.2rem;
        color: #7a8780;
        font-size: 0.59rem;
        line-height: 1.3;
    }

    .smart-card-wrapper .rb-drawer-eligibility-panel {
        margin-top: 0.82rem;
        padding: 0.88rem;
        border: 1px solid #d5e7df;
        border-radius: 14px;
        background: linear-gradient(135deg, #f4faf7, #ffffff);
    }

    .smart-card-wrapper .rb-drawer-eligibility-heading {
        display: flex;
        align-items: center;
        gap: 0.68rem;
        margin-bottom: 0.72rem;
    }

    .smart-card-wrapper .rb-drawer-eligibility-heading .rb-drawer-section-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }

    .smart-card-wrapper .rb-drawer-eligibility-heading h4 {
        margin: 0;
        color: #183327;
        font-size: 0.85rem;
        font-weight: 820;
    }

    .smart-card-wrapper .rb-drawer-eligibility-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        overflow: hidden;
        border: 1px solid #e0e9e4;
        border-radius: 11px;
        background: #ffffff;
    }

    .smart-card-wrapper .rb-drawer-eligibility-grid > div {
        display: flex;
        flex-direction: column;
        gap: 0.22rem;
        padding: 0.68rem 0.76rem;
        border-right: 1px solid #e6ece8;
    }

    .smart-card-wrapper .rb-drawer-eligibility-grid > div:last-child {
        border-right: 0;
    }

    .smart-card-wrapper .rb-drawer-eligibility-grid span {
        color: #75827a;
        font-size: 0.61rem;
        font-weight: 700;
    }

    .smart-card-wrapper .rb-drawer-eligibility-grid strong {
        color: #183126;
        font-size: 0.78rem;
        font-weight: 820;
    }

    .smart-card-wrapper .rb-drawer-footnote {
        display: flex;
        align-items: flex-start;
        gap: 0.38rem;
        margin-top: 0.62rem;
        color: #718078;
        font-size: 0.63rem;
        line-height: 1.4;
    }

    .smart-card-wrapper .rb-drawer-footnote i {
        margin-top: 0.08rem;
        color: #33835a;
    }

    /* Features */
    .smart-card-wrapper .rb-drawer-count-badge {
        flex: 0 0 auto;
        padding: 0.34rem 0.62rem;
        border: 1px solid #d6c7e8;
        border-radius: 999px;
        background: #f7f3fb;
        color: #69459a;
        font-size: 0.64rem;
        font-weight: 800;
    }

    .smart-card-wrapper .rb-drawer-feature-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.58rem;
    }

    .smart-card-wrapper .rb-drawer-feature-item {
        display: flex;
        align-items: flex-start;
        gap: 0.62rem;
        min-width: 0;
        padding: 0.7rem 0.76rem;
        border: 1px solid #e2e8e4;
        border-radius: 12px;
        background: #fbfdfc;
        color: #293a31;
        font-size: 0.72rem;
        font-weight: 680;
        line-height: 1.4;
    }

    .smart-card-wrapper .rb-drawer-feature-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        flex: 0 0 28px;
        border-radius: 9px;
        background: #eef7f2;
        color: #21804d;
        font-size: 0.78rem;
    }

    /* RateBuddy verdict */
    .smart-card-wrapper .rb-drawer-opinion {
        display: flex;
        gap: 0.78rem;
        margin: 0 0 0.85rem;
        padding: 0.88rem;
        border: 1px solid #d9e6df;
        border-radius: 14px;
        background: linear-gradient(135deg, #f5faf7, #ffffff);
    }

    .smart-card-wrapper .rb-drawer-opinion-mark {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        flex: 0 0 36px;
        border-radius: 11px;
        background: #e5f4eb;
        color: #188049;
        font-size: 1.05rem;
    }

    .smart-card-wrapper .rb-drawer-opinion-label {
        color: #1a7547;
        font-size: 0.61rem;
        font-weight: 850;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-drawer-opinion p {
        margin: 0.25rem 0 0;
        color: #33463b;
        font-size: 0.75rem;
        line-height: 1.58;
    }

    .smart-card-wrapper .rb-drawer-verdict-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.72rem;
    }

    .smart-card-wrapper .rb-drawer-verdict-grid--single {
        grid-template-columns: 1fr;
    }

    .smart-card-wrapper .rb-drawer-verdict-card {
        overflow: hidden;
        border: 1px solid #e0e7e2;
        border-radius: 14px;
        background: #ffffff;
    }

    .smart-card-wrapper .rb-drawer-verdict-card header {
        display: flex;
        align-items: center;
        gap: 0.62rem;
        padding: 0.7rem 0.78rem;
        border-bottom: 1px solid #e8edea;
    }

    .smart-card-wrapper .rb-drawer-verdict-card header > span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 30px;
        height: 30px;
        flex: 0 0 30px;
        border-radius: 9px;
    }

    .smart-card-wrapper .rb-drawer-verdict-card header p {
        margin: 0 0 0.08rem;
        font-size: 0.57rem;
        font-weight: 820;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .smart-card-wrapper .rb-drawer-verdict-card header h4 {
        margin: 0;
        color: #23342b;
        font-size: 0.78rem;
        font-weight: 820;
    }

    .smart-card-wrapper .rb-drawer-verdict-card--pros header {
        background: #f0faf4;
    }

    .smart-card-wrapper .rb-drawer-verdict-card--pros header > span {
        background: #dff4e7;
        color: #087443;
    }

    .smart-card-wrapper .rb-drawer-verdict-card--pros header p {
        color: #147344;
    }

    .smart-card-wrapper .rb-drawer-verdict-card--cons header {
        background: #fff9ef;
    }

    .smart-card-wrapper .rb-drawer-verdict-card--cons header > span {
        background: #fcedca;
        color: #8a650f;
    }

    .smart-card-wrapper .rb-drawer-verdict-card--cons header p {
        color: #86610c;
    }

    .smart-card-wrapper .rb-drawer-verdict-card ul {
        display: grid;
        gap: 0.56rem;
        margin: 0;
        padding: 0.76rem;
        list-style: none;
    }

    .smart-card-wrapper .rb-drawer-verdict-card li {
        display: flex;
        align-items: flex-start;
        gap: 0.48rem;
        color: #3d4e44;
        font-size: 0.7rem;
        line-height: 1.45;
    }

    .smart-card-wrapper .rb-drawer-verdict-card li i {
        margin-top: 0.12rem;
        flex: 0 0 auto;
    }

    .smart-card-wrapper .rb-drawer-verdict-card--pros li i {
        color: #16834b;
    }

    .smart-card-wrapper .rb-drawer-verdict-card--cons li i {
        color: #b1841b;
    }

    .smart-card-wrapper .rb-drawer-empty-state {
        padding: 1.5rem 1rem;
        border: 1px dashed #cfdcd4;
        border-radius: 14px;
        background: #f9fcfa;
        text-align: center;
    }

    .smart-card-wrapper .rb-drawer-empty-state > span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        margin-bottom: 0.6rem;
        border-radius: 13px;
        background: #eaf5ee;
        color: #28784c;
        font-size: 1.05rem;
    }

    .smart-card-wrapper .rb-drawer-empty-state h4 {
        margin: 0;
        color: #273a30;
        font-size: 0.85rem;
        font-weight: 820;
    }

    .smart-card-wrapper .rb-drawer-empty-state p {
        margin: 0.3rem auto 0;
        max-width: 520px;
        color: #718078;
        font-size: 0.7rem;
        line-height: 1.5;
    }

    @media (max-width: 991.98px) {
        .smart-card-wrapper .rb-modern-drawer-tabs {
            display: flex;
            overflow-x: auto;
            scrollbar-width: thin;
        }

        .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab {
            flex: 0 0 150px;
            justify-content: flex-start;
        }

        .smart-card-wrapper .rb-modern-drawer-close {
            position: sticky;
            right: 0;
            flex: 0 0 72px;
            z-index: 2;
            box-shadow: -8px 0 14px rgba(36, 67, 48, 0.08);
        }

        .smart-card-wrapper .rb-drawer-metric-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 767.98px) {
        .smart-card-wrapper .rb-modern-drawer-tabs,
        .smart-card-wrapper .rb-modern-drawer-tabs.has-verdict {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            overflow: visible;
        }

        .smart-card-wrapper .rb-modern-drawer-content {
            padding: 0.78rem;
        }

        .smart-card-wrapper .rb-drawer-section {
            padding: 0.85rem;
            border-radius: 13px;
        }

        .smart-card-wrapper .rb-drawer-section-header--split {
            gap: 0.7rem;
        }

        .smart-card-wrapper .rb-drawer-section-copy,
        .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab small {
            display: none;
        }

        .smart-card-wrapper .rb-modern-drawer-tabs .drawer-tab {
            width: 100%;
            min-width: 0;
            flex: none;
            justify-content: flex-start;
            padding: 0.72rem 0.62rem;
        }

        .smart-card-wrapper .rb-modern-drawer-tabs:not(.has-verdict) .drawer-tab:nth-of-type(3) {
            grid-column: 1 / -1;
        }

        .smart-card-wrapper .rb-modern-drawer-close {
            position: static;
            right: auto;
            grid-column: 1 / -1;
            width: 100%;
            min-height: 38px;
            border-top: 1px solid #dbe8e0;
            border-left: 0;
            box-shadow: none;
        }

        .smart-card-wrapper .rb-modern-drawer-tab-icon {
            width: 27px;
            height: 27px;
            flex-basis: 27px;
        }

        .smart-card-wrapper .rb-drawer-metric-grid,
        .smart-card-wrapper .rb-drawer-feature-grid,
        .smart-card-wrapper .rb-drawer-verdict-grid {
            grid-template-columns: 1fr;
        }

        .smart-card-wrapper .rb-drawer-eligibility-grid {
            grid-template-columns: 1fr;
        }

        .smart-card-wrapper .rb-drawer-eligibility-grid > div {
            border-right: 0;
            border-bottom: 1px solid #e6ece8;
        }

        .smart-card-wrapper .rb-drawer-eligibility-grid > div:last-child {
            border-bottom: 0;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .smart-card-wrapper.rb-modern-resource-card,
        .smart-card-wrapper .rb-modern-card-image,
        .smart-card-wrapper .rb-modern-btn,
        .smart-card-wrapper .rb-modern-drawer-content > .tab-pane {
            transition: none;
            animation: none;
        }

        .smart-card-wrapper.rb-modern-resource-card:hover,
        .smart-card-wrapper .rb-modern-btn:hover {
            transform: none;
        }
    }
/* ========================================================================== */
/* FINDER'S ONLY CARD-LAYOUT DIFFERENCE                                       */
/* Keep all category-card styling; relocate column 3 beneath the highlights.  */
/* ========================================================================== */

.smart-card-wrapper.rb-finder-result-card .rb-modern-card-visual,
.smart-card-wrapper.rb-finder-result-card .rb-modern-card-content {
    order: 1;
}

.smart-card-wrapper.rb-finder-result-card .rb-modern-highlights-footer {
    order: 2;
}

.smart-card-wrapper.rb-finder-result-card .rb-modern-card-actions {
    order: 3;
}

@media (min-width: 768px) {
    .smart-card-wrapper.rb-finder-result-card .rb-modern-card-main {
        grid-template-columns: 170px minmax(0, 1fr);
        align-items: start;
        min-height: 0;
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-card-visual {
        grid-column: 1;
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-card-content {
        grid-column: 2;
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-highlights-footer,
    .smart-card-wrapper.rb-finder-result-card .rb-modern-card-actions {
        grid-column: 1 / -1;
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-card-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.65rem;
        padding: 1rem 0 0;
        border-top: 1px solid #e3ebe6;
        border-left: 0;
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-action-promo {
        margin: 0;
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-button-stack {
        grid-template-columns: 1fr;
        align-content: start;
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-primary-actions {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-btn--learn {
        grid-column: auto;
    }

    .smart-card-wrapper.rb-finder-result-card .rb-modern-secure-note,
    .smart-card-wrapper.rb-finder-result-card .rb-modern-breakdown-toggle {
        margin-top: 0;
    }
}