/* reviews */
.reviews-summary {
    width: 100%;               /* Full width */
    max-width: none;           /* Remove max-width */
    /*margin: 3rem 0;            !* vertical margin only *!*/
    text-align: center;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    padding: 3rem 2rem;           /* padding left and right */
}

.reviews-summary h3 {
    font-size: 2rem;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.reviews-summary > p {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}
.reviews-summary > .AvgRt{
    color: #1a5099 !important;
}

.stars {
    font-size: 2rem;
    color: gold;
    margin-bottom: 2rem;
    letter-spacing: 0.1rem;
}

.top-reviews {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;  /* center boxes */
    gap: 1.2rem;              /* smaller gap */
    padding: 1rem 2rem;       /* padding left and right for breathing room */
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}

.top-reviews blockquote {
    flex: 1 1 210px;          /* reduced width */
    max-width: 210px;
    background: #f9fbff;
    border-left: 6px solid #2266c2;
    border-radius: 15px;
    padding: 1.75rem 1.75rem 1.75rem 2rem;
    box-shadow: 0 6px 14px rgba(34, 102, 194, 0.15);
    font-style: italic;
    font-size: 1.15rem;
    line-height: 1.5;
    position: relative;
    color: #2c3e50;
    transition: box-shadow 0.3s ease, transform 0.3s ease;

    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}


/* Alternate background and border color for left/right */
.top-reviews blockquote:nth-child(odd) {
    background: #e8f0fe;
    border-left-color: #1a73e8;
    text-align: left;
}

.top-reviews blockquote:nth-child(even) {
    background: #fef7f1;
    border-left-color: #ff8c00;
    text-align: right;
}

/* Review author footer */
.top-reviews blockquote footer {
    margin-top: 1.25rem;
    font-weight: 700;
    font-style: normal;
    color: #555;
}

/* Hover effect for a subtle lift */
.top-reviews blockquote:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(34, 102, 194, 0.25);
}

/* Responsive for small screens: stack vertically, full width */
@media (max-width: 650px) {
    .top-reviews {
        flex-direction: column;
        gap: 2rem;
        padding: 1rem 0;
    }
    .top-reviews blockquote {
        max-width: 100%;
        text-align: left !important;
        margin-top: 0;
        margin-bottom: 0;
    }
}

/* parahraph above reviews*/

.reviews-summary h3 {
    font-size: 2.5rem;         /* bigger title */
    margin-bottom: 1rem;    /* more space below the title */
    font-weight: 700;
    color: #1a5099 !important;
    text-align: center;
}

.reviews-summary .reviews-intro {
    font-size: 1.3rem;         /* slightly bigger paragraph */
    font-weight: 500;
    color: #444;
    margin: 0 auto 2rem;       /* margin top 0, bottom bigger spacing, center horizontally */
    max-width: 600px;
    text-align: center;
}

@media (max-width: 576px) {

    .reviews-summary{
        margin: 0 !important;
    }
    .reviewShaka{
        /*margin-top: 20px !important;*/
    }
    .reviews-summary h3{
        font-size: 2.2rem !important;
    }
    .reviews-summary p{
        margin-bottom: 0 !important;
    }
    .reviews-summary .reviews-intro{
        font-size: 1.2rem !important;
        margin-bottom: 0 !important;
    }
    .reviews-summary .stars{
        margin-bottom: 0!important;
    }
}

/*darkmode*/
.dark-mode  .mainReview{
    /*background: var(--gray-900);*/
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
}

.dark-mode .reviews-summary h3, .dark-mode .reviews-summary > .AvgRt{
    color: var(--gold-dark) !important;
    /*color: var(--gold-light);*/
    background: linear-gradient(135deg, var(--gold-dark) 0%, var(--gold-light) 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.dark-mode .reviews-summary .reviews-intro{
    color: var(--gray-100);
}