/* G-STOFF · Gutenberg-Blöcke im Look des Entwurfs
   Startseite und Inhaltsseiten bestehen aus normalen Blöcken (Gruppe,
   Überschrift, Absatz, Bild, Liste, Knöpfe) mit den Klassen des Entwurfs.
   Hier steht, was das Block-Markup anders macht als der Entwurf:
   figure um Bilder, p statt span, strong statt b, Knöpfe als Block. */

/* ---------- Grundlagen ---------- */
.wp-block-group{box-sizing:border-box}
.wp-block-image{margin:0}
.wp-block-image img{height:auto;vertical-align:bottom}
.wp-block-image figcaption,.wp-element-caption{margin:0}
.kontur{color:transparent;-webkit-text-stroke:2px var(--gelb);text-stroke:2px var(--gelb)}
.auf-hell .kontur,.auf-gelb .kontur{-webkit-text-stroke-color:var(--schwarz)}
span.gelb{color:var(--gelb)}
span.zusammen{white-space:nowrap}
.auf-gelb span.gelb{color:var(--schwarz);background:var(--gelb)}

/* ---------- Knöpfe (Block „Buttons“) ---------- */
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.wp-block-buttons > .wp-block-button{margin:0}
.wp-block-button .wp-block-button__link{display:inline-flex;align-items:center;gap:.6em;border:0;cursor:pointer;text-decoration:none;
  font-family:var(--display);font-size:24px;font-weight:400;letter-spacing:.04em;line-height:1;padding:17px 26px 14px;
  background:var(--gelb);color:var(--schwarz);border-radius:0;box-shadow:none;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));
  transition:transform .25s var(--ease),background .2s}
