/* container rezumat: stânga info, dreapta insigna */
.reviews-summary{
  display:flex;
  align-items:baseline;           /* baseline, nu centru pe verticală */
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin:10px 0 18px;
}

/* aliniere pe baseline, spații mai mici */
.score-wrap{
  display:flex;
  align-items:baseline;
  gap:10px;                       /* mai strâns */
  flex-wrap:wrap;
}

/* scorul mare are greutate vizuală, kerning OK */
.score-value{
  font-size:42px;
  font-weight:700;
  line-height:1;
  letter-spacing:.2px;
}

/* stelele în accent, ușor coborâte pe baseline (mai mici ca să nu sară în ochi) */
.score-stars{
  color:var(--accent);
  font-size:20px;                 /* 22 -> 20 pentru echilibru */
  letter-spacing:1px;
  transform:translateY(1px);
}

/* separator fin, nu o bătaie în cap */
.score-divider{
  width:14px;                     /* 18 -> 14, mai discret */
  height:1px;
  background:rgba(255,255,255,.12);
  display:inline-block;
  transform:translateY(-1px);
}

/* text secundar, dar citibil */
.score-label{
  color:var(--textSub);
  font-size:.98rem;
  letter-spacing:.1px;
}

/* insignă “Vezi pe Google” ca pilulă discretă, împinsă în dreapta */
.g-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:.45rem .75rem;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.03);
  color:#e9e9e9;
  font-size:.93rem;
  letter-spacing:.1px;
  text-decoration:none;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
  margin-left:auto;               /* lipește insigna de marginea dreaptă */
}
.g-badge:hover{
  background:rgba(210,164,74,.10);
  border-color:rgba(210,164,74,.35);
  color:#fff;
}

/* punct colorat subtil în badge (eco-înlocuitor de logo) */
.g-badge .g-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 2px rgba(210,164,74,.18) inset;
}

/* răspuns pe ecrane mici: badge-ul cade pe rând nou, centrat */
@media (max-width: 600px){
  .g-badge{
    width:100%;
    justify-content:center;
    margin-left:0;                /* nu mai împinge în dreapta pe mobil */
  }
}

	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	:root{
  --accent:#d2a44a;
  --card:#121416;
  --cardLine:rgba(255,255,255,.06);
  --textSub:rgba(255,255,255,.78);
}

.reviews-summary{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;margin:8px 0 18px 0;flex-wrap:wrap
}
.reviews-summary .score{display:flex;align-items:center;gap:14px}
.score-value{font-size:40px;font-weight:700;line-height:1}
.score-stars{color:var(--accent);letter-spacing:2px;font-size:20px}
.score-label{color:var(--textSub)}

.reviews-grid{
  display:grid;gap:16px;
  grid-template-columns:1fr;
}
@media(min-width:992px){ .reviews-grid{grid-template-columns:1fr 1fr;} }

.review-card{
  background:var(--card);
  border:1px solid var(--cardLine);
  border-radius:12px;
  padding:16px;
  transition:border-color .2s ease;
}
.review-card:hover{border-color:rgba(210,164,74,.35)}

.review-head{display:flex;gap:12px;align-items:center;margin-bottom:6px}
.review-head .avatar{
  width:40px;height:40px;border-radius:50%;
  background:rgba(210,164,74,.15);color:var(--accent);
  display:flex;align-items:center;justify-content:center;
  font-weight:700
}
.review-head .name{font-weight:600}
.review-head .stars{color:var(--accent);font-size:14px;letter-spacing:1px}

.review-text{margin:.25rem 0 .5rem 0;line-height:1.6}
.review-text.clamp{max-height:4.8em;overflow:hidden}
.review-text.is-open{max-height:none}

.review-foot{
  display:flex;gap:10px;align-items:center;justify-content:flex-start;
  color:var(--textSub);font-size:.92rem
}
.review-foot .source{border:1px solid var(--cardLine);padding:.2rem .5rem;border-radius:999px}
.review-foot .date{opacity:.85}
.review-foot .btn-plain{margin-left:auto}

.reviews-cta-bottom{display:flex;justify-content:center;margin:18px 0 6px}
.btn-ghost{border:1px solid var(--accent);color:var(--accent);padding:.55rem 1rem;border-radius:6px}
.btn-ghost:hover{background:rgba(210,164,74,.08)}

