:root {
    --brand-primary: #F02A21;
    --bg-color: #f7f9fc;
    --text-dark: #333333;
    --text-light: #666666;
    --card-bg: #ffffff;
}
.amorpdf-grid-wrapper {
    display: flex; flex-wrap: wrap; gap: 24px; max-width: 1200px;
    width: 100%; justify-content: center; margin: 0 auto; padding: 40px;
}
.amorpdf-card {
    background-color: var(--card-bg); text-decoration: none; border-radius: 12px;
    padding: 32px; width: 100%; max-width: 320px; box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    border: 2px solid transparent; transition: all 0.2s ease;
    display: flex; flex-direction: column; align-items: flex-start;
    position: relative;
}
.amorpdf-card:hover {
    transform: translateY(-5px); box-shadow: 0 12px 24px rgba(0,0,0,0.1);
    border-color: var(--brand-primary);
}
.amorpdf-card-icon { margin-bottom: 20px; font-size: 36px; color: var(--brand-primary); }
.amorpdf-card-icon img { width: 40px; height: 40px; object-fit: contain; }
.amorpdf-card-title { font-size: 20px; font-weight: 700; color: var(--text-dark); margin: 0 0 10px 0; }
.amorpdf-card-desc { font-size: 14px; line-height: 1.5; color: var(--text-light); margin: 0; }

.amorpdf-card-icon img{
    width: 50px !important;
    height: 50px !important;
}


.amorpdf-grid-wrapper {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important; /* 4 cards per row */
    gap: 24px !important; /* space between cards */
    padding: 0px !important;
}

/* Optional: responsive tweaks */
@media (max-width: 1024px) {
    .amorpdf-grid-wrapper {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    .amorpdf-grid-wrapper {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 480px) {
    .amorpdf-grid-wrapper {
        grid-template-columns: 1fr !important;
    }
}



.amorpdf-badge{
    position: absolute;
    right: 5%;
    background: #e5322df0;
    border-radius: 20px;
    width: 60px;
    height: 24px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 16px;
    top: 12px;
}

