/* ============================================================
   FCF — secțiunea „Ce spun clienții", pentru finecutfurniture.ro
   19.09.2026, modulul Site (Aplicație).

   Folosește variabilele care există deja în pagină:
   --cream #f6f2ec, --paper #fbf9f5, --charcoal #2b2825, --ink #161616,
   --gold #C8A24B, --gold2 #d9bd7d, --muted #8b8378, --line #e4ddd2.
   Fonturile sunt cele ale site-ului: Cormorant Garamond la titluri, Jost la text.
   ZERO ALBASTRU — nicio culoare rece în tot fișierul.
   ============================================================ */

#recenzii{ padding:clamp(48px,7vw,92px) 0; background:var(--paper,#fbf9f5) }
#recenzii .wrap{ max-width:1180px; margin:0 auto; padding:0 20px }

#recenzii .h{ text-align:center; margin-bottom:clamp(26px,3.6vw,44px) }
#recenzii .k{ font-family:'Jost',sans-serif; font-size:11px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold,#C8A24B); margin-bottom:10px }
#recenzii h2{ font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(27px,4.4vw,44px); font-weight:400; line-height:1.15;
  color:var(--charcoal,#2b2825); margin:0 }
#recenzii .sub{ font-family:'Jost',sans-serif; font-size:15px; color:var(--muted,#8b8378);
  margin:12px auto 0; max-width:560px; line-height:1.6 }

/* ---------- cartelele ---------- */
#recenzii .rec_grid{ display:grid; gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr)) }
#recenzii .rec{ background:#fff; border:1px solid var(--line,#e4ddd2); border-radius:14px;
  padding:22px 22px 18px; display:flex; flex-direction:column;
  transition:border-color .25s ease, transform .25s ease }
#recenzii .rec:hover{ border-color:var(--gold,#C8A24B); transform:translateY(-2px) }

#recenzii .stele{ color:var(--gold,#C8A24B); font-size:15px; letter-spacing:2px;
  line-height:1; margin-bottom:12px }
#recenzii .stele span{ color:var(--line,#e4ddd2) }

/* Textul NU se rescrie si nu se scurteaza - se STRANGE vizual la 9 randuri, iar
   legatura „pe Google" de dedesubt duce la recenzia intreaga. Altfel o recenzie de
   800 de caractere inalta tot randul de cartele si sectiunea arata strambă. */
#recenzii .txt{ font-family:'Jost',sans-serif; font-size:14.5px; line-height:1.68;
  color:#3d3831; margin:0 0 18px; flex:1;
  display:-webkit-box; -webkit-line-clamp:9; -webkit-box-orient:vertical;
  overflow:hidden }

/* Eticheta de traducere + comutatorul catre originalul in romana.
   Sta INTRE text si autor, ca sa se vada inainte sa citesti numele: ce e mai
   sus e traducerea noastra, nu cuvintele omului in limba aia. */
#recenzii .tradus{ font-family:'Jost',sans-serif; font-size:11.5px; color:var(--muted,#8b8378);
  margin:-8px 0 16px; line-height:1.5 }
#recenzii .comut{ font:inherit; font-size:11.5px; background:none; border:0; padding:0;
  color:var(--gold,#C8A24B); cursor:pointer; text-decoration:underline;
  text-underline-offset:2px }
#recenzii .comut:hover{ color:var(--gold2,#d9bd7d) }
#recenzii .txt.orig{ font-style:italic; color:#4a423b }
/* ⛔ Atributul `hidden` e display:none in foaia browserului, dar regula de mai sus
   (`display:-webkit-box`) e a autorului si o bate - deci originalul ramanea vizibil
   sub traducere. Prins la randare pe pagina germana, nu in cap. */
#recenzii .txt[hidden]{ display:none }