.wp-block-button .wp-block-button__link:hover{transform:translate(-2px,-2px);background:#fff;color:var(--schwarz)}
.wp-block-button.is-style-dunkel .wp-block-button__link{background:var(--schwarz);color:var(--gelb)}
.wp-block-button.is-style-dunkel .wp-block-button__link:hover{background:#262626;color:var(--gelb)}
.wp-block-button.is-style-linie .wp-block-button__link,
.wp-block-button.is-style-linie-pfeil .wp-block-button__link{background:transparent;color:var(--text);box-shadow:inset 0 0 0 2px currentColor;clip-path:none}
.wp-block-button.is-style-linie .wp-block-button__link:hover,
.wp-block-button.is-style-linie-pfeil .wp-block-button__link:hover{background:var(--text);color:var(--schwarz)}
.auf-hell .wp-block-button.is-style-linie .wp-block-button__link,.auf-gelb .wp-block-button.is-style-linie .wp-block-button__link,
.auf-hell .wp-block-button.is-style-linie-pfeil .wp-block-button__link,.auf-gelb .wp-block-button.is-style-linie-pfeil .wp-block-button__link{color:var(--schwarz)}
.wp-block-button.is-style-pfeil .wp-block-button__link::after,
.wp-block-button.is-style-linie-pfeil .wp-block-button__link::after{content:"→";font-family:var(--sans);font-weight:700;font-size:.8em;transform:translateY(-1px)}

/* ---------- Startbühne ---------- */
.hero h1{color:var(--gelb)}
.hero .label{margin-top:0}
.hero .hero-fuss > p{margin:0}

/* ---------- Auszeichnungen ---------- */
.gold .label,.geschichte .label,.destille .label{color:var(--gelb)}
.medaillen > .wp-block-image{position:absolute;width:52%;filter:drop-shadow(0 24px 30px rgba(0,0,0,.6));transition:transform .6s var(--ease)}
.medaillen > .wp-block-image img{position:static;width:100%;filter:none;transform:none!important}
.medaillen > .wp-block-image:nth-child(1){left:0;top:4%;transform:rotate(-8deg)}
.medaillen > .wp-block-image:nth-child(2){left:40%;top:0;transform:rotate(6deg);width:46%}
.medaillen > .wp-block-image:nth-child(3){left:22%;top:42%;transform:rotate(-2deg);width:48%}
.medaillen:hover > .wp-block-image:nth-child(1){transform:rotate(-14deg) translate(-10px,-6px)}
.medaillen:hover > .wp-block-image:nth-child(2){transform:rotate(12deg) translate(12px,-8px)}
.medaillen:hover > .wp-block-image:nth-child(3){transform:rotate(3deg) translateY(10px)}
.gold li strong{color:var(--gelb);font-weight:600;min-width:62px}
.gold .wp-block-heading + p{margin-top:22px}

/* ---------- Versuchsanleitung ---------- */
.versuch .bild > .wp-block-image{position:absolute;inset:0}
.versuch .bild .stempel{margin:0;z-index:2}
.protokoll .kopfdaten > div > p{margin:0}
.protokoll .kopfdaten > div > p:first-child{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:#55554E}
.protokoll .kopfdaten > div > p:last-child{font-weight:700;font-size:15px;line-height:27.2px}
.protokoll > .label{margin-bottom:6px}
.protokoll .checkliste + .label{margin-bottom:10px}
.checkliste li:not(:has(label)){padding:10px 0;font-weight:500}

/* ---------- Geschichte ---------- */
.pinnwand > .wp-block-image{margin:0}
.pinnwand > .wp-block-image figcaption{position:absolute;left:12px;bottom:12px;margin:0;text-align:left}
.zeitleiste strong{font-family:var(--display);font-size:26px;font-weight:400;color:var(--gelb);letter-spacing:.03em;line-height:1.1}
.geschichte .wp-block-buttons{margin-top:0}

/* ---------- Destillerie ---------- */
.destille > .wp-block-image{position:absolute;inset:0;z-index:-2}
.destille > .wp-block-image img{width:100%;height:100%;object-fit:cover}
.destille .fakten > div > p{margin:0}
.destille .fakten > div > p:first-child{display:block;font-family:var(--display);font-size:52px;font-weight:400;line-height:.9;color:var(--gelb)}
.destille .fakten > div > p:last-child{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase}

/* ---------- Inhaltsseiten ---------- */
.textseite > .wp-block-group,.textseite > .wp-block-columns{margin-bottom:28px}
.textseite .wp-block-table table{width:100%;border-collapse:collapse;font-size:15px}
.textseite .wp-block-table th,.textseite .wp-block-table td{border:1px solid var(--linie);padding:10px 12px;text-align:left;vertical-align:top}
.textseite .wp-block-table th{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;background:var(--graphit)}
.textseite .wp-block-separator{border:0;border-top:1px solid var(--linie);margin:40px 0}
.textseite .wp-block-buttons{margin:24px 0}
.textseite .wp-block-image{margin:28px 0}
.textseite .wp-block-quote{margin:28px 0;padding:6px 0 6px 20px;border-left:3px solid var(--gelb);font-size:19px}
.textseite .wp-block-columns{display:flex;gap:28px;flex-wrap:wrap}
.textseite .wp-block-column{flex:1 1 260px}

@media (max-width:860px){
  .destille > .wp-block-image{position:relative;inset:auto;height:340px}
  .destille > .wp-block-image img{height:340px}
}
@media (max-width:560px){
  .hero-fuss .knoepfe > .wp-block-button{flex:1}
  .hero-fuss .knoepfe .wp-block-button__link{width:100%;justify-content:center;font-size:21px;padding:15px 14px 12px}
}

/* ---------- Geschichte, Kontakt ---------- */
.person{background:var(--graphit)}
.person img{width:100%;aspect-ratio:4/3.2;object-fit:cover}
.person figcaption{padding:16px 18px;display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-2)}
.person figcaption strong{font-family:var(--display);font-size:36px;font-weight:400;line-height:1;letter-spacing:.01em;color:var(--text)}
.lange-geschichte .zeitleiste{margin-top:30px}
.destille .abstand-oben{margin-top:14px}
.kontakt-raster{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px)}
.kontakt-raster .breit{font-size:22px;margin-bottom:10px}
.kontakt-raster .adresse{font-size:19px;line-height:1.7;margin:0}
.kontakt-raster .wp-block-buttons{margin-top:24px}
.kontakt-raster .hinweis{font-size:14px;margin-top:16px}
.wp-block-image.umrandet img{width:100%;border:3px solid var(--gelb)}
@media (max-width:860px){.kontakt-raster{grid-template-columns:1fr}}