/* Wijnvanjewelste: de blokken van de editor en de opmaak van artikelen | SaffrieDesign

   Op de site staat de inhoud van een artikel of pagina in .article. In de editor
   bestaat die .article niet; inc/blokken.php haalt daarom ".article " weg voordat
   deze regels als editorstijl worden meegegeven. Zo is wat je in de editor ziet
   gelijk aan wat er op de site komt. */

/* ── Kolombreedte van een artikel ── */
.wvj-artikel .artikelinhoud .article{max-width:760px;margin:0 auto}
.article>*:first-child{margin-top:0}

/* ── Tekst ── */
.article p{line-height:1.8}
.article h3{font-size:19px;margin:30px 0 10px}
.article h4{font-family:var(--font-head);font-size:16px;color:var(--title);margin:24px 0 8px}
.article h2 + h3{margin-top:14px}
.article ul li::marker{color:var(--wine)}
.article ol li::marker{color:var(--wine);font-weight:600}
.article .has-text-align-center{text-align:center}

/* ── Intro: de opening van een artikel, iets groter en donkerder ── */
.article .wvj-intro{margin:0 0 34px;padding-left:22px;border-left:3px solid var(--wine)}
.article .wvj-intro p{font-size:18px;line-height:1.75;color:var(--entities);margin-bottom:14px}
.article .wvj-intro p:last-child{margin-bottom:0}

