﻿html {
    scroll-padding-top: 135px;
}
.wp-site-blocks{
    overflow-x: hidden;
}

:root :where(a:where(:not(.wp-element-button))){text-underline-offset:0.15em; transition:all 0.25s ease }
:root :where(a:where(:not(.wp-element-button)):hover){text-underline-offset:0.25em }

/* break after slash: /&#8203; */
/*
body.home .pageheader .wp-block-template-part .fade-in {--delay:4s}
body.home .pageheader::after {content: ''; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); width: 9em; height: 10.3em; background: url("/wp-content/themes/pkr__theme/assets/images/icon--praxisklinik-rieth.svg") no-repeat center; background-size: contain}
body.home .pageheader::after {
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-iteration: 1;
    -webkit-animation-name: IconOpacity;
    -webkit-animation-duration: 4s;
    -webkit-animation-delay: 0s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-iteration: 1;
    animation-name: IconOpacity;
    animation-duration: 4s;
    animation-delay: 0s;
}
@keyframes IconOpacity {0% { opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 0; } }
@-webkit-keyframes IconOpacity {0% { opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } 100% { opacity: 0; }}
*/



.wp-site-blocks>header, .pageheader {
    /*background-color: var(--wp--preset--color--primary);*/
    color: var(--wp--preset--color--white);
}

.logo-type, header nav, .pageheader nav {font-weight:400;text-transform:uppercase; letter-spacing: 0.1em;margin-block-start:0 !important}

header .wp-block-navigation__submenu-container {background-color: var(--wp--preset--color--primary) !important; box-shadow:0 0 0;}
:is(header,.pageheader) .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
    background-color: var(--wp--preset--color--primary); }
.wp-site-blocks>header .wp-block-group.logo .wp-block-image { display: block; overflow-x: hidden; width: 80px;}
.wp-site-blocks>header .wp-block-group.logo .wp-block-image img { width: 257px; max-width: none; }
.wp-site-blocks>header .wp-block-navigation {--font-size-base:20; --gap:/*clamp(1em,4vw,5em)*/ clamp(1rem,  calc(1rem + (var(--font-size-base) * (4 - 1)) * ((100vw - 1024px) / (1600 - 1024))), 4rem); gap:var(--gap)}

.wp-block-group.logo .wp-block-image:focus-within { outline: var(--wp--custom--focus--style); outline-offset: var(--wp--custom--focus--offset);}

header nav ul ul li, .pageheader nav ul ul li {
    text-transform: none;
    letter-spacing: 0.02em;
    /*font-size: 0.9em;*/
}

.wp-block-navigation__responsive-container.is-menu-open {min-height: 100vh}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {min-height: calc(100vh - 3 * var(--wp--style--root--padding-left)); justify-content: space-between !important;}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {align-items: center; width: 100%;}


.pageheader nav {opacity: 1; transition: opacity}
.scrolled .pageheader nav {opacity: 0}

.pageheader .wp-block-navigation__container {gap: 5vh;}

.wp-block-navigation__submenu-icon {margin-right: -11px; opacity: 0; transition: opacity 0.8s ease}
.wp-block-navigation__submenu-icon:focus,.wp-block-navigation__submenu-icon[aria-expanded="true"] {opacity: 1}

.wp-block-navigation .wp-block-navigation-item__label {margin-bottom: -0.55em; display: block;}

.current-menu-item>a {font-weight: 600;}

