/* ============================================================
   Page Témoignages — d'après maquettes/temoignages.html
   Dépend de theme.css + destination.css (.trust, .related, .rtile,
   .stack, .cta-band, .sec-head, .btn, .eyebrow, .crumb sont globaux).
   ============================================================ */

@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}

/* ---- HERO COURT ---- */
.thero{position:relative;color:#fff;overflow:hidden;padding:clamp(140px,17vw,190px) 0 clamp(56px,7vw,86px)}
.thero .bg{position:absolute;inset:0;z-index:0}
.thero .bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
.thero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(120deg,rgba(11,40,42,.92) 0%,rgba(14,94,96,.78) 55%,rgba(11,40,42,.72) 100%)}
.thero .inner{position:relative;z-index:2}
.thero .eyebrow{color:#fff}
.thero h1{font-size:clamp(2.2rem,5vw,4rem);font-weight:800;max-width:18ch;margin:14px 0 14px;text-shadow:0 2px 26px rgba(0,0,0,.35)}
.thero h1 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--teal)}
.thero .sub{font-size:clamp(1.02rem,1.6vw,1.22rem);font-weight:300;opacity:.95;max-width:56ch;margin-bottom:30px}

.ratingbox{display:flex;align-items:center;gap:24px;flex-wrap:wrap;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(8px);border-radius:16px;padding:22px 28px;max-width:640px;margin-bottom:30px}
.ratingbox .score{font-family:var(--mont);font-weight:800;font-size:3.2rem;line-height:1;color:#fff}
.ratingbox .score span{font-size:1.2rem;font-weight:600;opacity:.7}
.ratingbox .rb-stars{color:var(--gold);font-size:1.15rem;letter-spacing:2px;margin-bottom:5px}
.ratingbox .rb-txt{font-family:var(--mont);font-size:.86rem;font-weight:500;opacity:.95;line-height:1.5}
.ratingbox .rb-txt p{margin:0}
.ratingbox .rb-txt b{font-weight:700}
.ratingbox .rb-div{width:1px;align-self:stretch;background:rgba(255,255,255,.22)}
.thero .cta-row{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.thero .eyebrow,.thero h1,.thero .sub,.thero .ratingbox,.thero .cta-row{opacity:0;animation:rise .9s var(--ease) forwards}
.thero .eyebrow{animation-delay:.12s}.thero h1{animation-delay:.24s}.thero .sub{animation-delay:.36s}.thero .ratingbox{animation-delay:.48s}.thero .cta-row{animation-delay:.6s}

/* ---- GRILLE AVIS ---- */
.reviews{padding:clamp(56px,7vw,84px) 0}
.reviews .sec-head{text-align:center;max-width:660px;margin:0 auto 46px}
.reviews .sec-head h2 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--teal-deep)}
.reviews .sec-head p{color:var(--ink-soft);margin-top:14px;font-size:1.06rem}

.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
/* .review-card + modale + lightbox : voir reviews.css (composant partagé). */

/* ---- Maillage : boutons sous la grille ---- */
.related-cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:34px}

/* ---- CTA (sur-titre lisible sur fond foncé) ---- */
.cta-band .eyebrow{color:#fff}

@media(max-width:980px){
  .rev-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .rev-grid{grid-template-columns:1fr}
}