/* ── Foto's ── */
.article .wp-block-image{margin:30px 0}
.article .wp-block-image img{border-radius:var(--radius);height:auto;max-width:100%}
.article .wp-block-image figcaption{font-size:13px;color:#8a8b90;margin-top:8px;text-align:center}
.article .wp-block-image .alignright,.article .wp-block-image.alignright{float:right;width:40%;margin:6px 0 18px 30px}
.article .wp-block-image .alignleft,.article .wp-block-image.alignleft{float:left;width:40%;margin:6px 30px 18px 0}
.article .wp-block-image .alignright img,.article .wp-block-image .alignleft img,
.article .wp-block-image.alignright img,.article .wp-block-image.alignleft img{width:100%}
.article h2{clear:both}
@media(max-width:640px){
	.article .wp-block-image .alignright,.article .wp-block-image.alignright,
	.article .wp-block-image .alignleft,.article .wp-block-image.alignleft{float:none;width:auto;max-width:340px;margin:0 auto 22px}
}

/* ── Tabel ── */
.article .wp-block-table{margin:26px 0 30px;overflow-x:auto}
.article .wp-block-table table{width:100%;border-collapse:separate;border-spacing:0;font-size:14.5px;background:#fff;border:1px solid var(--sand);border-radius:var(--radius);overflow:hidden}
.article .wp-block-table th,.article .wp-block-table td{border:0;border-bottom:1px solid var(--cream);padding:12px 16px;text-align:left;vertical-align:top;color:var(--text)}
.article .wp-block-table thead th,.article .wp-block-table tr:first-child td strong{color:var(--title)}
.article .wp-block-table thead th{background:var(--cream);font-family:var(--font-head);font-weight:700;font-size:14px}
.article .wp-block-table tr:last-child td{border-bottom:0}
.article .wp-block-table tbody tr:nth-child(even) td{background:#fcfbf9}
.article .wp-block-table figcaption{font-size:13px;color:#8a8b90;margin-top:8px}

/* ── Citaat ── */
.article .wp-block-quote,.article blockquote{margin:30px 0;padding:4px 0 4px 24px;border-left:3px solid var(--gold)}
.article .wp-block-quote p,.article blockquote p{font-size:18px;color:var(--entities);font-style:italic}
.article .wp-block-quote cite{display:block;margin-top:6px;font-size:13px;color:#8a8b90;font-style:normal}

/* ── Scheidingslijn ── */
.article .wp-block-separator{border:0;border-top:1px solid var(--sand);margin:38px 0;opacity:1}

/* ── Kader: tip, samenvatting of de afsluitende oproep ── */
.article .wvj-kader{border-radius:var(--radius);padding:30px 34px;margin:36px 0;clear:both}
.article .wvj-kader>*:last-child{margin-bottom:0}
.article .wvj-kader h2,.article .wvj-kader h3{border-top:0;padding-top:0;margin:0 0 10px}
.article .wvj-kader h2{font-size:clamp(21px,2.4vw,26px)}
.article .wvj-kader__kicker{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--wine);margin-bottom:8px;font-weight:400}
.article .wvj-kader .wvj-knop{margin:18px 0 0}
.article .wvj-kader--creme{background:var(--cream);border:1px solid var(--sand)}
.article .wvj-kader--tip{background:#fff;border:1px solid var(--sand);border-left:4px solid var(--gold);box-shadow:var(--shadow)}
.article .wvj-kader--tip .wvj-kader__kicker{color:var(--gold)}
.article .wvj-kader--wijn{background:var(--grad);border:0}
.article .wvj-kader--wijn,.article .wvj-kader--wijn p,.article .wvj-kader--wijn li{color:#f4d9dc}
.article .wvj-kader--wijn h2,.article .wvj-kader--wijn h3,.article .wvj-kader--wijn strong{color:#fff}
.article .wvj-kader--wijn .wvj-kader__kicker{color:var(--gold)}
.article .wvj-kader--wijn a:not(.btn){color:#fff}
.article .wvj-kader--wijn .btn:not(.gold){background:#fff;color:var(--wine);border-color:#fff}
@media(max-width:560px){.article .wvj-kader{padding:24px 20px}}

/* ── Knop ── */
.article .wvj-knop{margin:26px 0;clear:both}
.article .wvj-knop--midden{text-align:center}
.article .wvj-knop .btn{text-decoration:none}
.article .wvj-knop .btn .ic{width:16px;height:16px}

/* ── Wijnen: dezelfde kaarten als in de winkel ── */
.article .wvj-wijnen{margin:40px 0;clear:both}
.article .wvj-wijnen--band{background:var(--cream);width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:48px 0}
.article .wvj-wijnen__binnen{max-width:1200px;margin:0 auto}
.article .wvj-wijnen--band .wvj-wijnen__binnen{padding:0 20px}
.article .wvj-wijnen .sec-head{margin-bottom:26px}
.article .wvj-wijnen .sec-head h2{border-top:0;padding-top:0;margin:0}
.article .wvj-wijnen .sec-sub{margin:-14px 0 22px;color:#5b5c61;font-size:15px}
.article .wvj-wijnen .card h3{font-size:15px;line-height:1.35;margin:0;min-height:41px;color:var(--entities);font-family:var(--font-head)}
.article .wvj-wijnen a:not(.btn):not(.button):not(.wvj-knop):not(.wp-block-button__link){color:inherit;text-decoration:none}
.article .wvj-wijnen .card .pcat a{color:var(--wine)}
.article .wvj-wijnen .sec-head .more{color:var(--wine)}
.article .wvj-wijnen--band .grid{background:transparent}
@media(max-width:780px){.article .wvj-wijnen--band{padding:36px 0}}

/* ── Beeld en tekst ── */
.article .wvj-beeldtekst{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;margin:40px 0;clear:both}
.article .wvj-beeldtekst--links{grid-template-columns:.9fr 1.1fr}
.article .wvj-beeldtekst--links .wvj-beeldtekst__beeld{order:-1}
.article .wvj-beeldtekst__tekst>*:first-child{margin-top:0}
.article .wvj-beeldtekst__tekst>*:last-child{margin-bottom:0}
.article .wvj-beeldtekst__tekst h2{border-top:0;padding-top:0}
.article .wvj-beeldtekst__beeld{margin:0;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5}
.article .wvj-beeldtekst__beeld img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:700px){
	.article .wvj-beeldtekst,.article .wvj-beeldtekst--links{grid-template-columns:1fr;gap:20px}
	.article .wvj-beeldtekst__beeld{order:-1;aspect-ratio:4/3}
}

/* ── Veelgestelde vragen: zelfde uitklaplijst als op de categoriepagina's ── */
.article .wvj-faq{max-width:none;margin:18px 0 36px}
.article .wvj-faq summary{font-size:15.5px}
.article .wvj-faq__antwoord{padding:0 22px 18px}
.article .wvj-faq__antwoord p{font-size:15px;margin:0 0 10px;padding:0}
.article .wvj-faq__antwoord p:last-child{margin-bottom:0}

/* ── Banner: brede kop voor een landingspagina ── */
.article .wvj-banner{position:relative;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);margin-top:0;margin-bottom:44px;min-height:420px;display:flex;align-items:center;color:#fff;background:var(--grad);overflow:hidden}
.article .wvj-banner--donker{background:#1d1d1e}
.article .wvj-banner--foto{background:linear-gradient(90deg,rgba(29,29,30,.86) 0%,rgba(29,29,30,.55) 55%,rgba(29,29,30,.25) 100%),var(--wvj-banner-beeld) center/cover no-repeat}
.article .wvj-banner__binnen{max-width:1200px;width:100%;margin:0 auto;padding:64px 20px}
.article .wvj-banner__kicker{display:block;color:var(--gold);letter-spacing:.18em;text-transform:uppercase;font-size:13px;margin-bottom:12px}
.article .wvj-banner__titel{color:#fff;font-size:clamp(32px,5vw,54px);line-height:1.08;max-width:680px;border-top:0;padding-top:0;margin:0 0 16px}
.article .wvj-banner__tekst{color:#f1e6e7;font-size:17px;max-width:560px;margin:0 0 26px;line-height:1.7}
.article .wvj-banner .btn{text-decoration:none}
@media(max-width:640px){
	.article .wvj-banner{min-height:340px}
	.article .wvj-banner__binnen{padding:44px 20px}
	.article .wvj-banner__tekst{font-size:15.5px}
}

/* Een pagina die met een banner begint: de banner is dan de kop van de pagina
   (page.php laat de gewone kop weg) en sluit direct aan op het menu. */
.paginainhoud .article>.wvj-banner:first-child{margin-top:-44px}

/* Eindigt een artikel met een wijnenband, dan sluit die aan op de volgende sectie
   in plaats van dat er een wit gat van bijna 100 pixels tussen zit. */
.wvj-artikel .article>.wvj-wijnen--band:last-child{margin-bottom:-48px}
.article .wvj-wijnen{scroll-margin-top:90px}