/*
Theme Name: Frans hilft 2026
Template: Impreza
Version: 1.0
Author:	werksfarbe
Theme URI: http://impreza.us-themes.com/
Author URI: http://werksfarbe.com/
*/
/**
 * @license
 * MyFonts Webfont Build ID 3867246, 2020-12-16T11:57:38-0500
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Bree Book by TypeTogether
 * URL: https://www.myfonts.com/collections/type-together-foundry

 * Webfont: Bree Bold by TypeTogether
 * URL: https://www.myfonts.com/collections/type-together-foundry
 
 * © 2025 MyFonts Inc. */
/**
@license Bree Serif
https://frans-hilft.de/wp-content/themes/frans/SIL-Open-Font-License.txt
**/

/* ---------
Globale Einstellungen
----------- */
:root {
    --base-radius: 1.5rem;
    --kontaktblock-padding: 1.5rem;
}


/* ---------
Submenus
----------- */
nav.frans-submenu ul li.menu-item a {
  border-radius: 999999999rem;
  padding-left: 2rem!important;
  padding-right: 2rem!important;
  border: solid 1px var(--color-darkblue);
  font-weight: bold;
}
nav.frans-submenu ul li.menu-item a:hover {
  border: solid 1px  var(--color-justblue);
}
nav.frans-submenu.frans-submenu-first-sos ul li.menu-item:first-child a {
  background: var(--color-sospink)!important;
  color: #ffffff!important;
  border: solid 1px var(--color-sospink)!important;
}
nav.frans-submenu.frans-submenu-first-sos ul li.menu-item:first-child a:hover {
  background: var(--color-sosdarkpink)!important;
  border: solid 1px var(--color-sosdarkpink)!important;
}

article.w-grid-item .sos *:not(.hilfekontakt-btn *) {
  color: var(--color-sospink)!important;
  text-decoration-color: var(--color-sospink)!important;
}
article.w-grid-item .sos a:hover:not(.hilfekontakt-btn *) {
  color: var(--color-sosdarkpink)!important;
  text-decoration-color: var(--color-sosdarkpink)!important;
}
article.w-grid-item .sos .hilfekontakt-btn a.w-btn {
  background: var(--color-sospink)!important;
}
article.w-grid-item .sos .hilfekontakt-btn a.w-btn:hover {
  background: var(--color-sosdarkpink)!important;
}
article.w-grid-item .sos .sub-box {
  background: var(--color-superlightpink)!important;
}
}
/*
article.w-grid-item .sos.einrichtung h3.post_title a,
article.w-grid-item .sos.telefonnummer .notruf-nummer a {
  color: var(--color-sospink)!important;
  text-decoration-color: var(--color-sospink)!important;
}

article.w-grid-item .sos.einrichtung h3.post_title a:hover,
article.w-grid-item .sos.telefonnummer .notruf-nummer a:hover {
  color: var(--color-sosdarkpink)!important;
  text-decoration-color: var(--color-sosdarkpink)!important;
}
*/
.hilfekontakt-block a {
  text-decoration: underline;
}

