/* Flore Lumière reviews: animated testimonial columns (naar 21st.dev "Testimonials Columns", vanilla CSS) */
.flore-reviews { --fr-tan: #ab9685; --fr-ink: #292929; --fr-muted: #746154; --fr-line: #e9e0d8; --fr-card: #fff; --fr-gap: 24px;
  color: var(--fr-ink); font-family: var(--font-body-family, Montserrat, system-ui, sans-serif); max-width: 80rem; margin: 5rem auto; padding: 0 2rem; }

/* kop */
.flore-rev-head { display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 720px; margin: 0 auto; }
.flore-rev-badge { display: inline-block; border: 1px solid var(--fr-tan); color: var(--fr-muted); border-radius: 999px; padding: .35rem 1.1rem; font-size: 1.2rem; letter-spacing: .14em; text-transform: uppercase; }
.flore-rev-heading, .flore-review-heading { font-family: var(--font-heading-family, inherit); font-size: clamp(2.6rem, 4vw, 4.4rem); line-height: 1.1; letter-spacing: -.02em; margin: 1.6rem 0 0; font-weight: 600; }
.flore-rev-sub { margin: 1.4rem 0 0; opacity: .75; font-size: 1.5rem; line-height: 1.6; }
.flore-review-summary, .flore-rev-summary { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .8rem 1.2rem; margin: 2.4rem 0 0; font-size: 1.5rem; }
.flore-rev-score { font-weight: 600; }
.flore-rev-count { opacity: .7; }
.flore-review-stars { display: inline-block; font-size: 1.6rem; letter-spacing: .08em; line-height: 1; background: linear-gradient(90deg, #ba9361 var(--rating), #ddd6cf var(--rating)); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* kolommen met vervagende boven- en onderrand */
.flore-rev-stage { margin-top: 3rem; }
.flore-rev-cols { display: flex; justify-content: center; gap: var(--fr-gap); max-height: 740px; overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 78%, transparent); mask-image: linear-gradient(to bottom, transparent, #000 22%, #000 78%, transparent); }
.flore-rev-col { flex: 0 1 360px; min-width: 0; }
.flore-rev-col--md { display: none; }
.flore-rev-col--lg { display: none; }
@media (min-width: 750px) { .flore-rev-col--md { display: block; } }
@media (min-width: 1100px) { .flore-rev-col--lg { display: block; } }
.flore-rev-track { display: flex; flex-direction: column; animation: flore-rev-scroll var(--flore-rev-dur, 44s) linear infinite; will-change: transform; }
.flore-rev-set { display: flex; flex-direction: column; gap: var(--fr-gap); padding-bottom: var(--fr-gap); }
@keyframes flore-rev-scroll { to { transform: translateY(-50%); } }
.flore-rev-cols:hover .flore-rev-track, .flore-rev-cols:focus-within .flore-rev-track { animation-play-state: paused; }

/* kaart */
.flore-rev-card { background: var(--fr-card); border: 1px solid var(--fr-line); border-radius: 24px; padding: 2.4rem 2.4rem 2rem; box-shadow: 0 12px 32px rgba(171, 150, 133, .14); display: flex; flex-direction: column; gap: 1.2rem; }
.flore-rev-video { background: #000; }
.flore-rev-howto { text-align: center; max-width: 72rem; margin: 2.4rem auto 0; font-size: 1.3rem; line-height: 1.6; opacity: .7; }
.flore-rev-photo { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; background: #f1ebe5; }
.flore-rev-title { margin: 0; font-size: 1.6rem; font-weight: 600; line-height: 1.3; }
.flore-rev-text { margin: 0; font-size: 1.5rem; line-height: 1.65; }
.flore-rev-foot { display: flex; align-items: center; gap: 1.2rem; margin-top: .4rem; }
.flore-rev-avatar { flex: none; width: 4rem; height: 4rem; border-radius: 50%; background: #efe7df; color: var(--fr-muted); display: grid; place-items: center; font-weight: 600; font-size: 1.3rem; letter-spacing: .04em; }
.flore-rev-who { display: flex; flex-direction: column; min-width: 0; }
.flore-rev-name { font-weight: 600; font-size: 1.4rem; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flore-rev-role { opacity: .6; font-size: 1.2rem; line-height: 1.4; }

/* alle reviews (ingeklapt) + formulier */
.flore-rev-all { margin: 3rem auto 0; max-width: 72rem; border: 1px solid var(--fr-line); border-radius: 20px; background: #fff; }
.flore-rev-all > summary { cursor: pointer; padding: 1.6rem 2.2rem; font-weight: 600; font-size: 1.5rem; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.flore-rev-all > summary::-webkit-details-marker { display: none; }
.flore-rev-all > summary::after { content: "+"; font-size: 2.2rem; line-height: 1; color: var(--fr-tan); }
.flore-rev-all[open] > summary::after { content: "–"; }
.flore-rev-list { padding: 0 2.2rem 1rem; }
.flore-review-item { border-top: 1px solid var(--fr-line); padding: 1.8rem 0; font-size: 1.5rem; line-height: 1.6; }
.flore-review-item h3 { margin: .6rem 0; font-size: 1.6rem; }
.flore-review-item p { margin: .5rem 0; }
.flore-review-byline { opacity: .7; font-size: 1.3rem; }
.flore-review-reply { background: #f7f2ed; padding: 1rem 1.2rem; border-radius: 12px; }
.flore-review-image { max-width: 10rem; max-height: 10rem; object-fit: cover; margin-right: .5rem; border-radius: 10px; }
.flore-rev-more { margin: 0 2.2rem 2rem; font: inherit; padding: .9rem 1.8rem; border: 1px solid var(--fr-tan); border-radius: 999px; background: transparent; color: inherit; cursor: pointer; }
.flore-rev-more:disabled { opacity: .5; cursor: wait; }
.flore-review-message { text-align: center; min-height: 1.5em; margin: 1.6rem 0 0; }
.flore-review-form { display: grid; gap: 1.2rem; max-width: 72rem; margin: 3rem auto 0; padding: 2.4rem; border: 1px solid var(--fr-line); border-radius: 20px; background: #fff; }
.flore-review-form h3 { margin: 0; font-size: 1.8rem; }
.flore-review-form label { display: grid; gap: .4rem; font-size: 1.4rem; }
.flore-review-form input, .flore-review-form select, .flore-review-form textarea { font: inherit; padding: .9rem 1.1rem; border: 1px solid #cdbfb3; border-radius: 12px; background: #fff; color: inherit; }
.flore-review-form textarea { min-height: 8rem; }
.flore-review-form button { justify-self: start; font: inherit; font-weight: 600; padding: 1rem 2.2rem; border: 0; border-radius: 999px; background: var(--fr-tan); color: #fff; cursor: pointer; }
.flore-review-form button:disabled { opacity: .5; cursor: wait; }
.flore-review-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* mobiel: één kolom, lagere hoogte */
@media (max-width: 749px) {
  .flore-reviews { margin: 3.5rem auto; padding: 0 1.6rem; }
  .flore-rev-cols { max-height: 560px; }
  .flore-rev-col { flex-basis: 100%; }
  .flore-rev-card { padding: 2rem; }
}

/* minder beweging: geen animatie, gewone scrollbare rij zonder dubbele set */
@media (prefers-reduced-motion: reduce) {
  .flore-rev-track { animation: none; }
  .flore-rev-set[aria-hidden="true"] { display: none; }
  .flore-rev-cols { max-height: 640px; overflow-y: auto; -webkit-mask-image: none; mask-image: none; }
}