.wp-block-button.is-style-outline .wp-block-button__link {border-color:var(--wp--preset--color--textcolor)}
@media(max-width:960px){
    .page-template-page-transparent-menu header.wp-block-template-part {position: absolute;z-index: 1000; width: 100%;}
    .page-template-page-transparent-menu header.wp-block-template-part>.wp-block-group {background-color: transparent !important; padding-top:var(--wp--style--root--padding-right) !important}
    .page-template-page-transparent-menu header.wp-block-template-part .logo {justify-content:flex-end}
    .page-template-page-transparent-menu header.wp-block-template-part .logo figure{display: none !important}

    .wp-block-navigation__responsive-container { color:#000; background-color:var(--wp--preset--color--tertiary-light) !important; background-image:url("/wp-content/uploads/icon-Topografische_Linien_03.svg"); background-size:cover; }
    .wp-block-navigation-submenu__toggle, .wp-block-navigation__submenu-container {display: none !important}
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {margin-bottom: 2em}
    .wp-block-navigation__responsive-container .wp-block-button.is-style-outline .wp-block-button__link:not(:hover) {color: inherit; border-color: currentColor;}
    .wp-block-navigation__responsive-container .wp-block-buttons:not(:last-child) {margin-top: auto}
    .wp-block-navigation__responsive-container .wp-block-buttons {width: 100%; margin-top: 2em}
    .wp-block-navigation__responsive-container :where(.wp-block-button .wp-block-button__link) {padding: 0; background-color: transparent;}
    .wp-block-navigation__responsive-container .wp-block-button__link.wp-element-button svg {margin: 0; font-size: 1.25em}
    .wp-block-navigation__responsive-container .wp-block-navigation__container  {gap:2em !important}
}
@media(min-width:961px){

    header .wp-block-buttons {display: none}

    .page-template-page-transparent-menu header.wp-block-template-part {position: fixed; top: 0; width: 100%; transform: translateY(-110%); transition: transform 0.75s ease; z-index: 10000}
    .page-template-page-transparent-menu.scrolled>:not(.scrollfix) header.wp-block-template-part, .page-template-page-transparent-menu header.wp-block-template-part:focus-within  {transform: translateY(0);}

    .wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded=true]~.wp-block-navigation__submenu-container, 
    .wp-block-navigation .has-child:not(.open-on-click):hover>.wp-block-navigation__submenu-container, 
    .wp-block-navigation .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within>.wp-block-navigation__submenu-container {
    position:fixed;
    right: 0; left: auto;
    width: calc(62.8ch + 5 * var(--gap));
    box-sizing: border-box;
    display: grid;
    grid-template-rows: repeat(2, auto);
    grid-auto-flow: column; 
    gap: 0rem;
    margin-top: -1.45em;
    padding: 2em var(--wp--style--root--padding-right) 2em 0;
    background-color: transparent !important;
    }
    .wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded=true]~.wp-block-navigation__submenu-container::before, 
    .wp-block-navigation .has-child:not(.open-on-click):hover>.wp-block-navigation__submenu-container::before, 
    .wp-block-navigation .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within>.wp-block-navigation__submenu-container::before {
        content: ''; position: absolute; right: 0; height: calc(100% - 1em); top:1em; width: 100vw; background-color: var(--wp--preset--color--primary); box-shadow: 0 0.5em 1em -.5em rgba(0, 0, 0, 0.25);
    }
    .wp-block-navigation .has-child .wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content {padding: 0.5em 0.25em}
}
@media (min-width: 1280px){
    .wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded=true]~.wp-block-navigation__submenu-container, 
    .wp-block-navigation .has-child:not(.open-on-click):hover>.wp-block-navigation__submenu-container, 
    .wp-block-navigation .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within>.wp-block-navigation__submenu-container {
    width: calc(56ch + 4 * var(--gap));
    }
}

/* scrolled menu */
/*.scrolled header nav {
    position: fixed; z-index: 501; left: 0; top: 0; width: 100%;
    padding: 71px  var(--wp--style--root--padding-left) 1em  var(--wp--style--root--padding-right); box-sizing: border-box;
    background-color: var(--root--preset--color--primary);
    
}
.scrolled .wp-block-navigation__container{}
.scrolled .wp-block-navigation { --navigation-layout-direction:row; justify-content: flex-end;
    --font-size-base: 20;
    gap: clamp(1rem, calc(1rem + (var(--font-size-base) * (4 - 1)) * ((100vw - 1024px) / (1600 - 1024))), 4rem);
}
.scrolled .pageheader .wp-block-group.logo .wp-block-image img {width: 248px; max-width:none }
.scrolled .pageheader .wp-block-group.logo .wp-block-image { position:fixed; z-index: 502; top: 15px; width: 71px }

.wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded=true]~.wp-block-navigation__submenu-container,.wp-block-navigation .has-child:not(.open-on-click):hover>.wp-block-navigation__submenu-container,.wp-block-navigation .has-child:not(.open-on-click):not(.open-on-hover-click):focus-within>.wp-block-navigation__submenu-container {
    min-width: 300px;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
    padding: 0.5em 0
}*/


