.helen-header {
position: fixed;
inset-block-start: 0;
inset-inline: 0;
z-index: 100;
font-family: var(--font-sans);
} .e-con:has(> .helen-header) {
padding: 0;
} #tahefobu-header {
will-change: auto;
} html.tahefobu-js body #tahefobu-header {
opacity: 1;
pointer-events: auto;
transition: none;
}
.helen-header__inner {
display: flex;
align-items: center;
gap: var(--header-nav-gap);
max-width: var(--helen-content-width);
margin-inline: auto;
padding-inline: var(--space-l);
} .helen-header__nav {
margin-inline-start: auto;
} .helen-header__list {
display: flex;
align-items: center;
gap: var(--header-nav-gap);
margin: 0;
padding: 0;
list-style: none;
color: inherit;
}
.helen-header__item {
color: inherit;
}
.helen-header__link,
.helen-header__lang {
font-size: var(--font-size-body);
line-height: var(--line-height-body);
text-transform: uppercase;
text-decoration: none;
color: inherit;
}
.helen-header__link:hover,
.helen-header__link:focus-visible {
text-decoration: underline;
} .helen-header__link[aria-current='page'],
.helen-header__lang-current {
text-decoration: underline;
}
.helen-header__link,
.helen-header__lang-current,
.helen-header__lang-link {
text-underline-offset: 0.25em;
text-decoration-thickness: 1px;
} .helen-header__lang {
display: inline-flex;
align-items: baseline;
gap: 0.25em;
}
.helen-header__lang-current {
font-weight: 600;
cursor: default;
}
.helen-header__lang-link {
color: inherit;
text-decoration: none;
}
.helen-header__lang-link:hover,
.helen-header__lang-link:focus-visible {
color: inherit;
text-decoration: underline;
} .helen-header__book {
flex-shrink: 0;
} .helen-header__logo {
display: block;
flex-shrink: 0;
inline-size: var(--header-logo-size);
}
.helen-header__logo svg {
display: block;
inline-size: 100%;
block-size: auto;
} .helen-header__logo-type {
display: none;
} .helen-header__burger {
--helen-burger-bar: calc(var(--space-3xs) / 2);
--helen-burger-gap: var(--space-2xs);
display: none;
flex-shrink: 0;
flex-direction: column;
gap: var(--helen-burger-gap);
padding: var(--space-2xs);
border: 0;
border-radius: 0;
background: none;
cursor: pointer;
color: inherit;
} .helen-header__burger:hover,
.helen-header__burger:focus {
background: none;
color: inherit;
}
.helen-header__burger-bar {
display: block;
inline-size: var(--space-m);
block-size: var(--helen-burger-bar);
background-color: currentColor;
transition: transform 0.3s ease, opacity 0.3s ease;
} .helen-header__burger[aria-expanded='true'] .helen-header__burger-bar:first-child {
transform: translateY(calc((var(--helen-burger-bar) + var(--helen-burger-gap)) * 1.5)) rotate(45deg);
}
.helen-header__burger[aria-expanded='true'] .helen-header__burger-bar:last-child {
transform: translateY(calc((var(--helen-burger-bar) + var(--helen-burger-gap)) * -1.5)) rotate(-45deg);
}
.helen-header__burger[aria-expanded='true'] .helen-header__burger-bar:nth-child(2),
.helen-header__burger[aria-expanded='true'] .helen-header__burger-bar:nth-child(3) {
opacity: 0;
} .helen-header[data-header='hero'] {
--helen-logo-disc: var(--color-surface-base);
color: var(--color-text-on-dark);
background-color: transparent;
}
.helen-header[data-header='hero'] .helen-header__inner {
padding-block: var(--header-padding-hero);
}
.helen-header[data-header='hero'] .helen-header__logo {
color: var(--color-surface-header);
} .helen-header[data-header='leiste'] {
--helen-logo-disc: var(--color-surface-base);
color: var(--color-text-on-dark);
background-color: var(--color-surface-header);
}
.helen-header[data-header='leiste'] .helen-header__inner {
padding-block: var(--header-padding-leiste);
} .helen-header[data-header='leiste'] .helen-header__logo {
color: var(--color-surface-header);
} .helen-header[data-header='pille'] {
color: var(--color-text-on-dark);
padding-block-start: var(--space-xs);
background-color: transparent;
}
.helen-header[data-header='pille'] .helen-header__inner {
block-size: var(--header-height);
padding-block: 0;
border-radius: var(--radius-pill);
background-color: var(--color-surface-header); box-shadow: 14px 12px 40px rgba(0, 0, 0, 0.22);
transition: box-shadow 0.3s ease;
} .helen-header[data-header='pille'][data-header-hidden] .helen-header__inner {
box-shadow: 14px 12px 40px rgba(0, 0, 0, 0);
} .helen-header[data-header='pille'] .helen-header__logo {
inline-size: var(--header-logo-type-size);
color: var(--color-text-on-dark);
}
.helen-header[data-header='pille'] .helen-header__logo-full {
display: none;
}
.helen-header[data-header='pille'] .helen-header__logo-type {
display: block;
} .helen-header[data-header-hidden] {
transform: translateY(-100%);
} .helen-header {
transition: transform 0.3s ease;
} html {
scroll-padding-block-start: calc(var(--header-padding-leiste) * 2 + var(--header-logo-size));
} body.helen-header-leiste #content {
padding-block-start: calc(var(--header-padding-leiste) * 2 + var(--header-logo-size));
} @media (max-width: 1024px) {
.helen-header[data-header] {
--helen-logo-disc: var(--color-surface-base);
color: var(--color-text-on-dark);
padding-block-start: var(--space-xs);
padding-inline: var(--space-xs);
background-color: transparent;
}
.helen-header[data-header] .helen-header__inner {
gap: var(--space-xs);
block-size: var(--header-height);
padding-block: 0;
padding-inline: var(--space-s);
border-radius: var(--radius-pill);
background-color: var(--color-surface-header);
}
.helen-header[data-header] .helen-header__logo {
inline-size: var(--header-logo-type-size);
color: var(--color-text-on-dark);
}
.helen-header[data-header] .helen-header__logo-full {
display: none;
}
.helen-header[data-header] .helen-header__logo-type {
display: block;
} .helen-header__book {
margin-inline: auto;
} .helen-header__burger {
display: flex;
order: 1;
} .helen-header__nav {
position: fixed;
inset: 0;
z-index: -1;
display: flex;
align-items: center;
justify-content: center;
margin: 0;
padding-block: calc(var(--header-height) + var(--space-xs) * 2) var(--space-l);
padding-inline: var(--space-s);
overflow-y: auto;
background-color: var(--color-surface-header);
transform: translateX(100%);
visibility: hidden;
transition: transform 0.3s ease, visibility 0s linear 0.3s;
}
.helen-header[data-header-menu] .helen-header__nav {
transform: none;
visibility: visible;
transition: transform 0.3s ease, visibility 0s linear 0s;
}
.helen-header__list {
flex-direction: column;
gap: var(--space-s);
text-align: center;
} html {
scroll-padding-block-start: calc(var(--header-height) + var(--space-xs) * 2);
}
body.helen-header-leiste #content {
padding-block-start: calc(var(--header-height) + var(--space-xs) * 2);
}
} body.helen-header-hero:not(.home) .elementor > .surface-hero:first-child > .section {
min-block-size: 567px;
padding-block-start: calc(var(--header-padding-hero) * 2 + var(--header-logo-size) + var(--space-xl) + var(--space-xs));
}
@media (max-width: 1024px) {
body.helen-header-hero:not(.home) .elementor > .surface-hero:first-child > .section {
min-block-size: 476px;
padding-block-start: calc(var(--header-height) + var(--space-xs) * 2 + var(--space-l));
}
}
@media (max-width: 767px) {
body.helen-header-hero:not(.home) .elementor > .surface-hero:first-child > .section {
min-block-size: 400px;
}
} html.helen-menu-open {
overflow: hidden;
}
@media (prefers-reduced-motion: reduce) {
.helen-header,
.helen-header__inner,
.helen-header__nav,
.helen-header[data-header-menu] .helen-header__nav,
.helen-header__burger-bar {
transition: none;
}
}