/*   
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: 'Afacad Flux';
  font-style: normal;
  font-weight: 500;
  src: url('assets/fonts/afacad-flux-v4-latin-500.woff2') format('woff2');
}

:root {
    --text-size-standard:16px;
    --text-color:#1E1E1E;
    --text-color-2:#344F1F;
    --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:#F9F5F0;
    --footer-bgcolor:#F2EAD3;
    --color-5:#F2EAD3;
}
@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:'Inter',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-family:'Afacad Flux',serif; font-size:var(--text-size-h1); font-weight:500; line-height:var(--line-height-headline); color:#344F1F; hyphens:auto; }
h2 { margin:0 0 min(5vw,32px) 0; font-family:'Afacad Flux',serif; font-size:var(--text-size-h2); font-weight:500; line-height:var(--line-height-headline); color:#344F1F; hyphens:auto; }
h3 { margin:0 0 min(5vw,32px) 0; font-family:'Afacad Flux',serif; font-size:var(--text-size-h3); font-weight:500; line-height:var(--line-height-headline); color:#344F1F; 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-family:'Inter',sans-serif; 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:15%; text-decoration-thickness:1px; text-decoration-line:underline; }
a:hover { color:var(--text-color-2); text-underline-offset:15%; text-decoration-thickness:1px; 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%,1040px); 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:100vh; overflow:auto; z-index:100; }
.pageHeader .logo { padding:15px 0; margin-left:5%; display:inline-block; }
.pageHeader .logo img { height:42px; width:auto; }

#mobileOpener { display:inline-block; height:56px; width:60px; position:absolute; top:16px; right:calc(5% - 15px); 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; }

#mainNavi { 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(100vh - 72px); }
    #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 5%; }
    #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; }
}

@media (min-width:1024px) {
    .pageHeader { height:112px; overflow:visible; }
    .pageHeader .logo { position:absolute; top:24px; left:var(--padding-inner); padding:0; margin:0; }
    .pageHeader .logo img { height:60px; }

    #mobileOpener { display:none; }
    #mainNavi { display:block!important; }
    #mainNavi > div > ul { display:flex!important; justify-content:flex-end; list-style-type:none; padding:44px 4px 0 0; width:min(60vw,920px); margin:0 0 0 auto; }
    #mainNavi > div > ul > li > a { cursor:pointer; line-height:20px; padding:10px 12px; white-space:nowrap; text-decoration:none; }
    #mainNavi > div > ul > li.current_page_item > a { text-decoration-line:underline; text-underline-offset:5px; text-decoration-thickness:1px; }
    #mainNavi > div > ul > li > a:hover { background-color:#F4991A; color:#fff; transition:all 0.5s; }
    
    #mainNavi > div > ul ul { list-style-type:none; margin:0; padding:0; }
/*  #mainNavi .sub-menu { display:none; position:absolute; background-color:#fafafa; top:34px; 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 .sub-menu a:hover { background-color:var(--lightgrey); }
    #mainNavi .sub-menu .current_page_item > a { background-color:var(--grey); color:var(--lightgrey)!important; } */
}

@media (min-width: 1180px) {
    #mainNavi { font-size: 17px; }
    #mainNavi > div { gap:20px; }
    #mainNavi > div > li > a { padding:12px 18px; }
}

.mainContent { padding-top:69px; max-width:1600px; margin:0 auto; }
@media (min-width: 1024px) {
    .mainContent { padding-top:112px; }
}
.mainContent :where(figure) { margin-bottom:16px; }
.mainContent figure:last-child { margin-bottom:0; }
.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:min(90%,1040px); }
@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; }
@media (min-width:1024px) {
    .wp-block-column > *:not(figure) { margin-left:var(--padding-inner); margin-right:var(--padding-inner); }
}
.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.startcover { overflow:unset; display:block; padding:0; }
.wp-block-cover.startcover > img { position:relative; }
.wp-block-cover.startcover .wp-block-cover__inner-container { background-color:#344F1F; color:#F4991A; padding:min(5vw,30px); width:75%; margin-left:25%; margin-top:max(-12vw,-100px); }
.wp-block-cover.startcover h1 { font-size:min(10vw, 80px)!important; margin-bottom:0; }

.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:var(--text-size-small); font-weight:500; border:0; padding:26px 16px; text-align:left; }
.mainContent .wp-block-table th { padding:5px 16px; }
.mainContent .wp-block-table thead { border-bottom:2px solid #12211F; }
.mainContent .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background-color:#DBECE6; }

.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; } 

.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; }

/* Footer */
.pageFooter { color:var(--text-color-2); background-color:var(--footer-bgcolor); font-size:18px; text-align:center; padding:min(5vw,32px) 5%; border-top:solid 15px #F4991A; }
.pageFooter a,
.pageFooter a:visited { color:var(--text-color-2); text-decoration:none; }
.pageFooter a:hover { color:var(--text-color-2); text-underline-offset:15%; text-decoration-thickness:1px; text-decoration-line:underline; }
.footerLogo { margin-bottom:25px; }
.footerLogo img { width:min(70vw,360px); }
.footerNavi { background-color:#344F1F; padding:15px; text-align:center; }
.footerNavi ul { list-style-type:none; margin:0; padding:0; }
.footerNavi li { display:inline-block; margin:0 10px; }
.footerNavi a { font-size:14px; color:#fff!important; }

@media (max-width:599px) {
    .footerContact,
    .menu-footer-navigation-container { padding-top:5vw; line-height:2.2; }
}

.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; }

.swpm-forgot-pass-link,
.swpm-edit-profile-link { display:none; }