#recenzii .autor{ display:flex; align-items:center; gap:11px;
  border-top:1px solid var(--line,#e4ddd2); padding-top:14px }
#recenzii .poza{ flex:none; width:38px; height:38px; border-radius:50%;
  object-fit:cover; background:var(--cream,#f6f2ec) }
#recenzii .initiala{ flex:none; width:38px; height:38px; border-radius:50%;
  background:var(--charcoal,#2b2825); color:var(--gold,#C8A24B);
  display:flex; align-items:center; justify-content:center;
  font-family:'Cormorant Garamond',serif; font-size:19px }
#recenzii .cine{ min-width:0; flex:1 }
#recenzii .nume{ font-family:'Jost',sans-serif; font-size:14px; font-weight:500;
  color:var(--charcoal,#2b2825); white-space:nowrap; overflow:hidden;
  text-overflow:ellipsis }
#recenzii .cand{ font-family:'Jost',sans-serif; font-size:12px; color:var(--muted,#8b8378) }
#recenzii .vezi{ flex:none; font-family:'Jost',sans-serif; font-size:12px;
  color:var(--gold,#C8A24B); text-decoration:none; white-space:nowrap;
  border-bottom:1px solid transparent }
#recenzii .vezi:hover{ border-bottom-color:var(--gold,#C8A24B) }

/* ---------- bara de jos ---------- */
#recenzii .bara{ margin-top:clamp(24px,3.2vw,38px); background:var(--charcoal,#2b2825);
  border-radius:16px; padding:clamp(22px,3vw,30px);
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; flex-wrap:wrap }
#recenzii .nota{ display:flex; align-items:center; gap:14px; min-width:0 }
#recenzii .cifra{ font-family:'Cormorant Garamond',serif; font-size:42px; line-height:1;
  color:var(--gold2,#d9bd7d) }
#recenzii .nota .stele{ margin:0 0 4px }
#recenzii .cate{ font-family:'Jost',sans-serif; font-size:13px; color:#c9c0b2 }
#recenzii .fara_nota{ font-family:'Cormorant Garamond',serif; font-size:clamp(19px,2.6vw,25px);
  color:#f0e9dc; line-height:1.3; max-width:520px; font-weight:400 }
#recenzii .but{ display:flex; gap:11px; flex-wrap:wrap }
#recenzii .b{ font-family:'Jost',sans-serif; font-size:14px; text-decoration:none;
  padding:13px 22px; border-radius:10px; white-space:nowrap; line-height:1;
  display:inline-flex; align-items:center; justify-content:center; min-height:46px }
#recenzii .b1{ background:var(--gold,#C8A24B); color:var(--charcoal,#2b2825); font-weight:500 }
#recenzii .b1:hover{ background:var(--gold2,#d9bd7d) }
#recenzii .b2{ border:1px solid #57504a; color:#f0e9dc }
#recenzii .b2:hover{ border-color:var(--gold,#C8A24B); color:var(--gold2,#d9bd7d) }

/* Mențiunea cerută de Google când se afișează recenzii luate din Maps.
   Rămâne și când recenziile sunt scrise de noi după acordul clientului —
   nu strică nimic și spune cititorului de unde vin. */
#recenzii .mentiune{ font-family:'Jost',sans-serif; font-size:11.5px;
  color:var(--muted,#8b8378); text-align:center; margin-top:16px; line-height:1.6 }
#recenzii .mentiune a{ color:var(--muted,#8b8378) }

/* ---------- telefon ----------
   Regula lui Matei din 19.09: se verifică la 320, 360 ȘI 412 px, nimic nu iese
   din ecran, țintele de apăsat sunt destul de mari pentru deget. Butoanele trec
   pe toată lățimea, iar bara de jos se așază pe verticală. */
@media(max-width:700px){
  #recenzii{ padding:44px 0 }
  #recenzii .wrap{ padding:0 16px }
  #recenzii .rec_grid{ grid-template-columns:1fr; gap:14px }
  #recenzii .rec{ padding:18px }
  #recenzii .bara{ flex-direction:column; align-items:stretch; text-align:center;
    border-radius:14px }
  #recenzii .nota{ justify-content:center }
  #recenzii .but{ flex-direction:column }
  #recenzii .b{ width:100%; padding:15px 18px; min-height:50px }
  #recenzii .fara_nota{ text-align:center; margin:0 auto }
}
@media(max-width:360px){
  #recenzii .wrap{ padding:0 13px }
  #recenzii .rec{ padding:16px 15px }
  #recenzii .txt{ font-size:14px }
}