/* Winery page. Profile = hero photo + light-green panel (intro, facts, button to the wines); without a photo the panel spans the
   row and splits into intro | facts on wide screens. Story = long text with the photos beside it (below it on phones).
   Colours are the shop's tokens: #f2f8e6 light green, #546a16 dark green, #5f6b5a muted text. */
.bio-winzer-head__sub { margin: -.25rem 0 1rem; color: #5f6b5a; }
.bio-winzer-head__note { padding: .75rem 1rem; background: #fff7e6; border-radius: 4px; }
.bio-winzer-profile { display: grid; margin-bottom: 2rem; border-radius: 4px; overflow: hidden; background: #f2f8e6; }
.bio-winzer-profile__photo { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.bio-winzer-profile__panel { display: flex; flex-direction: column; justify-content: center; gap: 1.25rem; padding: 1.25rem; }
.bio-winzer-profile__intro { margin: 0; font-size: 1.125rem; line-height: 1.55; }
.bio-winzer-profile__side { display: flex; flex-direction: column; gap: 1.25rem; }
.bio-winzer-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .35rem 1.1rem; margin: 0; }
.bio-winzer-facts dt { color: #546a16; font-weight: 600; }
.bio-winzer-facts dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
/* "und 11 weitere" opens the rest of the list inline (", Weißburgunder, …"); ::details-content is a block by default, which would start the
   rest on a new line (browsers without it still show the list, only on its own line). The gap before the summary is an empty inline-block
   (a wrap opportunity, and not underlined like a space would be) so that the open state does not read "Auxerrois , Weißburgunder". */
.bio-winzer-facts__more { display: inline; }
.bio-winzer-facts__more::details-content { display: inline; }
.bio-winzer-facts__more:not([open])::details-content { display: none; }
.bio-winzer-facts__more summary { display: inline; cursor: pointer; color: #546a16; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
.bio-winzer-facts__more summary::before { content: ""; display: inline-block; width: .3em; }
.bio-winzer-facts__more summary::-webkit-details-marker { display: none; }
.bio-winzer-facts__more[open] summary { display: none; }
.bio-winzer-wines { margin: 0 0 1rem; font-size: 1.375rem; scroll-margin-top: 1rem; }
.bio-winzer-story { margin-top: 2.5rem; }
/* The theme gives .categoryDescription its own margin, divider and padding; inside the story it would start the text lower than the photos. */
.bio-winzer-story .categoryDescription { margin: 0; padding: 0; border: 0; }
/* Legacy admin HTML in category texts (old bodies on keep_body pages, the Alle-Winzer root text): never wider than the screen. */
.categoryDescription img { max-width: 100%; height: auto; }
.categoryDescription table { display: block; max-width: 100%; overflow-x: auto; }
.bio-winzer-aside { display: grid; gap: .75rem; margin-top: 1.5rem; }
.bio-winzer-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .625rem; }
.bio-winzer-gallery img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 4px; }
.bio-winzer-gallery img:first-child, .bio-winzer-gallery img:last-child:nth-child(even) { grid-column: span 2; aspect-ratio: 4 / 3; }
.bio-winzer-credit { margin: .5rem 0 0; font-size: .8rem; color: #5f6b5a; }
@media (max-width: 575.98px) {
  .bio-winzer-profile__intro { font-size: 1rem; }
  .bio-winzer-facts { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .bio-winzer-facts dd { margin-bottom: .5rem; }
}
@media (min-width: 576px) { .bio-winzer-profile__cta { align-self: flex-start; } }
@media (min-width: 768px) { .bio-winzer-profile__panel { padding: 1.75rem 2rem; } }
@media (min-width: 992px) {
  .bio-winzer-profile--photo { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  .bio-winzer-profile--photo .bio-winzer-profile__photo { height: 100%; min-height: 22rem; aspect-ratio: auto; }
  .bio-winzer-profile__panel--split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 2.5rem; align-items: center; }
  .bio-winzer-story--aside { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 3.5rem; align-items: start; }
  .bio-winzer-aside { margin-top: 0; }
}
/* Long text (<div class="bio-cat-text"> inside the theme's #catLongDescLocator): reading width, headings with air. */
.bio-cat-text { max-width: 72ch; }
.bio-cat-text h2 { margin-top: 1.75rem; }
.bio-cat-text h2:first-child { margin-top: 0; }
/* "Alle Winzer" directory (overview) and the winery list of a country page. Colours as above plus #e3e8dc hairline, #c9d8b8 chip border,
   #8eb61e focus green, #f6f9f1 row hover. The tools (search, chips) stay hidden until bio-winzer-overview.js adds is-ready; every group
   is open and every link present without it. */
.bio-winzer-dir [hidden] { display: none !important; }
.bio-winzer-dir__lead { margin: 0 0 1.375rem; color: #5f6b5a; max-width: 62ch; }
.bio-winzer-dir__tools { display: none; }
.bio-winzer-dir.is-ready .bio-winzer-dir__tools { display: grid; gap: .75rem; margin-bottom: 1.75rem; }
.bio-winzer-find { position: relative; display: block; max-width: 460px; margin: 0; }
.bio-winzer-find svg { position: absolute; left: 13px; top: 13px; color: #5f6b5a; pointer-events: none; }
.bio-winzer-find__input { width: 100%; height: 44px; padding: 0 14px 0 40px; font: inherit; color: inherit; border: 1px solid #e3e8dc; border-radius: 4px; background: #fff; }
.bio-winzer-find__input:focus { outline: 2px solid #8eb61e; outline-offset: 1px; border-color: #8eb61e; }
.bio-winzer-dir__chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.bio-winzer-chip { flex: 0 0 auto; padding: .375rem .75rem; font: inherit; font-size: .875rem; line-height: 1.55; color: inherit; background: #fff; border: 1px solid #c9d8b8; border-radius: 999px; cursor: pointer; }
.bio-winzer-chip span { margin-left: .25rem; color: #5f6b5a; }
.bio-winzer-chip[aria-pressed="true"] { color: #fff; background: #546a16; border-color: #546a16; }
.bio-winzer-chip[aria-pressed="true"] span { color: #dfe9c8; }
.bio-winzer-chip:focus-visible { outline: 2px solid #8eb61e; outline-offset: 2px; }
.bio-winzer-dir__label { margin: 0 0 .625rem; font-size: .9375rem; font-weight: 600; color: #546a16; }
.bio-winzer-feats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 2.25rem; }
.bio-winzer-feat { position: relative; display: block; overflow: hidden; border-radius: 4px; aspect-ratio: 4 / 3; color: #fff; text-decoration: none; }
.bio-winzer-feat:hover, .bio-winzer-feat:focus-visible { color: #fff; }
.bio-winzer-feat img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.bio-winzer-feat:hover img { transform: scale(1.03); }
.bio-winzer-feat__cap { position: absolute; inset: auto 0 0 0; padding: 2.5rem 1rem .875rem; background: linear-gradient(to top, rgba(20, 28, 10, .78), rgba(20, 28, 10, 0)); }
.bio-winzer-feat__cap b { display: block; font-size: 1.125rem; }
.bio-winzer-feat__cap small { font-size: .8125rem; opacity: .9; }
.bio-winzer-group { border-top: 1px solid #e3e8dc; }
.bio-winzer-group__summary { display: flex; align-items: center; gap: .75rem; padding: 1rem 0; list-style: none; cursor: pointer; }
.bio-winzer-group__summary::-webkit-details-marker { display: none; }
.bio-winzer-group__summary:focus-visible { outline: 2px solid #8eb61e; outline-offset: 2px; }
.bio-winzer-group__title { margin: 0; font-size: 1.25rem; line-height: 1.3; }
.bio-winzer-group__count { font-size: .875rem; color: #5f6b5a; }
.bio-winzer-faces { display: flex; margin-left: auto; }
.bio-winzer-faces img { width: 28px; height: 28px; margin-left: -8px; border: 2px solid #fff; border-radius: 50%; object-fit: cover; background: #f2f8e6; }
.bio-winzer-group__chev { flex: 0 0 auto; width: 12px; height: 8px; color: #5f6b5a; transition: transform .2s; }
.bio-winzer-group[open] .bio-winzer-group__chev { transform: rotate(180deg); }
.bio-winzer-group__all { margin: -.5rem 0 1.375rem; font-size: .875rem; }
.bio-winzer-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px 20px; margin: 0; padding: 0 0 22px; list-style: none; }
.bio-winzer-list--country { margin-bottom: 1.5rem; }
.bio-winzer-item__link { display: flex; align-items: center; gap: .75rem; margin: 0 -8px; padding: 8px; border-radius: 4px; color: inherit; text-decoration: none; }
.bio-winzer-item__link:hover { color: inherit; background: #f6f9f1; }
.bio-winzer-item__link:focus-visible { outline: 2px solid #8eb61e; }
.bio-winzer-thumb { flex: 0 0 56px; width: 56px; min-width: 56px; height: 56px; border-radius: 4px; background: #f2f8e6; }
img.bio-winzer-thumb { display: block; object-fit: cover; }
span.bio-winzer-thumb { display: grid; place-items: center; font-size: 22px; font-weight: 600; color: #546a16; }
.bio-winzer-item__text { min-width: 0; }
.bio-winzer-item__name { display: block; font-weight: 600; line-height: 1.3; }
.bio-winzer-item__meta { display: block; font-size: .8125rem; line-height: 1.4; color: #5f6b5a; }
.bio-winzer-tag { display: inline-block; margin-left: 4px; padding: 0 5px; font-size: .6875rem; font-weight: 600; color: #546a16; background: #f2f8e6; border-radius: 3px; vertical-align: 1px; }
.bio-winzer-dir__empty { margin: 0; padding: 1.5rem 0; color: #5f6b5a; }
@media (max-width: 1199.98px) { .bio-winzer-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991.98px) {
  .bio-winzer-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bio-winzer-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bio-winzer-feat:nth-child(3) { display: none; }
}
@media (max-width: 575.98px) {
  .bio-winzer-dir__chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(var(--bs-gutter-x, 1.5rem) / -2); padding: 0 calc(var(--bs-gutter-x, 1.5rem) / 2) .25rem; scrollbar-width: none; }
  .bio-winzer-feats { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
  .bio-winzer-feat:nth-child(n + 2) { display: none; }
  .bio-winzer-list { grid-template-columns: minmax(0, 1fr); gap: 0; }
}
@media (prefers-reduced-motion: reduce) { .bio-winzer-feat img, .bio-winzer-group__chev { transition: none; } .bio-winzer-feat:hover img { transform: none; } }
/* Product page: the line sits inside the theme's flex row (.details__info: stock, delivery time, article number) and gets a row of its
   own; scoped with :has() so only product pages that show the line change (the stylesheet is also only added there, see
   views/blocks/details_productmain_artnumber.tpl). */
.details__info:has(> .bio-winzer-link) { flex-wrap: wrap; row-gap: .25rem; }
.bio-winzer-link { flex: 0 0 100%; margin: .25rem 0 0; }
.bio-winzer-link a { text-decoration: underline; text-underline-offset: 2px; }