/* =====================================================================
   FVWL — collectiepagina's (Geurkaarsen, elke collectie, elke stijlfamilie) — versie 3 (12 nov 2026)
   Niveau Baobab/Onno binnen het designsysteem: licht, goud alleen als accent.
   1. kop over de volle breedte · 2. korte intro, chips · 3. plakkende balk · 4. raster van drie · 5. brede sfeertegels
   6. afsluiter · 7. beweging · 8. filterpaneel · 9. mobiel
   Gebruikt de variabelen van het designsysteem (fvwl-design.css).
   ===================================================================== */

/* ---------- 1. De kop ---------- */
.fvwl-chead{ margin:0 0 30px; padding:0; text-align:center; font-family:var(--fvwl-sans); font-weight:300; color:var(--fvwl-anthracite); }
.fvwl-chead__media{ position:relative; overflow:hidden; background:var(--fvwl-stone); aspect-ratio:21/9; }
/* volle breedte: de kop breekt uit de container (de breedte van de schuifbalk telt niet mee: --fvwl-sbw, gezet door het script) */
.fvwl-chead--bleed .fvwl-chead__media{ width:calc(100vw - var(--fvwl-sbw, 0px)); margin-left:calc(50% - (100vw - var(--fvwl-sbw, 0px)) / 2); aspect-ratio:auto; height:clamp(440px, 42vw, 720px); max-height:76vh; }
.fvwl-chead__img{ position:absolute; inset:0; width:100% !important; height:100% !important; max-width:none !important; object-fit:cover; object-position:50% 50%; display:block; }
.fvwl-chead__media picture{ display:contents; }
/* donker verloop onderaan + links onderaan iets sterker, waar label en titel staan (leesbaar ook op lichte banners: Glossy, Marble) */
.fvwl-chead__media::after{ content:""; position:absolute; inset:0; background:
  radial-gradient(ellipse 60% 55% at 12% 100%, rgba(20,18,16,.42) 0%, rgba(20,18,16,0) 100%),
  linear-gradient(to top, rgba(20,18,16,.62) 0%, rgba(20,18,16,.2) 40%, rgba(20,18,16,0) 64%); pointer-events:none; }
