/* FVWL – productpagina: de beschrijving boven de maten en de rij “Aanbevolen voor u” (fvwl-aanbevolen.php, 13 nov 2026).
   Gebruikt de variabelen van fvwl-design.css; de kaarten zelf krijgen hun stijl van het raster (fvwl-paginas.css, fvwl-collectie.css). */

/* ---------- beschrijving onder de prijs, boven de maten ---------- */
.fvwl-pp-desc{ margin:14px 0 26px; max-width:620px; font-family:var(--fvwl-sans,"Josefin Sans",sans-serif); font-weight:300; font-size:16px; line-height:1.7; color:var(--fvwl-anthracite,#3A3A3A); }
.fvwl-pp-desc p{ margin:0 0 10px !important; padding:0 !important; }
.fvwl-pp-desc p:last-child{ margin-bottom:0 !important; }
.fvwl-pp-desc ul{ margin:6px 0 0 !important; padding:0 0 0 18px !important; list-style:disc; }
.fvwl-pp-desc li{ margin:0 0 4px; }

/* ---------- Aanbevolen voor u ---------- */
.fvwl-ab{ --fvwl-ab-gap:36px; max-width:1320px; margin:0 auto; padding:72px 24px 88px; box-sizing:border-box; }
.fvwl-ab__title{ margin:0 0 44px !important; padding:0 !important; text-align:center; font-family:var(--fvwl-serif,"Cormorant Garamond",Georgia,serif) !important; font-weight:400 !important; font-size:clamp(30px,3.2vw,44px) !important; line-height:1.15 !important; letter-spacing:0 !important; text-transform:none !important; color:var(--fvwl-ink,#1F1F1F) !important; }
.fvwl-ab__wrap{ position:relative; }
.fvwl-ab__track{ list-style:none !important; margin:0 !important; padding:0 !important; display:flex; gap:var(--fvwl-ab-gap); overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scroll-behavior:smooth; -webkit-overflow-scrolling:touch; scrollbar-width:none; overscroll-behavior-x:contain; }
.fvwl-ab__track::-webkit-scrollbar{ display:none; }
.fvwl-ab__track:focus-visible{ outline:1px solid var(--fvwl-anthracite,#3A3A3A); outline-offset:6px; }
.fvwl-ab__track > li.fvwl-card{ flex:0 0 calc((100% - 3 * var(--fvwl-ab-gap)) / 4); min-width:0; margin:0 !important; padding:0 !important; scroll-snap-align:start; position:relative; list-style:none !important; }
.fvwl-ab .fvwl-card__name{ font-size:20px !important; }

/* label “Bestseller”: klein goud vlakje met donkere tekst (designsysteem) */
.fvwl-card__label{ position:absolute; left:10px; top:10px; z-index:2; padding:5px 9px 3px; background:var(--fvwl-gold,#CCA569); color:var(--fvwl-ink,#1F1F1F); font-family:var(--fvwl-sans,"Josefin Sans",sans-serif); font-weight:400; font-size:10px; line-height:1.3; letter-spacing:.18em; text-transform:uppercase; }
.fvwl-card__label + .fvwl-card__badge, .fvwl-card__img .fvwl-card__label ~ .fvwl-card__badge{ top:38px; }

/* pijltjes: dunne cirkel, half over de rand van de rij, ter hoogte van de foto */
.fvwl-ab__nav{ position:absolute; top:calc((100% - 96px) / 2); z-index:3; width:46px; height:46px; margin-top:-23px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--fvwl-anthracite,#3A3A3A); border-radius:50%; background:var(--fvwl-white,#fff); color:var(--fvwl-anthracite,#3A3A3A); cursor:pointer; transition:background .2s, color .2s, opacity .2s; }
.fvwl-ab__nav--prev{ left:-23px; }
.fvwl-ab__nav--prev svg{ transform:rotate(180deg); }
.fvwl-ab__nav--next{ right:-23px; }
.fvwl-ab__nav:hover:not(:disabled){ background:var(--fvwl-anthracite,#3A3A3A); color:#fff; }
.fvwl-ab__nav:disabled{ opacity:0; pointer-events:none; }
.fvwl-ab__nav:focus-visible{ outline:2px solid var(--fvwl-ink,#1F1F1F); outline-offset:2px; }

/* dunne voortgangslijn */
.fvwl-ab__bar{ position:relative; height:1px; margin:44px auto 0; max-width:520px; background:var(--fvwl-line,#E5E2DC); }
.fvwl-ab__bar-in{ position:absolute; left:0; top:-0.5px; height:2px; width:50%; background:var(--fvwl-anthracite,#3A3A3A); transform:translateX(0); transition:transform .15s linear; }
.fvwl-ab.is-static .fvwl-ab__bar{ display:none; }

@media (max-width:1100px){
  .fvwl-ab{ --fvwl-ab-gap:22px; padding:56px 20px 72px; }
  .fvwl-ab__track > li.fvwl-card{ flex-basis:calc((100% - 2 * var(--fvwl-ab-gap)) / 3); }
  .fvwl-ab__nav--prev{ left:-12px; } .fvwl-ab__nav--next{ right:-12px; }
}
@media (max-width:767px){
  .fvwl-ab{ --fvwl-ab-gap:12px; padding:44px 16px 56px; }
  .fvwl-ab__title{ margin-bottom:26px !important; }
  .fvwl-ab__track > li.fvwl-card{ flex-basis:calc((100% - var(--fvwl-ab-gap)) / 2); }
  .fvwl-ab .fvwl-card__name{ font-size:17px !important; }
  .fvwl-ab__nav{ width:40px; height:40px; margin-top:-20px; top:calc((100% - 110px) / 2); }
  .fvwl-ab__nav--prev{ left:-6px; } .fvwl-ab__nav--next{ right:-6px; }
  .fvwl-ab__bar{ margin-top:28px; max-width:220px; }
  .fvwl-pp-desc{ font-size:15px; margin:10px 0 22px; }
}
@media (prefers-reduced-motion:reduce){
  .fvwl-ab__track{ scroll-behavior:auto; }
}