/*
Theme Name: WR-BW Schulungs·portal
Theme URI: https://wr-bw.de/
Author: Werkstatt·räte Baden-Württemberg
Description: Block-Theme für das Schulungs·portal der Werkstatt·räte Baden-Württemberg. Gestaltung wie wr-bw.de, zwei eigene Seiten, Anmeldung, Abzeichen, Materialien und Kontaktformular kommen aus den A&B-Plugins.
Version: 1.6
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wr-bw-schulung
Tags: block-patterns, full-site-editing, custom-colors, custom-menu, featured-images, wide-blocks
*/
@font-face{font-family:Questrial;src:url('assets/fonts/Questrial-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Questrial Ersatz';src:local('Arial'),local('Helvetica Neue'),local('Helvetica'),local('Liberation Sans');size-adjust:99.67%;ascent-override:82%;descent-override:21%;line-gap-override:0%}
:root{--wr-yellow:#ffd80e;--wr-grey:#f5f5f5;--wr-width:1600px;--wr-gutter:48px;--wr-header-height:160px}
*{box-sizing:border-box}body{margin:0}html{scroll-padding-top:calc(var(--wr-header-height) + 24px)}img{max-width:100%;height:auto}figure{margin:0}button,input,select,textarea{font:inherit}p,h1,h2,h3{overflow-wrap:break-word}a{text-underline-offset:.2em}:focus-visible{outline:3px solid #000;outline-offset:5px;box-shadow:0 0 0 7px #ffd80e}[hidden]{display:none!important}
.wp-site-blocks>*{margin-block-start:0}.wr-container{width:100%;max-width:calc(var(--wr-width) + 2*var(--wr-gutter));margin-inline:auto!important;padding-inline:var(--wr-gutter)}
/* Nativer, bearbeitbarer Header. Das Kleben laesst Platz fuer die WordPress-Leiste. */
header.wp-block-template-part:has(.wr-header){position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:100}
.wr-header{background:#fff;padding-block:40px}.wr-header-yellow{background:var(--wr-yellow)}.wr-header-compact{padding-block:16px}.wr-header-row{gap:24px;min-height:0}.wr-logo{width:256px;flex-shrink:0;margin:0}.wr-logo a{display:block}.wr-logo img{display:block;width:100%;height:auto;object-fit:contain;object-position:left}.wr-header-actions{gap:0}.wr-header-actions>p{display:none}.wr-header-compact .wr-logo{width:192px}
.wr-accessibility-links{position:fixed;left:0;top:calc(150px + var(--wp-admin--admin-bar--height,0px));background:#000;z-index:-1;padding:4px;width:52px;margin:0!important}.wr-accessibility-links figure{margin:0}.wr-accessibility-links a{display:flex;width:44px;height:56px;align-items:center;justify-content:center}.wr-accessibility-links img{filter:invert(1);width:24px;height:24px;object-fit:contain}
/* Dialog, Tastaturbedienung und Fokusfuehrung von WordPress bleiben. Nur das Aussehen aendert sich. */
.wr-navigation .wp-block-navigation__responsive-container-open{background:#000;color:#fff;border-radius:50%;padding:12px;width:56px;height:56px;align-items:center;justify-content:center;position:relative}
.wr-navigation .wp-block-navigation__responsive-container-open svg{visibility:hidden;width:32px;height:32px}
.wr-navigation .wp-block-navigation__responsive-container-open:after{content:'';position:absolute;width:24px;height:2px;top:27px;left:16px;background:currentColor;box-shadow:0 -8px currentColor,0 8px currentColor}
.wr-navigation .wp-block-navigation__responsive-container.is-menu-open{background:#fff!important;color:#000!important;padding:32px 24px!important;overflow-y:auto}
.wr-navigation .wp-block-navigation__responsive-close{max-width:none;width:100%}
.wr-navigation .is-menu-open .wp-block-navigation__responsive-dialog{min-height:calc(100dvh - 64px - var(--wp-admin--admin-bar--height,0px));display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0!important;gap:0}
.wr-navigation .is-menu-open .wp-block-navigation__responsive-container-content{padding:0!important;align-items:center;gap:0;order:1;width:100%}
.wr-navigation .is-menu-open .wp-block-navigation__container{gap:16px!important;align-items:center!important;justify-content:center;width:100%}
.wr-navigation .is-menu-open .wp-block-navigation-item{font-size:24px;line-height:36px;align-items:center}
.wr-navigation .is-menu-open .wp-block-navigation-item__content{padding:8px 12px!important;border:2px solid transparent;border-radius:100px;text-decoration:none;text-align:center}
.wr-navigation .is-menu-open .wp-block-navigation-item__content[aria-current=page]{background:var(--wr-yellow);border-color:#c9aa09}
.wr-navigation .is-menu-open .wp-block-navigation__responsive-container-close{position:static;order:2;display:flex;align-items:center;gap:8px;padding:16px 24px;margin:32px 0 0;background:#000;color:#fff;border:0;border-radius:100px;font-size:27px;line-height:36px;flex-shrink:0}
.wr-navigation .wp-block-navigation__responsive-container-close svg{width:32px;height:32px;order:2}.wr-menu-close-label{order:1}.wr-section{margin-block:0}
.wr-two-col{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}.wr-two-col>*{min-width:0;margin-block:0!important}.wr-section{padding-block:64px}.wr-section-grey{background:var(--wr-grey)}.wr-section h2,.wr-contact h2{margin-top:0}.wr-section-art img{width:100%;max-height:380px;object-fit:contain}
.wp-block-buttons{gap:24px}.wp-block-button__link{border:2px solid transparent;transition:background-color .15s,color .15s}.wp-block-button__link:hover{background:#545454}.wr-area-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:32px}
.wr-area-grid>*{margin-block:0!important}.wr-tile{position:relative;border:2px solid #000;border-radius:24px;padding:32px;background:#fff}.wr-tile-icon{height:120px;margin:0 0 32px}.wr-tile-icon img{height:100%;width:120px;object-fit:contain;object-position:left}.wr-tile h3{margin:0 0 16px}.wr-tile h3 a{text-decoration:none}.wr-tile h3 a:after{content:'';position:absolute;inset:0;border-radius:24px}.wr-tile p{margin-bottom:0}
.wr-contact{padding-block:64px;background:var(--wr-yellow)}
/* Abstand des Fusses zum Inhalt, gemessen an wr-bw.de: Dort traegt der Fuss
   margin-top 64, unter 476 px 192. Ohne diese Zeile schiebt sich ein
   Abschnitt mit .undo-section-gap (margin-bottom -64) um 64 px ueber den
   gelben Bereich — auf der Seite Beitraege sichtbar als abgeschnittene
   Ueberschrift. Der Fuss holt den Abstand zurueck, den der Abschnitt
   wegnimmt. */
footer.wp-block-template-part{margin-top:64px}.wr-contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;align-items:start}.wr-contact-grid>*{margin:0!important}.wr-contact h3{margin-top:24px}.wr-contact-grid>div:last-child h3{margin-top:0}.wr-contact .wp-block-buttons{margin-top:48px}.wr-contact-illustration{width:auto}.wr-contact-illustration img{width:100%;max-height:400px;object-fit:contain}.wr-contact p{margin-top:24px}
.wr-footer-dark{padding-block:80px 48px;background:#000;color:#fff}.wr-footer-dark a,.wr-footer-dark h3{color:#fff}.wr-footer-grid{display:grid;grid-template-columns:1.1fr .9fr 1.15fr;gap:64px;align-items:start}.wr-footer-grid>*{margin:0!important}.wr-footer-grid h3{margin:0 0 32px}.wr-footer-dark .wp-block-buttons{align-items:flex-start;gap:12px}.wr-footer-dark .wp-block-button__link{background:#fff;color:#000;border:2px solid #878787;padding:8px 12px;font-size:24px;line-height:36px;text-align:left}.wr-footer-dark .wp-block-button__link:hover{background:#fff;border-color:#000}.wr-footer-signature p{word-spacing:.25em;margin-top:24px}.wr-footer-compact{padding-block:32px}.wr-footer-compact p{margin-block:.5rem}.wr-footer-dark :focus-visible{outline-color:#fff}
.wr-main{padding:64px var(--wr-gutter);min-height:50vh}.wr-main>.alignwide{max-width:var(--wr-width)!important}.wr-main>.wp-block-post-content{width:100%}.wr-main:has(>.wp-block-post-content.is-layout-flow){padding:0;max-width:none}.wr-main:has(>.wp-block-post-content.is-layout-flow)>.wp-block-post-content{max-width:none!important}.wr-notice,.is-style-wr-hinweis{border:3px solid var(--wr-yellow);padding:28px}.wr-library-image{max-width:600px}.wr-library-image img{max-height:500px;object-fit:contain}.wp-block-details{border-block:1px solid #000;padding:20px 0}.wp-block-details summary{cursor:pointer}.wp-block-search__input{min-width:0;border:2px solid #000;padding:12px}.wp-block-search__button{background:#000;color:#fff;border:0;border-radius:30px;padding:12px 20px}.wp-block-post-content>p,.wp-block-post-content>h2,.wp-block-post-content>h3{max-width:820px}
@media(max-width:1023px){:root{--wr-gutter:32px;--wr-header-height:96px}.wr-header{padding-block:16px}.wr-logo{width:192px}.wr-footer-grid{grid-template-columns:1fr 1fr;gap:48px}.wr-footer-signature{grid-column:1/-1;max-width:390px;width:100%}}
@media(max-width:767px){:root{--wr-gutter:16px;}.wr-header-row{gap:16px}.wp-block-button__link{font-size:20.25px;line-height:27px;padding:16px}.wr-two-col,.wr-area-grid{grid-template-columns:1fr}.wr-section,.wr-contact{padding-block:48px}.wr-area-grid{gap:24px}.wr-tile{padding:24px}.wr-tile-icon{height:100px;margin-bottom:24px}.wr-contact-grid,.wr-footer-grid{grid-template-columns:1fr}.wr-contact-grid>div:last-child,.wr-footer-signature{grid-column:auto}.wr-footer-dark{padding-block:48px}.wr-footer-dark .wp-block-button__link{font-size:18px;line-height:27px;overflow-wrap:anywhere}.wr-footer-grid h3{margin-bottom:24px}.wr-footer-signature p{word-spacing:0}.wp-block-post-template.is-layout-grid{grid-template-columns:1fr!important}.wp-block-search__inside-wrapper{flex-wrap:wrap;gap:10px}.wp-block-search__button{margin-left:0}.wr-main{padding-block:40px}.wr-navigation .is-menu-open .wp-block-navigation__container{gap:12px!important}.wr-navigation .is-menu-open .wp-block-navigation-item{font-size:20px;line-height:27px}.wr-navigation .is-menu-open .wp-block-navigation__responsive-container-close{font-size:20.25px;line-height:27px;padding:16px;margin-top:40px}.wr-navigation .wp-block-navigation__responsive-container-close svg{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{.wr-header,.wr-footer-dark{display:none!important}.wr-section,.wr-contact{padding-block:20px;background:#fff!important}.wr-two-col{gap:24px}}
.editor-styles-wrapper{font-family:Questrial,'Questrial Ersatz',sans-serif}.editor-styles-wrapper .wr-header-row{display:flex}.editor-styles-wrapper .wr-container{max-width:100%}.editor-styles-wrapper .wr-accessibility-links{position:static;display:flex;width:auto;z-index:auto}
@media(max-width:1280px){
 .wr-navigation .wp-block-navigation__responsive-container:not(.is-menu-open){display:none!important}
 .wr-navigation .wp-block-navigation__responsive-container-open{display:flex!important}}
@media(min-width:1281px){
 :root{--wr-gutter:64px}
 .wp-site-blocks{max-width:1680px;margin-inline:auto}
 .wr-navigation .wp-block-navigation__responsive-container-open{display:none!important}
 .wr-navigation .wp-block-navigation__responsive-container:not(.is-menu-open){display:block!important}
 .wr-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-close{display:none}
 .wr-navigation .wp-block-navigation__container{flex-wrap:nowrap;gap:16px;align-items:center}
 .wr-navigation .wp-block-navigation-item{font-size:24px;line-height:36px;white-space:nowrap}
 .wr-navigation .wp-block-navigation-item__content{display:block;padding:8px 12px;border:2px solid transparent;border-radius:100px;text-decoration:none}
 .wr-navigation .wp-block-navigation-item__content[aria-current=page]{background:var(--wr-yellow);border-color:#c9aa09}
 .wr-navigation .wp-block-navigation-item__content:not([aria-current=page]):hover{border-color:#888}}
@media(min-width:1680px){:root{--wr-gutter:96px}}

/* Footer wie im Original: umbrechende Menuegruppen und das vierteilige Zeichen. */
.wr-footer-grid{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:64px 160px}
.wr-footer-menus{display:flex;flex:1 1 auto;gap:96px}
.wr-footer-menus>*{margin:0!important}
.wr-footer-grid h3{font-size:27px;line-height:1.3;margin:0 0 32px}
.wr-footer-dark .wp-block-button__link{display:flex;align-items:center;gap:8px;white-space:nowrap}
.wr-footer-arrow{width:.85em!important;height:.85em!important;object-fit:contain}
.wr-footer-grid>.wr-footer-signature{display:flex;flex:0 1 auto;align-items:flex-end;justify-content:center;gap:16px;max-width:none;width:auto;margin:0!important}
.wr-footer-word{display:flex;flex-direction:column;align-items:center;gap:16px;min-width:0}
.wr-footer-word .wr-footer-mark-box{height:104px;display:flex;align-items:center;width:80px}
.wr-footer-mark{margin:0!important;width:104px;flex-shrink:0}
.wr-footer-mark img{display:block;width:104px;max-width:none;height:104px;object-fit:contain}
.wr-footer-word-dot .wr-footer-mark-box{width:auto;justify-content:center}
.wr-footer-word-dot .wr-footer-mark{width:20px;margin-top:16px!important}
.wr-footer-word-dot .wr-footer-mark img{width:20px;height:20px}
.wr-footer-signature .wr-footer-word p{font-size:24px;line-height:36px;word-spacing:normal;margin:0;white-space:nowrap}
.wr-footer-word p a{text-decoration:none}
.wr-contact{background:#ffd70f}
.wr-contact-illustration img{max-height:none}

.wr-contact-grid>div:last-child{padding-bottom:24px}
.wr-contact-grid>div:first-child h2{white-space:nowrap}
@media(max-width:1280px){.wr-footer-menus{gap:64px}}
@media(max-width:767px){.wr-footer-menus{flex-wrap:wrap;max-width:576px}.wr-footer-dark{padding-block:80px 48px}.wr-footer-dark .wp-block-button__link{font-size:20.25px;line-height:27px}.wr-footer-signature .wr-footer-word p{font-size:18px;line-height:27px}.wr-contact{padding-block:64px}.wr-contact-grid{grid-template-columns:1fr}.wr-contact-grid>div:last-child{grid-column:auto}.wr-contact-grid>div:first-child h2{white-space:normal}}
@media(max-width:475px){.wr-footer-grid>.wr-footer-signature{flex-direction:column;align-items:stretch;gap:24px}.wr-footer-word{flex-direction:row;gap:0}.wr-footer-word .wr-footer-mark-box{width:120px}.wr-footer-word-dot .wr-footer-mark-box{width:120px;height:16px}.wr-footer-word-dot .wr-footer-mark{width:16px;margin-top:0!important;margin-left:-25%!important}.wr-footer-word-dot .wr-footer-mark img{width:16px;height:16px}.wr-contact-illustration{width:83.333333%}}

/* Rechts bleibt derselbe Freiraum wie im Header des Originals. */
@media(min-width:1281px){.wr-header-row{gap:0}.wr-header-actions{margin-right:36px!important}}
html{scroll-padding-top:var(--wr-header-height)}
.wr-contact .wp-block-button__link{display:flex;align-items:center;gap:8px;font-size:27px;line-height:36px;padding:16px 24px;border-color:#000}
@media(max-width:1024px){.wr-contact .wp-block-button__link{font-size:22.5px;line-height:30px;padding:16px 24px}}
@media(max-width:475px){.wr-contact .wp-block-button__link{font-size:20.25px;line-height:27px;padding:12px 16px}}
.wr-contact-arrow{width:.85em!important;height:.85em!important;filter:invert(1)}
.wr-contact a[href^="tel:"]{text-decoration:none}

@media(max-width:1024px){.wr-header{padding-block:16px}.wr-logo{width:224px}.wr-header-compact .wr-logo{width:192px}}
@media(max-width:1024px){:root{--wr-gutter:40px;--wr-header-height:102.45px;--wp--preset--font-size--medium:20px;--wp--preset--font-size--large:22.5px;--wp--preset--font-size--x-large:30px;--wp--preset--font-size--xx-large:40px}.wr-footer-grid h3{font-size:22.5px}.wr-footer-dark .wp-block-button__link{font-size:20px;line-height:30px}.wr-footer-signature .wr-footer-word p{font-size:20px;line-height:30px}}
@media(max-width:768px){:root{--wr-gutter:24px}.wr-footer-menus{flex-wrap:wrap;max-width:576px}.wr-contact-grid{grid-template-columns:1fr}.wr-contact-grid>div:last-child{grid-column:auto}}
@media(max-width:475px){:root{--wr-gutter:16px;--wr-header-height:92.39px;--wp--preset--font-size--medium:18px;--wp--preset--font-size--large:20.25px;--wp--preset--font-size--x-large:24px;--wp--preset--font-size--xx-large:36px}.wr-logo{width:192px}.wr-footer-grid h3{font-size:20.25px}.wr-footer-dark .wp-block-button__link{font-size:20px;line-height:27px}.wr-footer-signature .wr-footer-word p{font-size:18px;line-height:27px}}


/* Icon-Spalte: Masse und Sichtbarkeit wie im Original. Unter 1025 Pixeln
   ist der Kasten schmaler und das Polster halb so gross; unter 769 Pixeln
   zeigt das Original die Spalte gar nicht mehr. */
@media(max-width:1024px){.wr-accessibility-links{top:calc(142px + var(--wp-admin--admin-bar--height,0px));padding:2px;width:44px}.wr-accessibility-links a{width:40px;height:50px}.wr-accessibility-links img{width:20px;height:20px}}
@media(max-width:768px){.wr-accessibility-links{display:none}}
/* Deckel der Kontakt-Illustration, gemessen an der Vorlage: ueber 1024 keiner
   (die Grafik fuellt ihre Spalte), ab 1024 abwaerts 320, ab 768 abwaerts 256.
   Steht am Dateiende, weil die Stufen nicht zu den umgebenden Bloecken passen. */
/* Einzug wie in der Vorlage, dort an zwei Stellen: der Rahmen rueckt zwischen
   1025 und 1280 um 24 nach rechts, das Bild selbst ueber 1280 um 16 nach links.
   Das !important muss sein, weil .wr-contact-grid>* alle Aussenabstaende nullt. */
@media(min-width:1025px) and (max-width:1280px){.wr-contact-illustration{margin-left:24px!important}}
@media(min-width:1281px){.wr-contact-illustration img{margin-left:-16px}}
@media(max-width:1024px){.wr-contact-illustration{max-width:320px}}
@media(max-width:768px){.wr-contact-illustration{max-width:256px}}
/* Spalten des Kontaktbereichs, gemessen an der Vorlage: ueber 1024 drei Spalten,
   von 1024 bis 769 zwei (Grafik und Anschrift stehen uebereinander in der zweiten),
   ab 768 abwaerts eine. Die 1024er Stufe muss vor der 768er stehen. */
@media(max-width:1024px){.wr-contact-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}.wr-contact-grid>div:last-child{grid-column:2}}
@media(max-width:768px){.wr-contact-grid{grid-template-columns:1fr}.wr-contact-grid>div:last-child{grid-column:auto}}
@media(max-width:475px){footer.wp-block-template-part{margin-top:192px}}

/* „Cookie-Einstellungen“ zweizeilig: der Text bricht am Bindestrich um, damit der Fuß (fast) wie im Original umbricht.
   Raster statt Flex: Chrome zählt den Abstand zum Pfeil bei min-content in einem Flex-Knopf nicht mit, der Pfeil ragte 8 px hinaus.
   word-break:normal: WordPress setzt am Knopf bis Blockstile 10 word-break:break-word, ab 11 overflow-wrap:anywhere. Beides erlaubt
   einen Umbruch nach jedem Buchstaben, und min-content wird dann einen Buchstaben breit. */
.wr-footer-dark .wr-recht-cookies .wp-block-button__link{display:grid;grid-template-columns:min-content auto;column-gap:8px;width:max-content;white-space:normal;overflow-wrap:normal;word-break:normal}
