/* ============================================================
   SCOPED VARIABLES
   ============================================================ */
.gr-wrap {
  --navy:#0b1f3a; --blue-light:#1a7fd4; --teal:#00796b;
  --off-white:#f7f9fc; --gray-lt:#eef1f6; --text-muted:#5a6a7e;
  --radius:12px; --shadow-sm:0 2px 12px rgba(11,31,58,.07); --shadow-md:0 6px 28px rgba(11,31,58,.12);
  --transition:.28s cubic-bezier(.4,0,.2,1);
  font-family:'DM Sans',sans-serif; color:#1e2d40; line-height:1.7;
  background:var(--off-white); padding:72px 0;
}
.gr-wrap *{box-sizing:border-box;}
.gr-wrap img{max-width:100%;height:auto;display:block;}
.gr-wrap a{color:inherit;text-decoration:none;}
.gr-container{max-width:1200px;margin:0 auto;padding:0 24px;}

/* Visually-hidden helper for screen-reader-only text (a11y) */
.gr-sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

.gr-section-label{
  display:inline-block; font-family:'Sora',sans-serif; font-size:.75rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:#00897b;
  background:rgba(0,137,123,.10); padding:.35em .9em; border-radius:50px; margin-bottom:1rem;
}
.gr-title{
  font-family:'Sora',sans-serif; font-size:clamp(1.5rem,3vw,2.2rem); font-weight:800;
  color:var(--navy); line-height:1.22; margin:0 0 .5rem;
}
.gr-title em{font-style:normal; color:var(--blue-light);}