.btn.btn-accent{background:var(--accent);color:#151515;border:1px solid var(--accent);padding:.6rem 1rem;border-radius:6px}
.btn.btn-accent:hover{filter:brightness(.95)}
.btn-plain{background:transparent;border:none;color:var(--textSub);padding:.3rem .2rem}
.btn-plain:hover{color:#fff}
/* ritm la heading + rezumat */
.mcgill-heading{ margin-bottom: 8px; }
.reviews-summary{ margin: 6px 0 16px; }

/* grid consistent cu "Servicii" */
.reviews-grid{ gap: 18px; }
@media(min-width: 992px){
  .reviews-grid{ grid-template-columns: 1fr 1fr; }
}
.score-stars{
  font-size: 22px;
  letter-spacing: 1px;
  transform: translateY(1px);
}
.score-label{ font-size: .96rem; opacity: .9; }
.review-head .avatar{
  background: rgba(210,164,74,.18);
  box-shadow: inset 0 0 0 1px rgba(210,164,74,.25);
}
.review-foot{ gap: 10px; }
.review-foot .btn-plain{
  margin-left: auto;
  padding: .35rem .4rem;
}
.review-foot .btn-plain:after{
  content: ' ›';
  opacity: .8;
}
.review-text.clamp{ max-height: 5.8em; }
@media(min-width: 1200px){
  .review-text.clamp{ max-height: 6.4em; }
}
.review-card{
  transition: border-color .18s ease, transform .18s ease;
}
.review-card:hover{
  border-color: rgba(210,164,74,.32);
  transform: translateY(-1px);
}
.reviews-cta-bottom{ margin: 22px 0 14px; }
.reviews-cta-bottom .btn-ghost{
  width: 100%;
  max-width: 540px;
  text-align: center;
}
.btn-plain:focus, .btn-accent:focus{
  outline: 2px solid rgba(210,164,74,.55);
  outline-offset: 2px;
}
.review-foot .source{
  font-size: .85rem;
  background: rgba(255,255,255,.03);
}




/* ==== Reviews polish: drop-in overrides (append at end) ==== */
:root{
  --accentSoft: rgba(210,164,74,.16);
  --shadow: 0 2px 10px rgba(0,0,0,.25);
  --shadowHover: 0 6px 22px rgba(0,0,0,.35);
}

/* 1) Heading + rezumat: ritm mai curat */
.mcgill-heading{ margin-bottom: 10px; }
.reviews-summary{ margin: 8px 0 18px; }

/* aliniază scorul și stelele pe baseline, nu pe centrul X */
.reviews-summary .score{
  align-items: baseline;
  gap: 10px;
}
.score-value{ line-height: 1; }
.score-stars{
  font-size: 22px;         /* deja mărit, păstrăm */
  letter-spacing: 1px;
  transform: translateY(1px); /* baseline nudging */
}
.score-label{ font-size: .96rem; opacity: .9; }

/* 2) Grid consistent și aerisit */
.reviews-grid{ gap: 22px; }
@media(min-width: 992px){
  .reviews-grid{ grid-template-columns: 1fr 1fr; }
}

/* 3) Card premium: radius + shadow + hover subtil */
.review-card{
  border-radius: 14px;
  box-shadow: var(--shadow);
  transition: border-color .18s ease, transform .18s ease, box-shadow .25s ease;
}
.review-card:hover{
  border-color: rgba(210,164,74,.32);
  transform: translateY(-1px);
  box-shadow: var(--shadowHover);
}

/* 4) Avatar mai lizibil pe dark */
.review-head .avatar{
  width: 44px;
  height: 44px;
  background: var(--accentSoft);
  box-shadow: inset 0 0 0 1px rgba(210,164,74,.25);
  font-weight: 600;
  letter-spacing: .2px;
}

/* 5) Corp + meta: detalii mici de lizibilitate */
.review-text{ line-height: 1.6; }
.review-text.clamp{ max-height: 6.0em; }          /* ușor mai mult pentru 3-4 linii */
@media(min-width: 1200px){
  .review-text.clamp{ max-height: 6.6em; }
}
.review-foot{
  gap: 12px;
  color: var(--textSub);
}
.review-foot .source{
  font-size: .85rem;
  background: rgba(255,255,255,.03);
  border-radius: 999px;
  padding: .22rem .6rem;
}

/* 6) “Citește mai mult” cu hit-area + feedback */
.review-foot .btn-plain{
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: .45rem .6rem;      /* hit area mai mare */
  color: var(--textSub);
  border-radius: 8px;
  transition: background-color .15s ease, color .15s ease;
}
.review-foot .btn-plain:hover{
  color: #fff;
  background: var(--accentSoft);
}
/* animă săgeata adăugată de tine prin :after */
.review-foot .btn-plain:after{
  content: ' ›';
  opacity: .85;
  display: inline-block;
  transform: translateX(0);
  transition: transform .15s ease, opacity .15s ease;
}
.review-foot .btn-plain:hover:after{
  transform: translateX(2px);
  opacity: 1;
}

/* 7) CTA bar jos mai solid, centrat și cu max width */
.reviews-cta-bottom{
  display: flex;
  justify-content: center;
  margin: 24px 0 16px;
}
.reviews-cta-bottom .btn-ghost{
  width: 100%;
  max-width: 540px;
  text-align: center;
  border-radius: 12px;
  box-shadow: 0 4px 18px rgba(210,164,74,.18);
}

/* 8) A11y focus văzut bine pe linkuri/butoane */
.btn-plain:focus,
.btn-accent:focus,
.btn-ghost:focus{
  outline: 2px solid rgba(210,164,74,.55);
  outline-offset: 2px;
  border-radius: 8px;
}
/* card padding mai „aerisit” pe desktop */
@media (min-width: 992px){
  .review-card{ padding: 18px 22px; }
}

/* micro-contrast pentru text secundar */
.review-foot .date{ opacity: .92; }

/* chip „Google” un pic mai dens, ca să nu plutească */
.review-foot .source{
  padding: .2rem .55rem;
  line-height: 1;
  letter-spacing: .1px;
}

/* încarcă subtil titlul recenzentului */
.review-head .name{
  font-weight: 600;
  letter-spacing: .2px;
}

/* butonul mare din dreapta sus: stil aliniat cu tematica */
.btn-review-google{
  background: var(--accent);
  color: #151515;
  border: 1px solid var(--accent);
  padding: .6rem 1rem;
  border-radius: 10px;
  font-weight: 600;
  box-shadow: 0 4px 14px rgba(210,164,74,.18);
  transition: filter .15s ease, transform .12s ease;
}
.btn-review-google:hover{ filter: brightness(.96); transform: translateY(-1px); }
.btn-review-google:focus{
  outline: 2px solid rgba(210,164,74,.55);
  outline-offset: 2px;
}

/* spacing între carduri când ai o coloană pe mobil */
@media (max-width: 991.98px){
  .reviews-grid{ gap: 16px; }
}

/* respectă preferințele de reducere a mișcării */
@media (prefers-reduced-motion: reduce){
  .review-card,
  .review-card:hover,
  .btn-ghost,
  .btn-plain{ transition: none !important; }
}
@media (min-width: 992px){
  .review-card{ min-height: 210px; } /* ajustează după conținutul tău */
}









:root{
  --card: #121416;
  --accent: #d2a44a;
  --textSub: rgba(255,255,255,.78);
}

/* Cardul ține conținutul într-o coloană, ca să putem împinge footer-ul jos */
.review-card{
  display: flex;
  flex-direction: column;
}

/* --- TEXT --- */
.review-text{
  position: relative;
  line-height: 1.6;
  hyphens: auto;
  overflow-wrap: anywhere;
  text-wrap: pretty;
  transition: max-height .25s ease, opacity .2s ease;
}

/* Stare închisă: clamp pe N linii + mask scurt (nu mușcă ultimul rând) */
.review-text.clamp{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;               /* mobil/tablet */
  overflow: hidden;
  padding-bottom: .35rem;               /* puțin aer peste fade */

  -webkit-mask-image: linear-gradient(180deg, #000 90%, rgba(0,0,0,0) 100%);
  mask-image:         linear-gradient(180deg, #000 90%, rgba(0,0,0,0) 100%);
}

/* pe desktop arătăm o linie în plus */
@media (min-width: 1200px){
  .review-text.clamp{ -webkit-line-clamp: 5; }
}

/* Stare deschisă: fără clamp/mask, scroll în card */
.review-text.expanded{
  -webkit-line-clamp: unset;
  -webkit-mask-image: none;
  mask-image: none;

  max-height: 22rem;        /* ajustează după gust */
  overflow: auto;
  padding-right: .5rem;     /* spațiu pentru scrollbar */
}
@media (max-width: 600px){
  .review-text.expanded{ max-height: 16rem; }
}

/* Scrollbar discret */
.review-text.expanded::-webkit-scrollbar{ width: 8px; }
.review-text.expanded::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.18);
  border-radius: 8px;
}
.review-text.expanded::-webkit-scrollbar-thumb:hover{
  background: rgba(255,255,255,.28);
}

/* --- FOOTER & ACȚIUNI --- */
.review-foot{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 10px;         /* separă textul de acțiuni */
}

/* tot ce înseamnă acțiuni se lipește în dreapta jos */
.review-actions{
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 14px;
}

/* separator subțire între butoane (opțional) */
.review-actions .divider{
  width:16px;
  height:1px;
  background: rgba(255,255,255,.12);
  transform: translateY(-2px);
}

/* butoanele simple */
.btn-plain{
  border-radius: 8px;
  padding: .45rem .6rem;
  color: var(--textSub);
  background: transparent;
  border: none;
  cursor: pointer;
}
.btn-plain:hover{ background: rgba(210,164,74,.10); color: #fff; }
.btn-plain:focus{ outline: 2px solid rgba(210,164,74,.55); outline-offset: 2px; }

/* hint săgeată pe “Citește mai mult” */
.readmore::after{
  content: ' ›';
  opacity: .85;
  display: inline-block;
  transform: translateX(0);
  transition: transform .15s ease, opacity .15s ease;
}
.readmore:hover::after{ transform: translateX(2px); opacity: 1; }

/* ascunde butonul/dividerul când nu e text de extins */
.readmore.is-hidden { display: none; }
.review-actions .divider.is-hidden { display: none; }




/* fără fade în mod implicit */
.review-text.clamp::after { content: none; }

/* fade activ doar când JS pune .has-overflow */
.review-text.has-overflow.clamp {
  position: relative;
  padding-bottom: .45rem;          /* puțin aer peste fade */
  -webkit-mask-image: linear-gradient(180deg,#000 86%,rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(180deg,#000 86%,rgba(0,0,0,0) 100%);
}

/* când e deschis: zero fade, scroll în card */
.review-text.expanded {
  -webkit-mask-image: none;
          mask-image: none;
}





/* reset: implicit fără fade/mask în starea închisă */
.review-card .review-text.clamp {
  -webkit-mask-image: none;
          mask-image: none;
  position: relative;
  padding-bottom: .35rem;
}

/* fade doar dacă JS pune .has-overflow */
.review-card .review-text.clamp.has-overflow {
  -webkit-mask-image: linear-gradient(180deg, #000 86%, rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(180deg, #000 86%, rgba(0,0,0,0) 100%);
}

/* când e deschis: zero fade, scroll în card */
.review-card .review-text.expanded {
  -webkit-mask-image: none;
          mask-image: none;
  max-height: 22rem;
  overflow: auto;
  padding-right: .5rem;
}

/* desktop: 5 linii închis, mobil: 4 (presupunând că ai deja clamp setat) */
@media (min-width: 1200px){
  .review-card .review-text.clamp { /* doar informativ aici, e setat în CSS-ul tău */ }
}

/* anti-flicker în timpul măsurătorilor */
.review-card .review-text.no-transition { transition: none !important; }

/* ascunde controlul când nu e nevoie */
.readmore.is-hidden{ display: none !important; }
.review-actions .divider.is-hidden{ display: none !important; }

/* fade doar când textul e clamped ȘI chiar are overflow */
.review-text.clamp.show-fade{
  -webkit-mask-image: linear-gradient(180deg, #000 86%, rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(180deg, #000 86%, rgba(0,0,0,0) 100%);
}








/* Fade doar când există overflow: aplicăm DOAR pe .clamp + .show-fade
   (show-fade o setăm deja din JS-ul tău când detectăm overflow) */
.review-text.clamp.show-fade{
  position: relative;
  /* mască “soft” ca să nu taie agresiv baseline-ul */
  -webkit-mask-image: linear-gradient(
    to bottom,
    rgba(0,0,0,1) 86%,      /* partea de sus 100% vizibilă */
    rgba(0,0,0,.65) 94%,    /* trecere */
    rgba(0,0,0,0) 100%      /* jos semi-ascuns */
  );
          mask-image: linear-gradient(
    to bottom,
    rgba(0,0,0,1) 86%,
    rgba(0,0,0,.65) 94%,
    rgba(0,0,0,0) 100%
  );
}

/* Fallback universal: strat peste ultimul ~1.5 rânduri.
   Îl folosim împreună cu masca (combinația arată cel mai bine în toate browserele). */
.review-text.clamp.show-fade::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1.6em;                   /* “jumătatea de jos” a ultimei linii + puțin */
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(18,20,22,0) 0%,
    rgba(18,20,22,.75) 85%,
    rgba(18,20,22,.92) 100%
  );
}

/* Când se deschide, scoatem orice fade */
.review-text.expanded{
  -webkit-mask-image: none;
          mask-image: none;
}
.review-text.expanded::after{ content: none !important; }





/* animație pe ambele sensuri */
.review-text { transition: max-height .28s ease; }

/* dezactivăm tranziția temporar când măsurăm */
.review-text.rt-noanim { transition: none !important; }

/* în timp ce colapsăm, ascundem scrollerul ca să nu pâlpâie */
.review-text.rt-collapsing { overflow: hidden !important; }
/* fără scrollbar în timpul animării la deschidere */
.review-text.rt-expanding { overflow: hidden !important; }

/* Card = coloană; footer jos mereu */
.review-card{
  display: flex;
  flex-direction: column;
  /* păstrează ce padding/borți aveai deja */
}

/* spațierea internă între secțiuni, fără să mai folosim margin bottom random */
.review-card > .review-head{ margin-bottom: 6px; }
.review-card > .review-text{ margin: 0; }

/* ăsta face toată treaba: împinge footerul la bază */
.review-card > .review-foot{
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* dacă ai acțiunile în dreapta, lasă-le să împingă corect */
.review-foot .review-actions{ margin-left: auto; display: flex; align-items: center; gap: 14px; }

/* grid-ul deja întinde itemii pe înălțimea rândului; dar dacă ai futut setarea, fixează-o */
.reviews-grid{ align-items: stretch; }

.review-text{
  margin: 0;
  transition: max-height .24s ease;
}
.date-label{
  color: var(--textSub);
  font-size: 0.94rem;
  letter-spacing: .2px;
  font-variant-numeric: tabular-nums;
  /* alege una din liniile de mai jos, nu ambele */
  text-transform: capitalize;   /* pt "August 2023" 
  /* text-transform: uppercase;    /* pt "AUG 2023"    */
  opacity: .95;
}
.chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:.22rem .6rem; border-radius:999px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--cardLine);
  color:#e9e9e9; font-size:.9rem; letter-spacing:.1px;
  white-space:nowrap;
  cursor: default;
}
.chip-sep{ opacity:.8; transform:translateY(-.5px); }
.chip-year{ font-variant-numeric: tabular-nums; }
.chip:hover{ background:rgba(210,164,74,.08); border-color:rgba(210,164,74,.35); }
.chip:focus{ outline:2px solid rgba(210,164,74,.55); outline-offset:2px; }

.review-card > .review-head,
.review-card > .review-text,
.review-card > .review-foot{
	padding-left: 10px;
	padding-right: 10px;
}


@media (max-width: 768px){
  /* spațiu lateral sănătos în zona de Reviews (respectă și safe-area pe iOS) */
  .mcgill-about.customers .container-fluid{
    padding-left: max(18px, env(safe-area-inset-left));
    padding-right: max(18px, env(safe-area-inset-right));
  }
  .reviews-grid{ gap: 16px; }
  .review-card{
    border-radius: 14px;
    padding: 14px 14px 12px;
    width: 100%;
    box-sizing: border-box;
  }
}

@media (max-width: 480px){
  .mcgill-about.customers .container-fluid{
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
  }
  .reviews-grid{ gap: 14px; }


  .review-text{ line-height: 1.55; }

 
  .review-foot{
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
  }
  .review-actions{
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .review-actions .btn-plain{
    padding: .45rem .65rem;
    font-size: .95rem;
    border-radius: 8px;
  }

  .readmore{
    padding: .48rem .7rem;
    white-space: nowrap;
  }
}


@media (max-width: 360px){
  .mcgill-about.customers .container-fluid{
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
  }
}