/*   
Theme Name: FKuebler
Theme URI: https://fkuebler.de
Description: Minimalistisches Template
Author: Frank Kübler
Author URI: https://fkuebler.de
*/

@font-face {
  font-display: swap;
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  src: url('assets/fonts/work-sans-v23-latin-regular.woff2') format('woff2');
}

@font-face {
  font-display: swap;
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  src: url('assets/fonts/work-sans-v23-latin-700.woff2') format('woff2');
}


:root {
    --text-size-standard:16px;
    --text-color:#1E1E1E;
    --text-color-2:#AE8F61;
    --text-size-small:14px;
    --text-size-h1:56px;
    --text-size-h2:48px;
    --text-size-h3:28px;
    --text-size-h4:24px;
    --line-height-headline:1;
    --line-height-headline-2:1.2;
    --padding-inner:16px;
    --hover-bgcolor:#F1EDE3;
    --footer-bgcolor:#F1EDE3;
    --color-5:#F1EDE3;
}
@media (min-width:1024px) {
    :root {
        --text-size-standard:20px;
        --text-size-h1:96px;
        --text-size-h2:72px;
        --text-size-h3:32px;
        --text-size-h4:28px;
    }
}

::selection { background-color:var(--color-5); }
.has-accent-3-background-color ::selection { background-color:#E2DAC6; }

* { box-sizing:border-box; scroll-margin-top:100px; }
html { scroll-behavior:smooth; }
body { font-family:'Work Sans',sans-serif; color:var(--text-color); font-weight:400; font-size:var(--text-size-standard); line-height:1.4; margin:0; padding:0; }

/* some backend styles */
#adminmenumain,
.components-dropdown__content,
.components-popover__content,
.interface-interface-skeleton__sidebar { font-size:13px; }
.editor-visual-editor__post-title-wrapper { margin-top:0; }
.editor-visual-editor__post-title-wrapper .wp-block-post-title { font-family:'Work Sans',sans-serif; font-size:18px; padding:min(5vw,50px); margin-bottom:0; }
.editor-visual-editor__post-title-wrapper .wp-block-post-title::before { content: 'Seitentitel: '; }
.is-root-container > .wp-block-group { padding-top:min(10vw,64px); padding-bottom:min(10vw,64px);  }
.block-editor-block-list__layout.is-root-container > .wp-block-group > * { max-width:min(90%,1008px); margin-left:auto; margin-right:auto; }

h1 { margin:0 0 min(10vw,64px) 0; font-size:var(--text-size-h1); font-weight:700; line-height:var(--line-height-headline); hyphens:auto; }
h2 { margin:0 0 min(5vw,32px) 0; font-size:var(--text-size-h2); font-weight:700; line-height:var(--line-height-headline); hyphens:auto; }
h3 { margin:0 0 min(5vw,32px) 0; font-size:var(--text-size-h3); font-weight:700; line-height:var(--line-height-headline); hyphens:auto; }
:is(p:not(.has-small-font-size),ul,ol) + :is(h1,h2,h3) { margin-top:min(10vw,64px); }
h4,h5,h6 { margin:0 0 8px 0; font-weight:700; font-size:var(--text-size-h4); line-height:var(--line-height-headline-2); }
:is(p:not(.has-small-font-size),ul,ol) + :is(h4,h5,h6) { margin-top:min(5vw,32px); }
figure + h4 { margin-top:16px; }
.has-small-font-size,
.overline { margin-bottom:8px; color:var(--text-color-2); font-size:var(--text-size-small); font-weight:800; letter-spacing:1.4px; text-transform:uppercase; }
p + .wp-block-buttons,
.wp-block-columns h4 + p:not(.has-small-font-size),
h4+ul,
h4+ol { margin-top:15px; }
@media (min-width:1024px) {
    p + .wp-block-buttons,
    .wp-block-columns h4 + p:not(.has-small-font-size),
    h4+ul,
    h4+ol { margin-top:32px; }
}
img { vertical-align:top; height:auto; max-width:100%; }
a,
a:visited { color:var(--text-color); text-underline-offset:20%; text-decoration-thickness:2px; text-decoration-line:underline; }
a:hover { color:var(--text-color-2); text-underline-offset:20%; text-decoration-thickness:2px!important; text-decoration-line:underline; }
p { margin:0 0 15px 0; }
p:last-child { margin-bottom:0; }
b,strong { font-weight:700; }
hr { border:0; border-top:solid 2px var(--text-color); margin:40px 0; }
.wp-block-list li + li { margin-top:12px; }

.contentWidth { width:min(90%,1280px); margin-left:auto; margin-right:auto; position:relative; }

/* Header - Logo - Navigation */
.pageHeader { position:fixed; background-color:#fff; box-shadow:rgba(0,0,0,0) 0 1px 3px; top:0; left:0; width:100%; max-height:100dvh; overflow:auto; z-index:100; }
.pageHeader .logo { padding:16px 0; margin-left:5%; display:inline-block; }
.pageHeader .logo img { height:48px; width:auto; }
.pageHeader .logo::after { content:''; display:block; height:34px; width:100%; background-color: #57B4BA; position:absolute; top:22px; left:0; z-index:-1; }

#mobileOpener { display:inline-block; height:60px; width:60px; position:absolute; top:19px; right:calc(5% - 14px); vertical-align:bottom; cursor:pointer; }
#mobileOpener span,
#mobileOpener span:after,
#mobileOpener span:before { display:block; width:30px; height:3px; border-radius:2px; background-color:var(--text-color); position:absolute; transition:0.3s ease; }
#mobileOpener span { top:20px; left:15px; }
#mobileOpener span:after { content:''; top:-8px; left:0; }
#mobileOpener span:before { content:''; top:8px; left:0; }
#mobileOpener.open span { transform:rotate(-45deg); transition:0.3s ease; }
#mobileOpener.open span:after { transform:rotate(-90deg); top:0; }
#mobileOpener.open span:before { opacity:0; }
#mobileOpener::after { content:''; display:block; height:54px; width:54px; border-radius:50%; background-color:#fff; position:absolute; top:-5px; left:3px; z-index:-1; }

#mainNavi { font-weight:600; font-size:var(--text-size-small); line-height:24px; }
#mainNavi a { color:var(--text-color); }

@media (max-width: 1023px) {
    .pageHeader { transition:all 1.5s; }
    .pageHeader .contentWidth { width:100%; }
    #mainNavi { display:none; font-size:22px; text-align:center; background-color:#fff; height:calc(100dvh - 80px); }
    #mainNavi > div > ul { list-style-type:none; margin:0; padding:32px 0 0 0; }
    #mainNavi > div > ul li { display:block; }
    #mainNavi > div > ul > li { padding-bottom:10px; }
/*    #mainNavi > div > ul > li.page_item_has_children::after { position:absolute; top:15px; right:15px; content:''; display:block; width:16px; height:16px; background:url(assets/images/chevron-down-lightgrey.svg) center / contain; transition:all 0.5s; }
    #mainNavi > div > ul > li.active.page_item_has_children::after { transform:rotate(180deg); }*/
    #mainNavi > div > ul a { display:block; padding:12px 5%; text-decoration:none; }
    #mainNavi > div > ul > li > ul { padding:0 0 10px 0; font-weight:normal; font-size:18px; }
    #mainNavi > div > ul ul a { padding:8px 0 8px 15px; }
    #mainNavi > div > ul > li.current_page_item:not(.hasSub) > a,
    #mainNavi > div > ul ul li.current_page_item > a { text-decoration-line:underline; text-underline-offset:4px; text-decoration-thickness:2px; }

    #langNavi { background-color:#f4f4f4; list-style-type:none; margin:0; padding:25px 20px; font-weight:normal; }
    #langNavi li + li { margin-top:15px; }
    #langNavi .current-lang { opacity:0.2; }
}

@media (min-width:1024px) {
    .pageHeader { height:112px; overflow:visible; background-color:unset; }
    .pageHeader .logo { position:absolute; top:2px; padding:0; margin:0; }
    .pageHeader .logo img { height:106px; }
    .pageHeader .logo::after { position:fixed; top:21px; height:56px; border-top:solid 6px #FE4F2D; border-bottom:solid 6px #FE4F2D; box-shadow:0 -9px 40px 3px white; }

    #mobileOpener { display:none; }
    #mainNavi { display:block!important; }
    #mainNavi > div > ul { display:flex!important; justify-content:flex-end; list-style-type:none; padding:44px 0 0 0; width:min(60vw,920px); margin:0 0 0 auto; }
    #mainNavi > div > ul > li { position:relative; }
    #mainNavi > div > ul > li > a { cursor:pointer; line-height:24px; font-size:18px; padding:10px 20px; white-space:nowrap; text-decoration:none; text-shadow:0 0 30px white; }
    #mainNavi > div > ul > li.current_page_item > a { text-decoration-line:underline; text-underline-offset:4px; text-decoration-thickness:2px; }
    #mainNavi > div > ul > li > a:hover { background-color:#FDFBEE; }
    
    #mainNavi > div > ul ul { list-style-type:none; margin:0; padding:0; }
    #mainNavi .sub-menu { display:none; position:absolute; background-color:#FDFBEE; top:30px; left:0; width:245px; z-index:10; }
    #mainNavi > div li.page_item_has_children.showSub .children,
    #mainNavi .menu-item-has-children:hover > .sub-menu { display:block; }
    #mainNavi .sub-menu a { padding:15px 18px; display:block; line-height:22px; font-size:17px; text-decoration:none; }
    #mainNavi a:hover,
    #mainNavi .sub-menu .current_page_item > a { text-decoration:underline; }

    #langNavi { position:absolute; top:-2px; right:20px; list-style-type:none; margin:0; padding:0; font-weight:normal; }
    #langNavi li { display:inline-block; }
    #langNavi li + li { margin-left:15px; }
    #langNavi .current-lang { opacity:0.2; }
    #langNavi a { text-decoration:none; }
}
@media (min-width: 1180px) {
    #mainNavi > div { gap:20px; }
    #mainNavi > div > li > a { padding:12px 18px; }
}

.breadcrumb { margin-top:78px; display:block; width:100%; font-size:13px; }
.breadcrumb { line-height:20px; }
.breadcrumb .icon { display:inline-block; transform:translate(0,4px); }
.breadcrumb .icon svg { margin:0 5px; vertical-align:top; height:13px; }
.breadcrumb a { display:inline-block; padding:20px 0; }
.breadcrumb a,
.breadcrumb a:visited { color:var(--grey); text-decoration:none; }
.breadcrumb a:hover { color:var(--green)!important; text-decoration:underline; }
@media (max-width:599px) {
    .breadcrumb { padding:16px 0; font-size:14px; }
    .breadcrumb .icon svg { margin:0 4px; height:12px; }
}
@media (min-width:1024px) {
    .breadcrumb { margin-top:112px; }
}

.mainContent { max-width:1280px; margin:0 auto; }

.mainContent :where(figure) { margin-bottom:16px; }
.mainContent figure:last-child { margin-bottom:0; }
/*.mainContent .wp-block-group.has-background { padding:min(10vw,64px) 0!important; }*/
.mainContent > .wp-block-group { padding:min(10vw,64px) 0!important; }
/*.mainContent > .wp-block-group > * { max-width:min(90%,1008px); margin-left:auto; margin-right:auto; }
.mainContent .wp-block-group > .wp-block-columns,
.mainContent .wp-block-group > .wp-block-table { max-width:90%; }*/
.mainContent .wp-block-group.has-background > * { width:90%; }

@media (max-width: 1399px) {
    .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) { width:90%; }
}

@media (max-width: 599px) {
    .mainContent .wp-block-group > .wp-block-table { max-width:unset; }
}
.wp-block-columns { margin-top:min(10vw,64px); margin-bottom:min(10vw,64px); column-gap:var(--padding-inner); row-gap:min(10vw,64px); }
.wp-block-columns:first-child { margin-top:0; }

.wp-block-column figure + .overline,
.wp-block-column figure + .has-small-font-size { margin-top:40px; }
.wp-block-column .wp-block-list { padding-left:16px; }

.mainContent .wp-block-cover,
.mainContent .wp-block-cover-image { min-height:min(54vw,592px); padding:32px 16px; }
.mainContent .wp-block-cover .wp-block-heading { line-height:1; }

.mainContent .has-small-font-size { font-size:14px!important; }

.wp-block-cover__inner-container > * { max-width:min(90%,1008px); margin-left:auto; margin-right:auto; }

.mainContent .wp-block-table td,
.mainContent .wp-block-table th { font-size:18px; font-weight:normal; border:0; padding:26px 16px; text-align:left; }
.mainContent .wp-block-table th { padding:5px 16px; font-size:20px; font-weight:700; }
.mainContent .wp-block-table thead { border-bottom:5px solid #FE4F2D; }
.mainContent .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color:#FDFBEE; }

.wp-block-image.is-style-rounded img,
.wp-block-image .is-style-rounded img { border-radius:92px 0 0 0; }
.wp-block-group.center,
.wp-block-buttons.center { text-align:center; justify-content:center; }
.wp-element-button,
.wp-block-button__link { color:#fff!important; text-decoration:none!important; transition:0.5s; }
.wp-element-button:hover,
.wp-block-button__link:hover { color:#fff; background-color:#39685D; } 

:root :where(.wp-block-button .wp-block-button__link) {  border-radius:25px!important; font-weight:700 !important; }
.wp-block-buttons .is-style-outline > div, 
.mainContent .wp-block-button.is-style-outline a { border-color:var(--text-color); color:var(--text-color)!important; }
.mainContent .wp-block-button.is-style-outline a:hover { color:#fff!important; background-color:#39685D; border-color:#39685D; }

.wp-block-table th { white-space:nowrap; }

.blogList { display:flex; flex-wrap:wrap; gap:30px; }
.blogListItem { background-color:#FDFBEE; padding:20px; }
.blogListItem img { width:min(100%,500px); margin-bottom:20px; }

@media (min-width: 1024px) {
    .blogListItem { width:calc((100% - 60px) / 3); }
}

.mainContent .swiper-button-next,
.mainContent .swiper-button-prev { color:#FE4F2D; width:50px; height:50px; background-color:#E2DAC6; border-radius:50%; }
.mainContent .swiper-button-next:after,
.mainContent .swiper-button-prev:after { font-size:30px; font-weight:bold; }
.mainContent .swiper-button-next:after { margin-left:5px; }
.mainContent .swiper-button-prev:after { margin-right:3px; }
.mainContent .swiper-pagination-bullet { width:20px; height:20px; background-color:#E2DAC6; opacity:0.5; }
.mainContent .swiper-pagination-bullet-active { background-color:#FE4F2D; opacity:1; }

/* Footer */
.pageFooter { color:#FDFBEE; background-color:#57B4BA; border-top:solid 10px #FE4F2D; }
.pageFooter .top { padding:60px 0; }
.pageFooter .top h4 { font-size:22px; margin-top:12px; font-weight:500; color:var(--lightgrey); }
.pageFooter .top a,
.pageFooter .top a:visited { color:var(--lightgrey); }
.pageFooter .top a:hover { color:var(--blue); }
.pageFooter .bottom { background-color:#015551; padding:30px; text-align:center; }
.pageFooter .bottom a { color:#fff!important; }
.pageFooter .bottom #searchform input { height:40px; border:0; appearance:none; }
.pageFooter .bottom #search_submit { background-color:#fff; }

.pageFooter ul.menu { list-style-type:none; padding:0; margin:0; }
.footerColBox { display:flex; flex-wrap:wrap; gap:30px; }
.pageFooter img { max-width:215px; }
.footerColBox .col { width:100%; }
.footerColBox .col-1 { text-align:center; }
@media (min-width: 700px) {
    .footerColBox .col-2,
    .footerColBox .col-3 { width:calc((100% - 30px) / 2); }
    .footerColBox .col p:first-child { padding-top:53px; }
}
@media (min-width: 1000px) {
    .footerColBox .col-2,
    .footerColBox .col-3,
    .footerColBox .col-4 { width:calc((100% - 60px) / 3); }
    .footerColBox .col-3 { text-align:center; }
    .footerColBox .col-4 { text-align:right; }
    .footerColBox .menu-footer-navigation-container { padding-top:53px; }
}
@media (min-width: 1280px) {
    .footerColBox .col-1 { width:calc(35% - 30px); }
    .footerColBox .col-2,
    .footerColBox .col-3,
    .footerColBox .col-4 { width:calc((65% - 60px) / 3); }
    .footerColBox .col-1 { text-align:left; padding-top:8px; }
    .footerLogo { width:286px; }
}

/* .wp-block-group.has-background { padding:min(5vw,50px); } */

.wp-block-buttons + p { margin-top:15px; }

.wp-block-details + .wp-block-details { margin-top:15px; }

.wp-block-cover.fk-height-auto { min-height:unset; aspect-ratio:1; }