/* === Car Hire Reviews — Lean CSS === */
:root{
  --chr-max:1200px;
  --chr-gap:1.25rem;
  --chr-text:#0f172a;
  --chr-muted:#6b7280;
  --chr-border:#eef0f3;
  --chr-shadow:0 8px 24px rgba(0,0,0,.08);
  --chr-shadow-lg:0 18px 36px rgba(0,0,0,.12);
  --chr-top:rgba(46,204,113,.32);    /* green glow */
  --chr-low:rgba(230,126,34,.30);    /* orange glow */
  --chr-star:#f59e0b;
}

/* Headings (minimal) */
.chr-section-title{ text-align:center; font:800 2.2rem/1.15 system-ui; margin:2.25rem 0 .25rem; color:var(--chr-text); }
.chr-section-sub{ text-align:center; color:var(--chr-muted); margin-bottom:1.5rem; }
.chr-icon-title{ display:inline-flex; align-items:center; gap:.5rem; }

/* ---------- Highlights (Top & Lowest) ---------- */
.chr-highlights{
  display:flex; justify-content:center; align-items:flex-start;
  gap:48px; max-width:var(--chr-max); margin:0 auto 2.4rem; padding:0 12px;
}
.chr-highlights>.chr-column{ flex:0 1 520px; max-width:520px; }
@media (max-width:980px){ .chr-highlights{ flex-direction:column; gap:28px; } .chr-highlights>.chr-column{ max-width:640px; } }

/* Card */
.chr-row-card{
  background:#fff; border-radius:16px; margin:.9rem 0; position:relative; overflow:hidden;
  transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s ease, filter .35s ease;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}
.chr-column.top .chr-row-card{ filter:drop-shadow(0 14px 26px var(--chr-top)) drop-shadow(0 2px 8px rgba(46,204,113,.15)); }
.chr-column.lowest .chr-row-card{ filter:drop-shadow(0 14px 26px var(--chr-low)) drop-shadow(0 2px 8px rgba(230,126,34,.14)); }
.chr-row-card:hover{ transform:translateY(-4px); }

/* Card layout */
.chr-row-card__link{ display:grid; grid-template-columns:1fr 72px; color:inherit; text-decoration:none; }
.chr-row-card__main{ display:grid; grid-template-columns:110px 1fr; gap:16px; padding:16px 18px; align-items:center; }
.chr-row-card.has-logo  .chr-row-card__main{ grid-template-columns:110px 1fr; }
.chr-row-card.no-logo   .chr-row-card__main{ grid-template-columns:1fr; }

.chr-row-card__logo{
  width:102px; height:64px; object-fit:contain; background:#fff; border-radius:12px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);
}
.chr-row-card__title{ font:800 1.06rem/1.2 system-ui; margin:0 0 4px; }
.chr-row-card__rating{ display:inline-flex; align-items:center; gap:8px; font-size:.98rem; color:#111827; }
.chr-row-card__reviews{ color:var(--chr-muted); font-size:.92rem; white-space:nowrap; }

/* Right CTA band */
.chr-row-card__cta{
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.78));
  box-shadow:inset 12px 0 20px rgba(0,0,0,.06);
  border-left:1px solid rgba(0,0,0,.06);
}
.chr-row-card__arrow{ display:flex; align-items:center; justify-content:center; height:100%; color:#111827; transition:transform .25s ease; }
.chr-row-card:hover .chr-row-card__arrow{ transform:translateX(6px); }

/* ---------- Shared stars ---------- */
.chr-stars{ display:inline-flex; gap:2px; vertical-align:middle; }
.chr-stars svg{ width:18px; height:18px; }
.chr-grid-stars .chr-stars svg{ width:20px; height:20px; }

/* ---------- League (All Companies Grid) ---------- */
.chr-sortbar{
  display:flex;
  align-items:center;
  justify-content:center;   /* center horizontally */
  gap:.75rem;
  margin:1.5rem auto 1.5rem;
  max-width:var(--chr-max);
  text-align:center;
}
.chr-sortbar label{ font-weight:600; color:#374151; }
.chr-sort-select{ padding:.45rem .7rem; border:1px solid #e5e7eb; border-radius:10px; background:#fff; font-weight:600; }

.chr-league{ max-width:var(--chr-max); margin:0 auto 3rem; padding:0 12px; }
.chr-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:var(--chr-gap); }

.chr-grid-card{
  background:#fff; border-radius:20px; text-align:center; padding:1rem 1rem 0;
  box-shadow:var(--chr-shadow); transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s;
  overflow:hidden;
}
.chr-grid-card:hover{ transform:translateY(-6px); box-shadow:var(--chr-shadow-lg); }
.chr-grid-card img{ display:block; margin:.1rem auto .4rem; }
.chr-brand-title{ font:800 1.1rem/1.2 system-ui; margin:.25rem 0 .5rem; color:var(--chr-text); }

.chr-grid-meta{
  margin:.35rem 0 .75rem; color:var(--chr-muted); font-weight:600;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.chr-grid-see{
  display:block; text-align:center; padding:.7rem 0 .9rem; margin:0 -1rem 0;
  border-top:1px solid var(--chr-border); background:linear-gradient(180deg,#fff,#fafbfc);
  font-weight:800; color:#1e293b !important; text-decoration:none !important;
}
.chr-grid-see svg{ margin-left:4px; transition:transform .3s ease; }
.chr-grid-card:hover .chr-grid-see svg{ transform:translateX(4px); }

/* ---------- Company detail (light) ---------- */
.chr-company-reviews .chr-agg{ margin-bottom:.75rem; }
.chr-hist{ margin:8px 0 16px; }
.chr-bar{ display:flex; align-items:center; gap:8px; margin:4px 0; }
.chr-bar span:first-child{ width:32px; }
.chr-bar-fill{ display:inline-block; height:8px; background:#f5a623; border-radius:8px; min-width:4px; }
.chr-review-list{ list-style:none; padding:0; margin:0; }
.chr-review-list li{ border-top:1px solid #eee; padding:10px 0; }
.chr-byline{ color:var(--chr-muted); }

/* optional shine */
@keyframes chrShine{ 0%{background-position:-100% 0;} 100%{background-position:200% 0;} }
.chr-grid-card::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 60%);
  opacity:0; transition:opacity .3s;
}
.chr-grid-card:hover::before{ opacity:1; animation:chrShine 2.5s linear infinite; }