.pageheader{
    padding: var(--wp--preset--spacing--50);
    align-items: flex-start;
    min-height: calc(100vh - 5em);
}
body.home .pageheader{
    min-height: 100vh;
}
.pageheader .wp-block-group.logo {
    display: flex;
    justify-content: space-between;
    align-content: flex-start;
    margin-bottom: 20vh;
}

.pageheader .wp-block-group.logo .wp-block-image { display: block; overflow-x: hidden; width: 145px;}
.pageheader .wp-block-group.logo .wp-block-image img { width: 496px; max-width: none; }


.pageheader .wp-block-navigation__submenu-container {background-color: transparent !important; box-shadow:0 0 0 !important;}

.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
    fill: currentColor;
    display: block;
    height: 24px;
    pointer-events: none;
    width: 24px;
}
.wp-block-navigation__responsive-container-open svg [stroke="#000000"], .wp-block-navigation__responsive-container-close svg [stroke="#000000"] {
    stroke: currentColor;
}



#scrolltopInfo { display: block; position: fixed; bottom: -60px; right: 20px; z-index: 1001; }
:target #scrolltopInfo { display: none; } 
/*team*/

/*.team-list.slide-right,.team-list.slide-left {mix-blend-mode: luminosity;} /* mix blend mode bug on transform */
.team-list .wp-block-image {filter: grayscale(1);}

.team-list h3 {font-weight: 400; font-size: var(--wp--preset--font-size--x-large)}
.team-item .wp-block-image img {mix-blend-mode: luminosity; width: 16rem; height: 21rem; object-fit: cover; }
.team-listing ul { row-gap: 3em !important}
.team-listing ul .team-item { text-align:center}
.team-listing ul .team-item .wp-block-image img {width: 16rem; height: 16rem; border-radius: 50%; }
.single-view-team .wp-block-post-featured-image img {mix-blend-mode: luminosity; width: 20rem; height: 27rem; object-fit: cover; }
.single-view-team .logo {text-align: right;} .single-view-team .logo img {width: 320px; height: auto}
.single-view-team td { vertical-align: top; border: none; }
.single-view-team td:first-child { min-width: 10ch; }

.modal-content {border-radius: 0em;}

/*gallery*/
.galleryItem { opacity: 0.5; transition: opacity 0.5s ease, mix-blend-mode 0.5s ease; }
.galleryItem:has(+.on), .galleryItem.on+.galleryItem {opacity: 0.5; mix-blend-mode: multiply;}
.galleryItem.on {opacity: 1; mix-blend-mode: normal;}
.dynamicgallery .gallery { overflow: visible !important }
.dynamicgallery .galleryItem figure {padding: 0.5em} 
.dynamicgallery .galleryItem figure img {box-shadow:0 0 0 rgba(0,0,0,0.25); transition: box-shadow 1s ease 0.5s} 
.dynamicgallery .galleryItem.on figure img {box-shadow:0 0 1em rgba(0,0,0,0.25);} 


/*.ar-1-1 .wp-block-media-text__media{ max-height:100vh }*/




/*form*/
.wpcf7-form [type="submit"]:hover{
    background-color: var(--wp--preset--color--primary-dark);
    color: var(--wp--preset--color--white);
}
.wpcf7-form [type="submit"]{
    padding: calc(0.5em + 1px) calc(1.2em - 1px) calc(0.5em - 1px) calc(1.2em - 1px);
    cursor: pointer;
    background-color: transparent;
    color: var(--wp--preset--color--primary-dark);
    border: 1.5px solid;
    width: auto;
    font-size: 1.125em;
    border-radius: 2em;
    text-transform: uppercase; letter-spacing: 0.05em;
}


@media (min-width: 769px){
.fixed-height-column {
    min-height: 25em;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
}

@media (max-width: 1100px){
.pageheader .wp-block-group.logo .wp-block-image { width: auto;}
.pageheader .wp-block-group.logo .wp-block-image img { width: 360px; max-width: 100%; }
.pageheader .logo-type {display: none}
}

@media (max-width: 960px){
    .pageheader header>div {
        display: flex;
        flex-direction: column-reverse;
    }
    .pageheader .wp-block-group.logo {
        margin-top: 30vh;
        margin-bottom: 20vh;
    }
    .pageheader .wp-block-navigation{ 
        display: none;
    }
}