.w-btn-label > span {
    border: 0;
    clip: rect(0,0,0,0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
.color_alternate *:focus,
.color_alternate *:focus-within,
.color_alternate *:focus-visible {
  outline-color: #ffffff!important;
}
.color_alternate .w-tabs-section-title,
.color_alternate .w-tabs-section-control {
  color: #ffffff;
}
.color_alternate button.w-tabs-section-header:not([aria-expanded="true"]) {
  border-bottom: solid 1px #ffffff
}
.termin-wrapper {
  display: flex;
  flex-wrap: wrap;

}
.termin-wrapper p.pille {
  margin-right: 1em;
  margin-top: 1em;
}
.frans-kalenderblatt__tag {
  display: block;
  font-size: 5rem;
  line-height: 1;
  color: #ffffff;
}
.frans-kalenderblatt__monat {
  display: block;
  font-size: 2.6rem;
  line-height: 1;
  gap: 1em;
  width: 100%;
  color: #ffffff;
  font-weight: bold;
}
.pille {
    border: solid 1px var(--color-justblue);
    border-radius: 99999rem;
    padding: 0.4rem;
    line-height: 1;
    margin-bottom: 0;
    display: flex;
}
.full-bg {
    box-shadow: 0 0 0 100vmax var(--color-justblue);
    clip-path: inset(0 -100vmax);
}
.bree-serif {
    font-family: "bree-serif", Arial, Helvetica, Geneva, sans-serif !important
}
.bree-bold {
    font-weight: 700;
}
.no-wrap {
    white-space: nowrap;
}
.aspect-ratio-16-9 {
    aspect-ratio: 16 / 9
}
.aspect-ratio-1-1 {
    aspect-ratio: 1 / 1
}
.border-bottom {
    border-bottom: solid 1px var(--color-iceblue)
}
.justblue-box {
    background: var(--color-justblue);
    padding: 1.5rem;
    border-radius: var(--base-radius);
    margin-bottom: 1.5rem;
    border: solid 1px var(--color-content-bg-grad)
}
.justblue-box *:not(.w-btn *) {
    color: #ffffff;
}
.justblue-box *:focus,
.justblue-box *:focus-within {
  outline-color: #ffffff!important;
}
.w-nav-list:not(.level_1) {
  background: #ffffff!important;
}
/* -------------
On-Page-Navi
-------------- */
.frans-page-navigation .frans-page-navigation__list {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 1px solid var(--color-justblue);
}
.frans-page-navigation .frans-page-navigation__list li {
    margin: 0;
    padding:  0.5rem 0 0.5rem 0;
    border-bottom: 1px solid var(--color-darkblue);

}
.frans-page-navigation .frans-page-navigation__list li a {
    display: block;
    padding: 0.5rem;
}
.frans-page-navigation__link[aria-current="location"],
.frans-page-navigation .frans-page-navigation__list a:hover,
.frans-page-navigation .frans-page-navigation__list a.active {
    background: var(--color-iceblue);
    color: var(--color-darkblue);
}
.frans-page-navigation__item.is-active {
    /* Optionaler zusätzlicher Aktivzustand des Listenelements */
}

html body {
  font-feature-settings: "ss01" on; /* oder "salt", "swsh", je nach Bedarf */
}
.w-search-open {
    display:block;
}
.headersearch.w-search.elm_in_header input {
    background:var(--color-superlightblue)!important;
    color:var(--inputs-text-color)!important;
}
.headersearch.w-search.elm_in_header .w-btn {
    color:var(--inputs-text-color)!important;
}

#page-header.search-open .w-nav-list {
    filter: blur(5px);
    pointer-events: none;
    transition: filter 0.3s ease;
}

#page-header .navwrapper {
    transition: box-shadow 0.2s
}

#page-header.sticky .navwrapper {
    box-shadow: 0px 0px 0px 0 #ffffff!important
}
.w-nav-arrow {
    height:24px;
    width:24px;
}

.like-h1 {
  font-family: var(--h1-font-family);
  font-size: var(--h1-font-size);
  line-height: var(--h1-line-height);
  font-weight: var(--h1-font-weight);
  text-transform: var(--h1-text-transform);
  font-style: var(--h1-font-style);
  letter-spacing: var(--h1-letter-spacing);
  margin-bottom: var(--h1-margin-bottom);
}
.like-h2 {
  font-family: var(--h2-font-family);
  font-size: var(--h2-font-size);
  line-height: var(--h2-line-height);
  font-weight: var(--h2-font-weight);
  text-transform: var(--h2-text-transform);
  font-style: var(--h2-font-style);
  letter-spacing: var(--h2-letter-spacing);
  margin-bottom: var(--h2-margin-bottom);
}
.like-h3 {
  font-family: var(--h3-font-family);
  font-size: var(--h3-font-size);
  line-height: var(--h3-line-height);
  font-weight: var(--h3-font-weight);
  text-transform: var(--h3-text-transform);
  font-style: var(--h3-font-style);
  letter-spacing: var(--h3-letter-spacing);
  margin-bottom: var(--h3-margin-bottom);
}
.like-h4 {
  font-family: var(--h4-font-family);
  font-size: var(--h4-font-size);
  line-height: var(--h4-line-height);
  font-weight: var(--h4-font-weight);
  text-transform: var(--h4-text-transform);
  font-style: var(--h4-font-style);
  letter-spacing: var(--h4-letter-spacing);
  margin-bottom: var(--h4-margin-bottom);
}
.like-h5 {
  font-family: var(--h5-font-family);
  font-size: var(--h5-font-size);
  line-height: var(--h5-line-height);
  font-weight: var(--h5-font-weight);
  text-transform: var(--h5-text-transform);
  font-style: var(--h5-font-style);
  letter-spacing: var(--h5-letter-spacing);
  margin-bottom: var(--h5-margin-bottom);
}
.like-h6 {
  font-family: var(--h6-font-family);
  font-size: var(--h6-font-size);
  line-height: var(--h6-line-height);
  font-weight: var(--h6-font-weight);
  text-transform: var(--h6-text-transform);
  font-style: var(--h6-font-style);
  letter-spacing: var(--h6-letter-spacing);
  margin-bottom: var(--h6-margin-bottom);
}
.like-p {
  font-family: var(--font-family);
  font-size: var(--font-size);
  line-height: var(--line-height);
  font-weight: var(--font-weight);
  margin: 0 0 1.5rem;
}