/* =============================================
 * ASD Testimonial Grid
 * ============================================= */

.asd-tg {
    width: 100%;
}

/* --- Header --- */
.asd-tg__header {
    text-align: center;
}

.asd-tg__badge {
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    border: 1.5px solid;
    border-radius: 20px;
    padding: 4px 18px;
    margin-bottom: 12px;
}

.asd-tg__heading {
    margin: 0;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.2;
    font-family: Georgia, 'Times New Roman', serif;
}

/* --- Grid --- */
.asd-tg__grid {
    display: grid;
    grid-template-columns: repeat(var(--tg-cols, 2), 1fr);
}

@media (max-width: 1024px) {
    .asd-tg__grid {
        grid-template-columns: repeat(var(--tg-cols-t, 2), 1fr);
    }
}

@media (max-width: 767px) {
    .asd-tg__grid {
        grid-template-columns: repeat(var(--tg-cols-m, 1), 1fr);
    }
}

/* --- Card --- */
.asd-tg__card {
    display: flex;
    flex-direction: column;
    transition: opacity 0.35s ease, transform 0.35s ease;
}

.asd-tg__card--hidden {
    display: none;
}

.asd-tg__card--reveal {
    animation: asdTgReveal 0.4s ease forwards;
}

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

/* Card top: name + stars */
.asd-tg__card-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}

.asd-tg__card-info {
    flex: 1;
    min-width: 0;
}

.asd-tg__name {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
}

.asd-tg__meta {
    font-size: 13px;
    margin-top: 2px;
    line-height: 1.4;
}

/* --- Stars --- */
.asd-tg__stars {
    display: flex;
    gap: 2px;
    flex-shrink: 0;
}

.asd-tg__stars svg {
    display: block;
}

/* --- Service Badge --- */
.asd-tg__service {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 16px;
    align-self: flex-start;
}

/* --- Quote --- */
.asd-tg__quote-wrap {
    display: flex;
    gap: 6px;
    flex: 1;
    margin-bottom: 16px;
}

.asd-tg__quote-icon {
    flex-shrink: 0;
    font-size: 36px;
    line-height: 1;
    font-weight: 700;
    font-family: Georgia, serif;
    margin-top: -4px;
}

.asd-tg__quote {
    font-size: 15px;
    line-height: 1.65;
    font-style: italic;
}

/* --- Highlight --- */
.asd-tg__highlight {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
}

.asd-tg__highlight-icon {
    margin-right: 6px;
}

/* --- Load More --- */
.asd-tg__loadmore-wrap {
    text-align: center;
}

.asd-tg__loadmore {
    display: inline-block;
    border: none;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    transition: background-color 0.2s ease, transform 0.15s ease;
}

.asd-tg__loadmore:hover {
    transform: translateY(-1px);
}

.asd-tg__loadmore:active {
    transform: translateY(0);
}

/* --- Responsive fine-tuning --- */
@media (max-width: 767px) {
    .asd-tg__heading {
        font-size: 28px;
    }

    .asd-tg__name {
        font-size: 16px;
    }

    .asd-tg__quote {
        font-size: 14px;
    }
}