.fvwl-chead__over{ position:absolute; left:0; right:0; bottom:48px; z-index:1; max-width:var(--fvwl-container, 1320px); margin:0 auto; padding:0 var(--fvwl-gutter, 32px); text-align:left; }
.fvwl-chead__plain{ padding:34px 0 0; }
.fvwl-chead__eyebrow{ margin:0 0 12px !important; padding:0 !important; font-family:var(--fvwl-sans); font-weight:400; font-size:var(--fvwl-fs-label, 12px); letter-spacing:.26em; text-transform:uppercase; line-height:1.4; color:var(--fvwl-anthracite); }
/* label op de banner: wit met een dunne gouden lijn ervoor (goud als accent); goud als tekst was onleesbaar op lichte foto's */
.fvwl-chead__over .fvwl-chead__eyebrow{ color:#fff; text-shadow:0 1px 12px rgba(20,18,16,.35); }
.fvwl-chead__over .fvwl-chead__eyebrow::before{ content:""; display:inline-block; width:28px; height:1px; margin:0 12px 0 0; background:var(--fvwl-gold); vertical-align:middle; }
.fvwl-chead__over .fvwl-chead__title{ text-shadow:0 2px 24px rgba(20,18,16,.25); }
.fvwl-chead .fvwl-chead__title{ margin:0 !important; padding:0 !important; font-family:var(--fvwl-serif) !important; font-weight:400 !important; font-size:clamp(44px, 5.4vw, 84px) !important; line-height:1.02 !important; letter-spacing:.005em !important; text-transform:none !important; color:var(--fvwl-ink) !important; }
.fvwl-chead__over .fvwl-chead__title{ color:#fff !important; }
.fvwl-chead__body{ max-width:780px; margin:0 auto; padding:38px 0 0; }
/* de korte intro: twee à drie zinnen, cursief, ruim */
.fvwl-chead__lead{ margin:0 auto 16px !important; padding:0 !important; max-width:720px; font-family:var(--fvwl-serif); font-style:italic; font-weight:400; font-size:24px; line-height:1.45; color:var(--fvwl-ink); }
.fvwl-chead .fvwl-notes--head{ display:block; margin:0 0 4px; }
/* de langere, bestaande tekst: drie regels, of (met een korte intro) helemaal achter “Lees meer” */
.fvwl-chead__intro{ position:relative; margin-top:8px; }
.fvwl-chead__intro-in{ font-family:var(--fvwl-serif); font-style:italic; font-weight:400; font-size:20px; line-height:1.55; color:var(--fvwl-anthracite); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; line-clamp:3; overflow:hidden; overflow-wrap:break-word; }
.fvwl-chead__intro--folded .fvwl-chead__intro-in{ display:none; font-family:var(--fvwl-sans); font-style:normal; font-weight:300; font-size:16px; line-height:1.75; text-align:left; }
.fvwl-chead__intro-in p, .fvwl-chead__intro-in li{ margin:0 0 .7em !important; padding:0 !important; font:inherit !important; color:inherit !important; }
.fvwl-chead__intro-in ul, .fvwl-chead__intro-in ol{ margin:0 0 .7em !important; padding:0 !important; list-style:none !important; }
.fvwl-chead__intro-in a{ color:var(--fvwl-ink); text-decoration:underline; text-decoration-color:var(--fvwl-gold); text-underline-offset:3px; }
.fvwl-chead__intro.is-open .fvwl-chead__intro-in{ display:block; -webkit-line-clamp:unset; line-clamp:unset; overflow:visible; padding-top:12px; }
.fvwl-chead__intro.has-more{ padding-bottom:36px; }
.fvwl-chead__intro--folded.has-more{ padding-bottom:30px; }
.fvwl-col-intro__more{ position:absolute; left:50%; bottom:4px; transform:translateX(-50%); margin:0; padding:0 0 3px; background:none; border:0; border-bottom:1px solid var(--fvwl-gold); cursor:pointer;
  font-family:var(--fvwl-sans); font-weight:400; font-size:var(--fvwl-fs-label, 12px); letter-spacing:var(--fvwl-ls-label, .2em); text-transform:uppercase; color:var(--fvwl-ink); white-space:nowrap; }
.fvwl-col-intro__more:hover{ border-bottom-color:var(--fvwl-ink); }
/* de oude kop uit het Divi-sjabloon van de collectie wordt niet meer getoond (de plugin laat hem weg; dit is het vangnet) */
body.fvwl-col.tax-product_cat .et_pb_section_0_tb_body{ display:none !important; }

/* variant B: tekst links op gebroken wit, beeld rechts (?fvwl_chead=b) */
.fvwl-chead--split{ display:grid; grid-template-columns:minmax(0,42fr) minmax(0,58fr); align-items:stretch; text-align:left; background:var(--fvwl-paper);
  width:calc(100vw - var(--fvwl-sbw, 0px)); margin-left:calc(50% - (100vw - var(--fvwl-sbw, 0px)) / 2); margin-bottom:36px; }
.fvwl-chead__split-txt{ display:flex; flex-direction:column; justify-content:center; padding:64px max(48px, calc((100vw - var(--fvwl-container, 1320px)) / 2 + 32px)) 56px; padding-right:56px; }
.fvwl-chead--split .fvwl-chead__lead{ margin:22px 0 14px !important; font-size:23px; }
.fvwl-chead--split .fvwl-chead__intro-in, .fvwl-chead--split .fvwl-chead__intro--folded .fvwl-chead__intro-in{ text-align:left; }
.fvwl-chead--split .fvwl-col-intro__more{ left:0; transform:none; }
.fvwl-chead--split .fvwl-chips__list{ justify-content:flex-start; }
.fvwl-chead__split-media{ position:relative; min-height:clamp(460px, 40vw, 680px); overflow:hidden; background:var(--fvwl-stone); }
.fvwl-chead__split-media picture{ display:contents; }

/* ---------- 2. Keuzechips per stijlfamilie ---------- */
.fvwl-chips{ margin:26px 0 0; }
.fvwl-chips__list{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px 10px; margin:0 !important; padding:0 !important; list-style:none !important; }
.fvwl-chips__list li{ margin:0 !important; padding:0 !important; list-style:none !important; }
.fvwl-chip{ display:inline-flex; align-items:center; min-height:40px; padding:3px 18px 0; border:1px solid var(--fvwl-line-strong, #C8C4BC); background:transparent; font-family:var(--fvwl-sans); font-weight:400; font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--fvwl-anthracite) !important; text-decoration:none !important; white-space:nowrap; transition:border-color var(--fvwl-ease, .2s ease), background-color var(--fvwl-ease, .2s ease); }
.fvwl-chip:hover{ border-color:var(--fvwl-anthracite); }
/* actief: goud vlakje met donkere tekst (designsysteem: de actieve filterchip) */
.fvwl-chip.is-active{ background:var(--fvwl-gold); border-color:var(--fvwl-gold); color:var(--fvwl-ink) !important; }

/* ---------- 3. De sectie met de lijst en de plakkende balk ---------- */
body.fvwl-col .et_pb_section:has(.et_pb_shop){ background:var(--fvwl-white) !important; padding:0 0 88px !important; }
body.fvwl-col .et_pb_row:has(.et_pb_shop){ display:block !important; width:auto !important; max-width:var(--fvwl-container) !important; margin:0 auto !important; padding:0 var(--fvwl-gutter) !important; }
body.fvwl-col .et_pb_column:has(.et_pb_shop){ float:none !important; width:100% !important; margin:0 !important; padding:0 !important; }
/* flow-root: de marges van wat in de (lege) filterkolom zit, blijven binnen die kolom */
body.fvwl-col .et_pb_column:has(.wpc-filters-main-wrap):not(:has(.et_pb_shop)){ display:flow-root !important; float:none !important; width:0 !important; height:0 !important; min-height:0 !important; margin:0 !important; padding:0 !important; }
body.fvwl-col .et_pb_shop{ margin:0 !important; padding:0 !important; }
body.fvwl-col .et_pb_shop .woocommerce{ margin:0 !important; }
/* een collectie zonder banner: wat lucht boven de titel */
body.fvwl-col .et_pb_section:has(.et_pb_shop):has(.fvwl-chead:not(.fvwl-chead--bleed):not(.fvwl-chead--split)){ padding-top:20px !important; }

.fvwl-colbar{ position:sticky; top:var(--fvwl-hdr-vis, 0px); z-index:40; display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:56px; margin:0 0 34px; padding:0;
  background:var(--fvwl-white); border-top:1px solid var(--fvwl-line); border-bottom:1px solid var(--fvwl-line); transition:top .3s ease, box-shadow .3s ease;
  font-family:var(--fvwl-sans); font-weight:300; font-size:14px; letter-spacing:.04em; color:var(--fvwl-anthracite); }
/* als de balk plakt: hij loopt over de volle breedte, met een zachte schaduw */
.fvwl-colbar.is-stuck{ box-shadow:0 10px 24px -18px rgba(31,31,31,.35); }
.fvwl-colbar.is-stuck::before{ content:""; position:absolute; top:-1px; bottom:-1px; left:calc(50% - (100vw - var(--fvwl-sbw, 0px)) / 2); width:calc(100vw - var(--fvwl-sbw, 0px)); z-index:-1; background:var(--fvwl-white); border-bottom:1px solid var(--fvwl-line); }
.fvwl-colbar__left{ display:flex; align-items:center; gap:12px; min-width:0; }
.fvwl-colbar__filter{ display:inline-flex; align-items:center; gap:9px; padding:8px 0 6px; background:none; border:0; cursor:pointer; font:inherit; font-weight:400; font-size:var(--fvwl-fs-label); letter-spacing:var(--fvwl-ls-label); text-transform:uppercase; color:var(--fvwl-ink); }
.fvwl-colbar__filter[hidden], .fvwl-colbar__dot[hidden]{ display:none; }
.fvwl-colbar__filter span{ background:linear-gradient(var(--fvwl-gold),var(--fvwl-gold)) 0 100%/0 1px no-repeat; transition:background-size var(--fvwl-ease); padding-bottom:2px; }
.fvwl-colbar__filter:hover span{ background-size:100% 1px; }
.fvwl-colbar__dot{ color:var(--fvwl-line-strong); }
.fvwl-colbar__count{ white-space:nowrap; color:var(--fvwl-muted); }
.fvwl-colbar__sort{ display:inline-flex; align-items:center; gap:10px; margin:0; white-space:nowrap; }
.fvwl-colbar__sort > span{ font-weight:400; font-size:var(--fvwl-fs-label); letter-spacing:var(--fvwl-ls-label); text-transform:uppercase; color:var(--fvwl-ink); }
.fvwl-colbar__sort select{ -webkit-appearance:none; appearance:none; min-height:40px; margin:0; padding:9px 26px 7px 0; border:0; border-radius:0; background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%233A3A3A' stroke-width='1.6'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 4px center no-repeat;
  font-family:var(--fvwl-sans); font-weight:300; font-size:14px; letter-spacing:.04em; color:var(--fvwl-anthracite); cursor:pointer; max-width:52vw; }
.fvwl-colbar__sort select:focus-visible{ outline:2px solid var(--fvwl-ink); outline-offset:2px; }
.fvwl-colbar__jump{ display:flex; gap:26px; overflow-x:auto; scrollbar-width:none; }
.fvwl-colbar__jump::-webkit-scrollbar{ display:none; }
.fvwl-colbar__jump a{ padding:6px 0 4px; font-weight:400; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--fvwl-ink) !important; text-decoration:none !important; white-space:nowrap;
  background:linear-gradient(var(--fvwl-gold),var(--fvwl-gold)) 0 100%/0 1px no-repeat; transition:background-size var(--fvwl-ease); }
.fvwl-colbar__jump a:hover{ background-size:100% 1px; }
.fvwl-colchips:empty{ display:none; }
.fvwl-colchips{ margin:-14px 0 26px; }
.fvwl-colchips .wpc-filter-chips-list{ margin:0 !important; }
html body .wpc-filter-chips-list li.wpc-filter-chip:not(.wpc-chip-reset-all) a, html body .wpc-filter-chips-list li.wpc-filter-chip:not(.wpc-chip-reset-all) a *{ color:var(--fvwl-ink) !important; -webkit-text-fill-color:var(--fvwl-ink) !important; }
html body .wpc-filter-chips-list li.wpc-filter-chip:not(.wpc-chip-reset-all) a{ border-radius:0 !important; }
/* de header schuift weg bij naar beneden scrollen en komt terug bij omhoog scrollen (alleen op deze pagina's) */
body.fvwl-col .fvwl-hdr, body.fvwl-fam .fvwl-hdr{ transition:transform .3s ease; }
body.fvwl-col .fvwl-hdr.is-hidden, body.fvwl-fam .fvwl-hdr.is-hidden{ transform:translateY(-102%); }
body.fvwl-fam .fvwl-pg__sec h2{ scroll-margin-top:90px; }

/* ---------- 4. Raster: drie per rij op desktop, twee op mobiel; grotere beelden, meer wit ---------- */
body.fvwl-col .et_pb_shop ul.products{ display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:64px 36px; margin:0 !important; padding:0 !important; list-style:none !important; }
body.fvwl-col .et_pb_shop ul.products::before, body.fvwl-col .et_pb_shop ul.products::after{ display:none !important; content:none !important; }
body.fvwl-col .et_pb_shop ul.products > li{ float:none !important; clear:none !important; width:auto !important; max-width:none !important; margin:0 !important; padding:0 !important; text-align:left !important; position:relative; }
body.fvwl-col .et_pb_shop ul.products li.product a{ text-decoration:none; }
body.fvwl-col .et_pb_shop ul.products li.product .et_overlay{ display:none !important; }

/* de beeldvakken van alle kaarten (raster van de collecties en kaarten op de andere pagina's) */
body.fvwl-col .et_pb_shop ul.products li.product .et_shop_image,
.fvwl-pg .fvwl-card__img, .fvwl-closer .fvwl-card__img{ display:block; position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--fvwl-stone) !important; margin:0 !important; }
/* de productfoto volledig in beeld: contain, met overal dezelfde marge; een packshot op wit smelt in het lichtgrijs */
html body .fvwl-card-main{ position:absolute !important; top:6%; left:6%; width:88% !important; height:88% !important; max-width:none !important; margin:0 !important; object-fit:contain; object-position:50% 50%;
  background:transparent !important; box-shadow:none !important; transition:transform .7s cubic-bezier(.2,.6,.2,1), opacity .7s ease; }
html body .fvwl-card-main.is-pack{ mix-blend-mode:multiply; }
/* de sfeerfoto van datzelfde product: vult de kaart en vloeit erover bij hover (alleen met een muis) */
html body .fvwl-card-hover{ position:absolute !important; inset:0; width:100% !important; height:100% !important; max-width:none !important; margin:0 !important; object-fit:cover; opacity:0; transition:opacity .6s ease, transform .7s cubic-bezier(.2,.6,.2,1); pointer-events:none; }
@media (hover:hover){
  body.fvwl-col .et_pb_shop ul.products li.product.has-hover:hover .fvwl-card-hover, .fvwl-card.has-hover:hover .fvwl-card-hover{ opacity:1; }
  body.fvwl-col .et_pb_shop ul.products li.product:hover .fvwl-card-main, .fvwl-card:hover .fvwl-card-main,
  body.fvwl-col .et_pb_shop ul.products li.product:hover .fvwl-card-hover, .fvwl-card:hover .fvwl-card-hover{ transform:scale(1.03); }
}
/* geen eigen foto (of dezelfde als een ander product): de naam, rustig op lichtgrijs */
.fvwl-ph{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:12%; text-align:center; }
.fvwl-ph__name{ font-family:var(--fvwl-serif); font-style:italic; font-size:24px; line-height:1.2; color:var(--fvwl-muted); }
.fvwl-ph__name::after{ content:""; display:block; width:24px; height:1px; margin:14px auto 0; background:var(--fvwl-gold); }

/* naam, geurnoten, prijs: duidelijke rangorde (naam in de schreefletter, noten klein en ingetogen, prijs rustig) */
html body.fvwl-col .et_pb_shop ul.products li.product .woocommerce-loop-product__title,
html body .fvwl-card__name{ margin:18px 0 0 !important; padding:0 !important; font-family:var(--fvwl-serif) !important; font-weight:500 !important; font-size:23px !important; line-height:1.18 !important; letter-spacing:.005em !important;
  text-transform:none !important; text-align:left !important; text-shadow:none !important; color:var(--fvwl-ink) !important; }
html body.fvwl-col .et_pb_shop ul.products li.product .fvwl-notes--card, html body .fvwl-card .fvwl-notes--card{ display:block; margin:7px 0 0 !important; font-family:var(--fvwl-sans) !important; font-weight:400 !important; font-size:10.5px !important;
  letter-spacing:.16em !important; text-transform:uppercase !important; line-height:1.5 !important; color:var(--fvwl-muted) !important; }
html body.fvwl-col .et_pb_shop ul.products li.product .price, html body.fvwl-col .et_pb_shop ul.products li.product .price .amount,
html body .fvwl-card__meta{ display:block; margin:9px 0 0 !important; font-family:var(--fvwl-sans) !important; font-weight:400 !important; font-size:14px !important; letter-spacing:.04em !important; text-align:left !important; text-shadow:none !important; color:var(--fvwl-anthracite) !important; }
html body.fvwl-col .et_pb_shop ul.products li.product .price .amount{ display:inline; margin:0 !important; }
/* “Snel winkelen”: dunne knop onderaan de foto, alleen bij hover (op aanraakschermen niet) */
body.fvwl-col .et_pb_shop ul.products li.product .quick-add-wrap{ position:absolute; left:12px; right:12px; bottom:12px; top:auto; margin:0; padding:0; opacity:0; transform:translateY(6px); transition:opacity var(--fvwl-ease), transform var(--fvwl-ease); z-index:2; }
body.fvwl-col .et_pb_shop ul.products li.product:hover .quick-add-wrap, body.fvwl-col .et_pb_shop ul.products li.product:focus-within .quick-add-wrap{ opacity:1; transform:none; }
html body.fvwl-col #page-container .et_pb_shop ul.products li.product .quick-add-wrap .button{ width:100%; min-height:44px; padding:2px 10px 0 !important; background:rgba(255,255,255,.94) !important; background-color:rgba(255,255,255,.94) !important; color:var(--fvwl-ink) !important; border:1px solid var(--fvwl-white) !important; font-size:11px !important; }
html body.fvwl-col #page-container .et_pb_shop ul.products li.product .quick-add-wrap .button:hover{ background:var(--fvwl-anthracite) !important; background-color:var(--fvwl-anthracite) !important; color:var(--fvwl-white) !important; border-color:var(--fvwl-anthracite) !important; padding:2px 10px 0 !important; }
@media (hover:none){ body.fvwl-col .et_pb_shop ul.products li.product .quick-add-wrap{ display:none; } }

/* kaarten op de pagina's van de stijlfamilies en in de afsluiter: zelfde raster */
.fvwl-pg--fam .fvwl-grid, body.fvwl-fam .fvwl-grid{ grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:64px 36px !important; }
.fvwl-card a{ display:block; text-decoration:none !important; }

/* ---------- 5. Brede sfeertegels (twee kolommen), hoogstens één per acht producten ---------- */
.fvwl-wtile{ grid-column:span 2; position:relative; display:block; min-height:100%; margin:0 !important; padding:0 !important; list-style:none !important; }
.fvwl-wtile a{ position:absolute; inset:0; display:block; overflow:hidden; background:var(--fvwl-stone); text-decoration:none !important; }
.fvwl-wtile__img{ position:absolute; inset:0; width:100% !important; height:100% !important; max-width:none !important; object-fit:cover; transition:transform .9s cubic-bezier(.2,.6,.2,1), opacity .7s ease; }
.fvwl-wtile a::after{ content:""; position:absolute; inset:0; background:linear-gradient(to right, rgba(20,18,16,.58) 0%, rgba(20,18,16,.2) 46%, rgba(20,18,16,0) 70%); pointer-events:none; }
.fvwl-wtile__txt{ position:absolute; left:44px; bottom:44px; z-index:1; max-width:min(420px, 60%); display:flex; flex-direction:column; gap:12px; color:#fff; }
.fvwl-wtile__eyebrow{ font-family:var(--fvwl-sans); font-weight:400; font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--fvwl-gold); }
.fvwl-wtile__title{ font-family:var(--fvwl-serif); font-weight:400; font-size:clamp(28px, 2.6vw, 40px); line-height:1.08; color:#fff; }
.fvwl-wtile__cta{ align-self:flex-start; margin-top:6px; padding:0 0 4px; border-bottom:1px solid var(--fvwl-gold); font-family:var(--fvwl-sans); font-weight:400; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:#fff; }
@media (hover:hover){ .fvwl-wtile a:hover .fvwl-wtile__img{ transform:scale(1.03); } }

/* ---------- 6. De afsluiter: verhaal (beeld + tekst) en bestsellers ---------- */
.fvwl-closer{ margin:96px 0 0; padding:0; font-family:var(--fvwl-sans); font-weight:300; color:var(--fvwl-anthracite); }
.fvwl-closer__story{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:0; background:var(--fvwl-paper); }
.fvwl-closer__story--plain{ grid-template-columns:minmax(0,1fr); text-align:center; }
.fvwl-closer__media{ position:relative; aspect-ratio:4/5; overflow:hidden; background:var(--fvwl-stone); }
.fvwl-closer__img{ position:absolute; inset:0; width:100% !important; height:100% !important; max-width:none !important; object-fit:cover; }
.fvwl-closer__txt{ padding:64px clamp(32px, 6vw, 96px); }
.fvwl-closer__story--plain .fvwl-closer__txt{ max-width:760px; margin:0 auto; }
.fvwl-closer__eyebrow{ margin:0 0 14px !important; padding:0 !important; font-weight:400; font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--fvwl-anthracite); }
.fvwl-closer__eyebrow::after{ content:""; display:block; width:28px; height:1px; margin:14px 0 0; background:var(--fvwl-gold); }
.fvwl-closer__story--plain .fvwl-closer__eyebrow::after{ margin:14px auto 0; }
html body .fvwl-closer .fvwl-closer__title{ margin:0 0 18px !important; padding:0 !important; font-family:var(--fvwl-serif) !important; font-weight:400 !important; font-size:clamp(32px, 3.2vw, 46px) !important; line-height:1.1 !important; text-transform:none !important; color:var(--fvwl-ink) !important; }
.fvwl-closer__text{ margin:0 0 26px !important; padding:0 !important; font-size:17px; line-height:1.7; letter-spacing:.01em; }
.fvwl-csizes{ display:grid; grid-template-columns:1fr; gap:0; margin:0 !important; padding:0 !important; list-style:none !important; border-top:1px solid var(--fvwl-line); }
.fvwl-csizes li{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin:0 !important; padding:14px 0 12px !important; list-style:none !important; border-bottom:1px solid var(--fvwl-line); }
.fvwl-csizes__name{ font-family:var(--fvwl-serif); font-size:22px; color:var(--fvwl-ink); }
.fvwl-csizes__spec{ font-size:13px; letter-spacing:.06em; color:var(--fvwl-muted); text-align:right; }
.fvwl-closer__best{ margin:88px 0 0; }
.fvwl-closer__best-head{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin:0 0 28px; padding:0 0 14px; border-bottom:1px solid var(--fvwl-line); }
html body .fvwl-closer__best-head .fvwl-closer__title{ margin:0 !important; font-size:clamp(28px, 2.6vw, 38px) !important; }
.fvwl-closer__all{ font-weight:400; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--fvwl-ink) !important; text-decoration:none !important; border-bottom:1px solid var(--fvwl-gold); padding-bottom:3px; white-space:nowrap; }
.fvwl-closer .fvwl-grid{ list-style:none !important; margin:0 !important; padding:0 !important; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:40px 28px !important; }
.fvwl-closer .fvwl-card__name{ font-size:20px !important; }

/* ---------- 7. Beweging: zacht invloeien bij het laden, lichte zoom bij hover (max. 1,03); niets bij “minder beweging” ---------- */
.fvwl-js-fade .fvwl-fade{ opacity:0; }
.fvwl-js-fade .fvwl-fade.is-in{ opacity:1; }
.fvwl-chead__img{ animation:fvwl-col-settle 1.8s cubic-bezier(.2,.6,.2,1) both; }
@keyframes fvwl-col-settle{ from{ transform:scale(1.03); } to{ transform:none; } }
@media (prefers-reduced-motion:reduce){
  .fvwl-js-fade .fvwl-fade{ opacity:1 !important; }
  .fvwl-chead__img{ animation:none; }
  html body .fvwl-card-main, html body .fvwl-card-hover, .fvwl-wtile__img, .fvwl-colbar, body.fvwl-col .fvwl-hdr, body.fvwl-fam .fvwl-hdr{ transition:none !important; }
  @media (hover:hover){
    body.fvwl-col .et_pb_shop ul.products li.product:hover .fvwl-card-main, .fvwl-card:hover .fvwl-card-main, .fvwl-wtile a:hover .fvwl-wtile__img,
    body.fvwl-col .et_pb_shop ul.products li.product:hover .fvwl-card-hover, .fvwl-card:hover .fvwl-card-hover{ transform:none; }
  }
}

/* ---------- 8. Filter: op elke breedte een paneel dat opent met de knop in de balk ---------- */
body.fvwl-col .wpc-filters-main-wrap .wpc-filters-open-button-container{ display:none !important; }
body.fvwl-col .wpc-filters-main-wrap{ max-width:none !important; padding:0 !important; }
@media (min-width:981px){
  body.fvwl-col .wpc-filters-main-wrap .wpc-filters-widget-content:not(.wpc-opened){ display:none !important; }
  body.fvwl-col .wpc-filters-main-wrap .wpc-filters-widget-content.wpc-opened{
    display:block !important; position:fixed !important; top:0 !important; bottom:0 !important; left:0 !important; right:auto !important; z-index:1000002 !important;
    width:min(92vw,420px) !important; max-width:none !important; height:100% !important; margin:0 !important; box-sizing:border-box !important;
    padding:28px 30px 34px !important; background:var(--fvwl-white) !important; overflow-y:auto !important;
    box-shadow:0 0 0 100vmax var(--fvwl-scrim) !important; animation:fvwl-col-filter-in .28s ease both;
  }
  @keyframes fvwl-col-filter-in{ from{ transform:translateX(-100%); } to{ transform:translateX(0); } }
  body.fvwl-col .wpc-filters-main-wrap .wpc-widget-close-container{ display:flex !important; align-items:center !important; justify-content:space-between !important; flex-direction:row-reverse !important; margin:0 0 26px !important; padding:0 0 14px !important; border-bottom:1px solid var(--fvwl-line) !important; position:static !important; background:none !important; }
  body.fvwl-col .wpc-filters-main-wrap .wpc-widget-close-container *{ position:static !important; transform:none !important; float:none !important; }
  body.fvwl-col .wpc-filters-main-wrap .wpc-widget-popup-title{ display:block !important; margin:0 !important; padding:0 !important; font-family:var(--fvwl-serif) !important; font-weight:400 !important; font-size:28px !important; line-height:1.1 !important; text-transform:none !important; color:var(--fvwl-ink) !important; -webkit-text-fill-color:var(--fvwl-ink) !important; }
  body.fvwl-col .wpc-filters-main-wrap a.wpc-widget-close-icon{ display:inline-flex !important; width:32px !important; height:32px !important; align-items:center !important; justify-content:center !important; }
  body.fvwl-col .wpc-filters-main-wrap .wpc-filters-scroll-container, body.fvwl-col .wpc-filters-main-wrap .wpc-filters-widget-wrapper{ max-height:none !important; height:auto !important; overflow:visible !important; padding:0 !important; }
  body.fvwl-col .et_pb_section:has(.wpc-filters-widget-content.wpc-opened), body.fvwl-col .et_pb_row:has(.wpc-filters-widget-content.wpc-opened),
  body.fvwl-col .et_pb_column:has(.wpc-filters-widget-content.wpc-opened), body.fvwl-col .et_pb_module:has(.wpc-filters-widget-content.wpc-opened),
  body.fvwl-col .wpc-filters-main-wrap:has(.wpc-filters-widget-content.wpc-opened){ position:relative !important; z-index:1000003 !important; transform:none !important; overflow:visible !important; }
  body.fvwl-col:has(.wpc-filters-widget-content.wpc-opened){ overflow:hidden; }
}

/* ---------- 9. Tablet en mobiel ---------- */
@media (max-width:1100px){
  body.fvwl-col .et_pb_shop ul.products, .fvwl-pg--fam .fvwl-grid, body.fvwl-fam .fvwl-grid{ gap:48px 22px !important; }
  .fvwl-closer .fvwl-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .fvwl-chead--split{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .fvwl-chead__split-txt{ padding:48px 40px; }
}
@media (max-width:767px){
  .fvwl-chead{ margin-bottom:22px; }
  .fvwl-chead__media, .fvwl-chead--bleed .fvwl-chead__media{ aspect-ratio:4/5; height:auto; max-height:none; width:auto; margin:0 -16px; }
  /* liggende mobiele banner (3:2): het hele beeld in beeld, niets afgesneden (13 nov: Gold & Silver) */
  .fvwl-chead--m-wide .fvwl-chead__media, .fvwl-chead--bleed.fvwl-chead--m-wide .fvwl-chead__media{ aspect-ratio:3/2; }
  .fvwl-chead--m-wide .fvwl-chead__over{ bottom:16px; }
  .fvwl-chead__over{ bottom:26px; padding:0 20px; }
  .fvwl-chead__plain{ padding-top:14px; }
  .fvwl-chead__body{ padding-top:24px; }
  .fvwl-chead__lead{ font-size:20px; }
  .fvwl-chead__intro-in{ font-size:18px; }
  .fvwl-chead--split{ display:flex; flex-direction:column-reverse; width:auto; margin:0 -16px 22px; }
  .fvwl-chead__split-media{ min-height:0; aspect-ratio:4/5; }
  .fvwl-chead__split-txt{ padding:26px 16px 30px; }
  .fvwl-chips{ margin-top:20px; margin-left:-16px; margin-right:-16px; }
  .fvwl-chips__list{ flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; padding:0 16px 4px !important; scrollbar-width:none; }
  .fvwl-chips__list::-webkit-scrollbar{ display:none; }
  .fvwl-chip{ min-height:38px; padding:3px 14px 0; font-size:10.5px; letter-spacing:.14em; }
  body.fvwl-col .et_pb_section:has(.et_pb_shop){ padding:0 0 56px !important; }
  body.fvwl-col .et_pb_row:has(.et_pb_shop){ padding:0 16px !important; }
  .fvwl-colbar{ margin:0 -16px 22px; padding:0 16px; font-size:13px; gap:10px; }
  .fvwl-colbar.is-stuck::before{ display:none; }
  .fvwl-colbar__sort > span{ display:none; }
  .fvwl-colbar__jump{ gap:18px; }
  html body.fvwl-col .et_pb_shop ul.products li.product .woocommerce-loop-product__title, html body .fvwl-card__name{ margin-top:12px !important; font-size:18px !important; }
  html body.fvwl-col .et_pb_shop ul.products li.product .fvwl-notes--card, html body .fvwl-card .fvwl-notes--card{ font-size:9.5px !important; letter-spacing:.12em !important; }
  html body.fvwl-col .et_pb_shop ul.products li.product .price, html body.fvwl-col .et_pb_shop ul.products li.product .price .amount, html body .fvwl-card__meta{ font-size:13.5px !important; margin-top:6px !important; }
  .fvwl-pg--fam .fvwl-grid, body.fvwl-fam .fvwl-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:32px 12px !important; }
  .fvwl-wtile{ min-height:0; aspect-ratio:4/5; }
  .fvwl-wtile a::after{ background:linear-gradient(to top, rgba(20,18,16,.62) 0%, rgba(20,18,16,.15) 48%, rgba(20,18,16,0) 70%); }
  .fvwl-wtile__txt{ left:20px; right:20px; bottom:22px; max-width:none; gap:8px; }
  .fvwl-ph__name{ font-size:18px; }
  .fvwl-closer{ margin-top:64px; }
  .fvwl-closer__story{ grid-template-columns:1fr; margin:0 -16px; }
  .fvwl-closer__txt{ padding:36px 20px 40px; }
  .fvwl-closer__text{ font-size:16px; }
  .fvwl-closer__best{ margin-top:56px; }
  .fvwl-closer .fvwl-grid{ gap:32px 12px !important; }
  .fvwl-closer .fvwl-card__name{ font-size:17px !important; }
}
/* Een oudere snippet dwingt op mobiel één productkolom af (body #et-boc … !important); daarom hier een zwaardere selector. */
@media (max-width:767px){
  html body.fvwl-col #page-container #et-boc .et_pb_shop .woocommerce ul.products,
  html body.fvwl-col.archive.tax-product_cat.et-tb-has-body #page-container #et-boc .et_pb_shop .woocommerce ul.products{ display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:32px 12px !important; }
  html body.fvwl-col #page-container #et-boc .et_pb_shop .woocommerce ul.products > li,
  html body.fvwl-col.archive.tax-product_cat.et-tb-has-body #page-container #et-boc .et_pb_shop .woocommerce ul.products > li{ float:none !important; width:auto !important; max-width:none !important; margin:0 !important; padding:0 !important; }
  html body.fvwl-col #page-container #et-boc .et_pb_shop .woocommerce ul.products > li.fvwl-wtile{ grid-column:1 / -1; }
}
/* desktop: een brede tegel neemt twee van de drie kolommen */
@media (min-width:768px){
  html body.fvwl-col #page-container #et-boc .et_pb_shop .woocommerce ul.products > li.fvwl-wtile{ grid-column:span 2; }
}

/* ---------- 10. Mobiel: plakken mogelijk maken ----------
   Op mobiel staan html en body op overflow-x:hidden (Divi of een oude snippet, niet uit deze code). Daardoor wordt body een
   scrollcontainer en plakt niets meer (header en balk). “clip” verbergt de horizontale overloop ook, zonder dat effect.
   Niet als een paneel open is (zijmandje, menu, filter): die zetten zelf overflow op hidden om het scrollen te blokkeren. */
html:has(body.fvwl-col, body.fvwl-fam):not(.xoo-wsc-cart-active):not(:has(body.fvwl-drawer-open)):not(:has(.wpc-filters-widget-content.wpc-opened)),
body:is(.fvwl-col, .fvwl-fam):not(.xoo-wsc-cart-active):not(.fvwl-drawer-open):not(:has(.wpc-filters-widget-content.wpc-opened)){ overflow-x:clip !important; overflow-y:visible !important; }

/* eenvoudige collectiepagina (fvwl-categorie-eenvoudig.php): banner meteen onder de header, zoals bij de andere collecties */
body.fvwl-ce #main-content .container{ padding-top:0 !important; }
body.fvwl-ce #main-content .container::before{ display:none !important; }
body.fvwl-ce #left-area{ padding-bottom:0 !important; }

/* links naar de navullingen in het blok “Navulbaar” (13 nov 2026) */
.fvwl-closer__text--links a{ color:var(--fvwl-ink) !important; text-decoration:underline; text-decoration-color:var(--fvwl-gold); text-underline-offset:4px; }
.fvwl-closer__text--links a:hover{ text-decoration-color:var(--fvwl-ink); }
