/**
 * Jaargangrooster. Huisstijl van de archieven: Cinzel-koppen, Cantarell-labels,
 * crème #f5ede1 en rand #eddec6 (zelfde waarden als awcf_chateau_meta).
 */

.awcf-jaargang {
    margin: 24px 0 28px;
    padding: 20px;
    background: #f5ede1;
}

.awcf-jaargang__kop {
    margin: 0 0 12px;
    font-family: Cinzel, serif;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 1.3px;
    color: #000;
}

.awcf-jaargang__tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
}

.awcf-jaargang__tab {
    padding: 6px 12px;
    border: 1px solid #eddec6;
    border-radius: 0;
    background: #fff;
    color: #504d53;
    font-family: Cantarell, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .5px;
    text-transform: uppercase;
    cursor: pointer;
}

.awcf-jaargang__tab:hover,
.awcf-jaargang__tab:focus-visible {
    border-color: #504d53;
}

.awcf-jaargang__tab.is-open {
    background: #504d53;
    border-color: #504d53;
    color: #fff;
}

/* Zonder JavaScript staan alle panelen open; met JS alleen het gekozen paneel. */
.awcf-jaargang__paneel {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.awcf-jaargang.is-js .awcf-jaargang__paneel {
    display: none;
    margin-bottom: 0;
}

.awcf-jaargang.is-js .awcf-jaargang__paneel.is-open {
    display: flex;
}

.awcf-jaargang__jaar {
    position: relative;
    min-width: 58px;
    padding: 7px 10px;
    border: 1px solid #eddec6;
    background: #fff;
    color: #000;
    font-family: Merriweather, serif;
    font-size: 14px;
    text-align: center;
    text-decoration: none;
}

.awcf-jaargang__jaar:hover,
.awcf-jaargang__jaar:focus-visible {
    border-color: #504d53;
    color: #000;
    text-decoration: none;
}

.awcf-jaargang__jaar.is-huidig {
    background: #504d53;
    border-color: #504d53;
    color: #fff;
}

/* Jubileumjaar: gouden stip rechtsboven. */
.awcf-jaargang__jaar.is-jubileum::after,
.awcf-jaargang__stip {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #b08d57;
}

.awcf-jaargang__jaar.is-jubileum::after {
    position: absolute;
    top: 4px;
    right: 4px;
}

.awcf-jaargang__uitleg {
    margin: 12px 0 0;
    line-height: 1.5;
    font-family: Cantarell, sans-serif;
    font-size: 12px;
    color: #504d53;
}

.awcf-jaargang__stip {
    margin-right: 6px;
    vertical-align: 1px;
}

/* Blends (meerdere jaren) en non-vintage: zo breed als de tekst, niet afbreken. */
.awcf-jaargang__paneel[data-groep="blends"] .awcf-jaargang__jaar,
.awcf-jaargang__paneel[data-groep="nv"] .awcf-jaargang__jaar {
    white-space: nowrap;
}

@media (max-width: 767px) {
    /* Tabs als één schuifbare rij, zodat het rooster de wijnen niet ver naar beneden duwt. */
    /* De rij loopt door tot de rand van het blok: de laatste tab wordt zichtbaar afgekapt,
       dat laat zien dat je kunt vegen. Geen pijlen of fade. */
    .awcf-jaargang__tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-left: -16px;
        margin-right: -16px;
        padding: 0 16px;
        scroll-padding: 0 16px;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .awcf-jaargang__tabs::-webkit-scrollbar {
        display: none;
    }
    .awcf-jaargang__tab {
        flex: 0 0 auto;
        white-space: nowrap;
    }
    .awcf-jaargang__paneel[data-groep="blends"] .awcf-jaargang__jaar,
    .awcf-jaargang__paneel[data-groep="nv"] .awcf-jaargang__jaar {
        flex: 0 0 auto;
        padding: 7px 10px;
    }
    .awcf-jaargang {
        padding: 16px;
    }
    .awcf-jaargang__tab {
        padding: 6px 9px;
    }
    .awcf-jaargang__jaar {
        min-width: 0;
        flex: 0 0 calc(20% - 5px);
        padding: 7px 4px;
    }
}

/* Eigen scrollbalk onder de tabrij (mobiel). Alleen zichtbaar als de rij echt schuift. */
.awcf-jaargang__balk {
    display: none;
    position: relative;
    height: 4px;
    margin: -6px 0 14px;
    border-radius: 2px;
    background: #eddec6;
    cursor: pointer;
    touch-action: none;
}

.awcf-jaargang__balk.is-actief {
    display: block;
}

.awcf-jaargang__duim {
    position: absolute;
    top: -3px;
    bottom: -3px;
    left: 0;
    border-radius: 5px;
    background: #504d53;
    background-clip: content-box;
    padding: 3px 0;
    cursor: grab;
    touch-action: none;
}

/* Geen voorraad (D2): rustig blok met twee knoppen, huisstijl als het rooster. */
.awcf-jaargang-leeg {
    margin: 24px 0 0;
    padding: 20px;
    border: 1px solid #eddec6;
    background: #fff;
    font-family: Merriweather, serif;
    font-size: 15px;
    line-height: 1.6;
}

.awcf-jaargang-leeg__kop {
    margin: 0 0 8px;
    font-family: Cinzel, serif;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 1.3px;
    color: #000;
}

.awcf-jaargang-leeg__knoppen {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 14px 0 0;
}

.awcf-jaargang-leeg__knop {
    display: inline-block;
    padding: 9px 16px;
    background: #504d53;
    color: #fff;
    font-family: Cantarell, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    text-decoration: none;
}

.awcf-jaargang-leeg__knop:hover,
.awcf-jaargang-leeg__knop:focus-visible {
    color: #fff;
    background: #000;
    text-decoration: none;
}

.awcf-jaargang-leeg__knop--licht {
    background: #fff;
    color: #504d53;
    border: 1px solid #504d53;
}

.awcf-jaargang-leeg__knop--licht:hover,
.awcf-jaargang-leeg__knop--licht:focus-visible {
    color: #fff;
}

/* H1 jaargangpagina: "Wijn uit" klein boven het jaartal */
.awcf-jg-h1__voor {
    display: block;
    font-size: max(0.5em, 13px);
    letter-spacing: 0.08em;
    line-height: 1.3;
    margin-bottom: 0.15em;
    opacity: 0.85;
}

/* Wijnjaar per regio + nieuwsfeit (10-11) */
.awcf-jg-wijnjaar{list-style:none;margin:.6em 0 .8em;padding:0}
.awcf-jg-wijnjaar li{margin:0 0 .45em;padding-left:0}
.awcf-jg-wijnjaar li strong{font-weight:600}
.awcf-jg-feit{margin:.2em 0 0;font-style:italic}
.awcf-jg-feit strong{font-style:normal;font-weight:600}

/* Zijbalk: decennia als knoppen, jaren klappen eronder open (10-11, v4). Niets standaard open. */
.awcf-jg-zij{background:#f5ede1;padding:10px;font-family:Cantarell,sans-serif;color:#504d53}
.awcf-jg-zij__decs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.awcf-jg-zij__dec{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:8px 4px 6px;border:1px solid #eddec6;background:#fff;color:#000;cursor:pointer;border-radius:0;line-height:1.1;transition:border-color .15s ease,background .15s ease,color .15s ease}
.awcf-jg-zij__dec:hover,.awcf-jg-zij__dec:focus-visible{border-color:#504d53;background:#fff;color:#000}
.awcf-jg-zij__label{font-family:Merriweather,serif;font-size:15px}
.awcf-jg-zij__n{font-size:11px;letter-spacing:.04em;color:#8a857f}
.awcf-jg-zij__dec.is-breed{grid-column:1/-1;flex-direction:row;justify-content:space-between;padding:8px 12px}
.awcf-jg-zij__dec.is-breed .awcf-jg-zij__label{font-family:Cantarell,sans-serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.awcf-jg-zij__dec.is-open{background:#504d53;border-color:#504d53;color:#fff}
.awcf-jg-zij__dec.is-open .awcf-jg-zij__n{color:#e8dcc8}
.awcf-jg-zij__paneel{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:12px;padding-top:12px;border-top:1px solid #d9c7a6}
.awcf-jg-zij__titel{grid-column:1/-1;margin:0 0 4px;font-family:Merriweather,serif;font-size:14px;color:#000}
.awcf-jg-zij.is-js .awcf-jg-zij__paneel{display:none}
.awcf-jg-zij.is-js .awcf-jg-zij__paneel.is-open{display:grid}
.awcf-jg-zij__paneel.is-breed{grid-template-columns:1fr 1fr}
.awcf-jg-zij a.awcf-jg-zij__jaar{position:relative;display:flex !important;flex-direction:column;align-items:center;padding:6px 2px 4px;border:1px solid #eddec6;background:#fff;color:#000;text-decoration:none;font-family:Merriweather,serif;font-size:13px;line-height:1.15}
.awcf-jg-zij a.awcf-jg-zij__jaar:hover{border-color:#504d53;color:#000;text-decoration:none}
.awcf-jg-zij a.awcf-jg-zij__jaar small{display:block;font-family:Cantarell,sans-serif;font-size:10px;color:#8a857f}
.awcf-jg-zij__jaar.is-jubileum::after{content:"";position:absolute;top:4px;right:4px;width:5px;height:5px;border-radius:50%;background:#b08d57}
.awcf-jg-zij__decs.is-extra{margin-top:6px}
/* Gekozen jaar in de zijbalk (filter, 12-11) */
.awcf-jg-zij a.awcf-jg-zij__jaar.is-actief,.awcf-jg-zij a.awcf-jg-zij__jaar.is-actief:hover{background:#504d53;border-color:#504d53;color:#fff}
.awcf-jg-zij a.awcf-jg-zij__jaar.is-actief small{color:#e8dcc8}