/* Header row */
.gr-header{
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:1.2rem; margin-bottom:2.4rem;
}
.gr-header-left{display:flex; flex-direction:column; gap:.4rem;}
.gr-rating-badge{
  display:inline-flex; align-items:center; gap:.6rem;
  background:#fff; border:1.5px solid var(--gray-lt);
  border-radius:50px; padding:.45rem 1.1rem; box-shadow:var(--shadow-sm);
}
.gr-logo-img{width:20px; height:20px; flex-shrink:0; object-fit:contain;}
.gr-stars{color:#fbbc04; font-size:.9rem; letter-spacing:.05em;}
.gr-score{font-family:'Sora',sans-serif; font-weight:800; font-size:.92rem; color:var(--navy);}
.gr-count{font-size:.8rem; color:var(--text-muted);}
.gr-cta-link{
  display:inline-flex; align-items:center; gap:.5rem;
  background:linear-gradient(135deg,#4285F4,#34A853);
  color:#fff; font-family:'Sora',sans-serif; font-weight:700; font-size:.88rem;
  padding:.65rem 1.4rem; border-radius:50px; transition:all var(--transition);
  white-space:nowrap; flex-shrink:0; box-shadow:0 4px 16px rgba(66,133,244,.28);
}
.gr-cta-link:hover, .gr-cta-link:focus-visible{transform:translateY(-2px); box-shadow:0 8px 28px rgba(66,133,244,.38); color:#fff;}
.gr-cta-link .gr-logo-img{width:18px; height:18px;}

/* Carousel */
.gr-carousel-outer{position:relative; display:flex; align-items:center; gap:14px;}
.gr-viewport{overflow:hidden; flex:1; min-width:0; border-radius:var(--radius);}
.gr-track{display:flex; gap:20px; transition:transform .42s cubic-bezier(.4,0,.2,1); will-change:transform;}

.gr-card{
  flex:0 0 calc((100% - 40px) / 3); min-width:0;
  background:#fff; border-radius:var(--radius); padding:22px 20px;
  border:1.5px solid var(--gray-lt); transition:box-shadow var(--transition), border-color var(--transition);
  position:relative; display:flex; flex-direction:column; gap:.85rem;
}
.gr-card:hover{box-shadow:var(--shadow-md); border-color:rgba(26,127,212,.2);}
.gr-card::before{
  content:'\201C'; position:absolute; top:10px; right:16px;
  font-size:3.2rem; font-family:Georgia,serif; color:var(--gray-lt); line-height:1; pointer-events:none;
}
@media(max-width:900px){ .gr-card{flex:0 0 calc((100% - 20px) / 2);} }
@media(max-width:580px){ .gr-card{flex:0 0 100%;} }

.gr-top{display:flex; align-items:center; gap:.75rem;}
.gr-avatar{
  width:42px; height:42px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-family:'Sora',sans-serif; font-weight:800; font-size:.95rem; color:#fff;
}
.gr-meta{flex:1; min-width:0;}
.gr-name{font-family:'Sora',sans-serif; font-size:.92rem; font-weight:700; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.gr-info{font-size:.73rem; color:var(--text-muted); margin-top:1px;}
.gr-stars-row{display:flex; align-items:center; gap:.4rem;}
.gr-stars-row .gr-stars-icons{color:#fbbc04; font-size:1rem; line-height:1;}
.gr-date{font-size:.74rem; color:var(--text-muted);}
.gr-new-badge{
  display:inline-block; background:#1a73e8; color:#fff; font-size:.65rem;
  font-family:'Sora',sans-serif; font-weight:700; padding:.1rem .4rem; border-radius:4px;
}
.gr-text{font-size:.88rem; color:var(--text-muted); line-height:1.72; font-style:italic; flex:1; margin:0;}
.gr-badge{
  display:inline-flex; align-items:center; gap:.3rem;
  background:rgba(66,133,244,.06); border:1px solid rgba(66,133,244,.15);
  border-radius:4px; padding:.25rem .6rem;
  font-size:.7rem; font-family:'Sora',sans-serif; font-weight:600; color:#4285F4; width:fit-content;
}
.gr-badge .gr-logo-img{width:12px; height:12px;}

/* Arrows */
.gr-arrow{
  flex-shrink:0; width:48px; height:48px; border-radius:50%;
  background:#fff; border:2px solid #1e2d40; box-shadow:0 3px 12px rgba(0,0,0,.20);
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:all var(--transition); color:#000; z-index:2; padding:0;
}
.gr-arrow svg{width:20px; height:20px; pointer-events:none; stroke:#000; stroke-width:2.5;}
.gr-arrow:hover:not(:disabled), .gr-arrow:focus-visible:not(:disabled){
  background:#1e2d40; border-color:#1e2d40; box-shadow:0 6px 20px rgba(30,45,64,.40); transform:scale(1.08);
}
.gr-arrow:hover:not(:disabled) svg, .gr-arrow:focus-visible:not(:disabled) svg{stroke:#fff;}
.gr-arrow:disabled{opacity:.32; cursor:not-allowed; transform:none; border-color:#ccc; box-shadow:none;}
.gr-arrow:disabled svg{stroke:#999;}

/* Dots */
.gr-dots-row{display:flex; align-items:center; justify-content:center; gap:.45rem; margin-top:1.6rem;}
.gr-dot{width:8px; height:8px; border-radius:50%; background:var(--gray-lt); border:none; cursor:pointer; transition:all var(--transition); padding:0;}
.gr-dot.active{background:#4285F4; width:22px; border-radius:4px;}
.gr-dot:focus-visible{outline:2px solid #4285F4; outline-offset:2px;}

/* View all */
.gr-view-all{display:flex; align-items:center; justify-content:center; margin-top:1.6rem;}
.gr-view-all-btn{
  display:inline-flex; align-items:center; gap:.6rem;
  background:#fff; border:2px solid #4285F4; color:#4285F4;
  font-family:'Sora',sans-serif; font-weight:700; font-size:.92rem;
  padding:.75rem 2rem; border-radius:50px; transition:all var(--transition);
}
.gr-view-all-btn:hover, .gr-view-all-btn:focus-visible{background:#4285F4; color:#fff; transform:translateY(-2px); box-shadow:0 8px 24px rgba(66,133,244,.3);}

/* Focus visibility everywhere (a11y) */
.gr-wrap a:focus-visible, .gr-wrap button:focus-visible{outline:2px solid #4285F4; outline-offset:2px;}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .gr-track{transition:none;}
  .gr-cta-link, .gr-arrow, .gr-view-all-btn{transition:none;}
}

@media(max-width:480px){
  .gr-header{flex-direction:column; align-items:flex-start;}
  .gr-carousel-outer{gap:8px;}
  .gr-arrow{width:40px; height:40px;}
}