.tkhf-header,
.tkhf-footer {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background-clip: border-box !important;
}

.tkhf-header *,
.tkhf-header *::before,
.tkhf-header *::after,
.tkhf-footer *,
.tkhf-footer *::before,
.tkhf-footer *::after {
    box-sizing: border-box !important;
}

.tkhf-header {
    position: relative !important;
    display: block !important;
    overflow: visible !important;
    background: color-mix(in srgb, var(--tkhf-header-bg, #8ebf8e) var(--tkhf-header-bg-opacity, 100%), transparent) !important;
    height: var(--tkhf-header-full-height, 200px) !important;
    min-height: var(--tkhf-header-full-height, 200px) !important;
    container-type: inline-size;
}

.tkhf-header-slim {
    height: var(--tkhf-header-slim-height, 112px) !important;
    min-height: var(--tkhf-header-slim-height, 112px) !important;
}

.tkhf-header-inner {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: inherit !important;
    overflow: visible !important;
}

.tkhf-header-title,
.tkhf-header-subtitle {
    position: absolute !important;
    z-index: 2 !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-decoration: none !important;
}

.tkhf-header-title {
    left: var(--tkhf-title-x-full, 11%) !important;
    top: var(--tkhf-title-y-full, 18%) !important;
    color: var(--tkhf-title-color, #c40000) !important;
    font-family: var(--tkhf-title-font, Arial, Helvetica, sans-serif) !important;
    font-size: clamp(22px, 3.9cqw, var(--tkhf-title-size-full, 74px)) !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em !important;
    text-align: left !important;
    text-shadow: var(--tkhf-title-shadow, 0 20px 34px rgba(0,0,0,0.18)) !important;
}

.tkhf-header-subtitle {
    left: var(--tkhf-subtitle-x-full, 33%) !important;
    top: var(--tkhf-subtitle-y-full, 58%) !important;
    color: var(--tkhf-subtitle-color, #ffffff) !important;
    font-family: var(--tkhf-subtitle-font, Arial, Helvetica, sans-serif) !important;
    font-size: clamp(16px, 2.55cqw, var(--tkhf-subtitle-size-full, 48px)) !important;
    font-weight: 800 !important;
    letter-spacing: 0.02em !important;
    text-align: left !important;
    text-shadow: 0 1px 0 rgba(0,0,0,0.12) !important;
}

.tkhf-header-slim .tkhf-header-title {
    left: var(--tkhf-title-x-slim, 11%) !important;
    top: var(--tkhf-title-y-slim, 12%) !important;
    font-size: clamp(20px, 3.35cqw, var(--tkhf-title-size-slim, 54px)) !important;
}

.tkhf-header-slim .tkhf-header-subtitle {
    left: var(--tkhf-subtitle-x-slim, 33%) !important;
    top: var(--tkhf-subtitle-y-slim, 50%) !important;
    font-size: clamp(14px, 2.35cqw, var(--tkhf-subtitle-size-slim, 38px)) !important;
}

.tkhf-header-decor {
    position: absolute !important;
    z-index: 1 !important;
    display: block !important;
    max-width: 16cqw !important;
    max-height: 58% !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    object-fit: contain !important;
    pointer-events: none !important;
}

.tkhf-header-decor-left {
    left: 2% !important;
    bottom: 10% !important;
}

.tkhf-header-menu {
    position: absolute !important;
    z-index: 40 !important;
    left: var(--tkhf-menu-x-full, 52%) !important;
    top: var(--tkhf-menu-y-full, 8%) !important;
    transform: translateX(-50%) !important;
    display: block !important;
    min-width: 120px !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    color: var(--tkhf-menu-text-color, #c40000) !important;
    font-family: var(--tkhf-menu-font, var(--tkhf-search-font, Arial, Helvetica, sans-serif)) !important;
    overflow: visible !important;
    pointer-events: auto !important;
}

.tkhf-menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: color-mix(in srgb, var(--tkhf-menu-label-bg, transparent) var(--tkhf-menu-label-bg-opacity, 100%), transparent) !important;
    box-shadow: none !important;
    color: currentColor !important;
    font: inherit !important;
    font-size: var(--tkhf-menu-label-size, 18px) !important;
    font-weight: var(--tkhf-menu-label-weight, 400) !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    appearance: none !important;
}

.tkhf-menu-panel {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 50% !important;
    transform: translate(-50%, -6px) !important;
    display: block !important;
    min-width: 220px !important;
    max-width: min(360px, 90cqw) !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: max-height 0.22s ease, opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease !important;
    background: color-mix(in srgb, var(--tkhf-menu-panel-bg, rgba(255,255,255,0.96)) var(--tkhf-menu-panel-bg-opacity, 100%), transparent) !important;
    box-shadow: 0 10px 28px rgba(0,0,0,0.16) !important;
    border: 0 !important;
    border-radius: 4px !important;
}

.tkhf-header-menu:hover .tkhf-menu-panel,
.tkhf-header-menu.is-open .tkhf-menu-panel,
.tkhf-header-menu:focus-within .tkhf-menu-panel {
    max-height: 520px !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translate(-50%, 0) !important;
}

.tkhf-menu-list {
    display: block !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 8px 0 20px 0 !important;
}

.tkhf-menu-list li {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.tkhf-menu-list a {
    display: block !important;
    padding: 9px 14px !important;
    color: var(--tkhf-menu-item-text-color, var(--tkhf-search-text-color, #000000)) !important;
    background: color-mix(in srgb, var(--tkhf-menu-item-bg, transparent) var(--tkhf-menu-item-bg-opacity, 100%), transparent) !important;
    font-size: var(--tkhf-menu-item-text-size, 15px) !important;
    font-family: var(--tkhf-menu-font, var(--tkhf-search-font, Arial, Helvetica, sans-serif)) !important;
    font-weight: var(--tkhf-menu-item-weight, 400) !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.tkhf-menu-list a:hover,
.tkhf-menu-list a:focus-visible {
    background: color-mix(in srgb, var(--tkhf-menu-item-hover-bg, rgba(0,0,0,0.08)) var(--tkhf-menu-item-hover-bg-opacity, 100%), transparent) !important;
    text-decoration: none !important;
}

.tkhf-search {
    position: absolute !important;
    z-index: 35 !important;
    left: var(--tkhf-search-x-full, 87%) !important;
    top: var(--tkhf-search-y-full, 16%) !important;
    transform: translateX(-100%) !important;
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: min(340px, 28cqw) !important;
    max-width: 42cqw !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    pointer-events: auto !important;
}

.tkhf-search input[type="search"] {
    display: block !important;
    order: 1 !important;
    flex: 0 1 auto !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    height: clamp(26px, 2.2cqw, 36px) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    opacity: 0 !important;
    color: var(--tkhf-search-text-color, #000000) !important;
    background: color-mix(in srgb, var(--tkhf-search-bg, #E1E1E1) var(--tkhf-search-bg-opacity, 100%), transparent) !important;
    font-family: var(--tkhf-search-font, Arial, Helvetica, sans-serif) !important;
    font-size: var(--tkhf-search-text-size, 16px) !important;
    font-weight: var(--tkhf-search-text-weight, 400) !important;
    line-height: 1 !important;
    transition: width 0.24s ease, opacity 0.18s ease, padding 0.24s ease !important;
    box-shadow: none !important;
    appearance: none !important;
}

.tkhf-search button {
    order: 2 !important;
    position: relative !important;
    flex: 0 0 clamp(30px, 2.8cqw, 46px) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: clamp(30px, 2.8cqw, 46px) !important;
    height: clamp(30px, 2.8cqw, 46px) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--tkhf-search-icon-color, #c40000) !important;
    cursor: pointer !important;
    appearance: none !important;
}

.tkhf-search button svg {
    display: block !important;
    width: clamp(24px, 2.35cqw, 38px) !important;
    height: clamp(24px, 2.35cqw, 38px) !important;
    overflow: visible !important;
    transform-origin: 50% 50% !important;
    animation: none !important;
}

/* V026: Die Lupe pulsiert nur auf der Login-/Startseite und nur nach der Anmeldung. */
.tkhf-header.tkhf-is-login-page.is-logged-in .tkhf-search button svg {
    animation: tkhf-search-pulse 5.5s ease-in-out infinite !important;
    will-change: transform !important;
}

@keyframes tkhf-search-pulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(2.5);
    }
}

.tkhf-search button circle,
.tkhf-search button path {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 6 !important;
    stroke-linecap: round !important;
}

.tkhf-search:hover input[type="search"],
.tkhf-search:focus-within input[type="search"],
.tkhf-search.is-open input[type="search"] {
    width: calc(100% - clamp(30px, 2.8cqw, 46px)) !important;
    padding: 0 12px !important;
    opacity: 1 !important;
}

.tkhf-header-back {
    position: absolute !important;
    z-index: 36 !important;
    left: var(--tkhf-header-back-x-full, 86%) !important;
    top: var(--tkhf-header-back-y-full, 53%) !important;
    transform: translate(-50%, -50%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: min(var(--tkhf-header-back-width-full, 13%), 190px) !important;
    min-width: 72px !important;
    max-height: 64% !important;
    aspect-ratio: 2.5 / 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: pointer !important;
    overflow: hidden !important;
    appearance: none !important;
}

.tkhf-header-back img {
    display: block !important;
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    object-fit: contain !important;
    transition: opacity 0.18s ease, transform 0.18s ease !important;
}

.tkhf-header-back span {
    position: absolute !important;
    z-index: 2 !important;
    left: 5% !important;
    right: 5% !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--tkhf-header-back-label-color, #000000) !important;
    -webkit-text-fill-color: var(--tkhf-header-back-label-color, #000000) !important;
    font-family: var(--tkhf-footer-label-font, Arial, Helvetica, sans-serif) !important;
    font-size: clamp(9px, 1.05cqw, 20px) !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
    opacity: 0 !important;
    pointer-events: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.tkhf-header-back:hover img,
.tkhf-header-back:focus-visible img {
    opacity: var(--tkhf-header-back-hover-opacity, 0.5) !important;
    transform: scale(0.98) !important;
}

.tkhf-header-back:hover span,
.tkhf-header-back:focus-visible span {
    opacity: 1 !important;
}

.tkhf-footer {
    position: relative !important;
    display: block !important;
    overflow: visible !important;
    height: var(--tkhf-footer-full-height, 112px) !important;
    min-height: var(--tkhf-footer-full-height, 112px) !important;
    background: transparent !important;
    container-type: inline-size;
}

.tkhf-footer-slim {
    height: var(--tkhf-footer-slim-height, 72px) !important;
    min-height: var(--tkhf-footer-slim-height, 72px) !important;
}

.tkhf-footer-inner {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(38px, var(--tkhf-footer-button-width, 10%)) minmax(0, var(--tkhf-footer-center-width, 72%)) minmax(38px, var(--tkhf-footer-button-width, 10%)) !important;
    align-items: center !important;
    justify-content: center !important;
    column-gap: 2.2% !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    white-space: nowrap !important;
    overflow: visible !important;
}

.tkhf-footer-slim .tkhf-footer-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
}

.tkhf-footer-center {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 1024px !important;
    height: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
}

.tkhf-footer-slim .tkhf-footer-center {
    width: min(100%, 1024px) !important;
    max-width: 1024px !important;
}

.tkhf-footer-center-figure {
    position: relative !important;
    display: inline-block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    line-height: 0 !important;
    overflow: visible !important;
}

.tkhf-footer-center-figure img {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: var(--tkhf-footer-full-height, 112px) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    object-fit: contain !important;
}

.tkhf-footer-slim .tkhf-footer-center-figure img {
    max-height: var(--tkhf-footer-slim-height, 72px) !important;
}

.tkhf-footer-copyright {
    position: absolute !important;
    z-index: 2 !important;
    right: 0 !important;
    left: auto !important;
    top: var(--tkhf-copyright-y, 53%) !important;
    transform: translateY(-50%) !important;
    display: block !important;
    max-width: 48% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--tkhf-copyright-color, #000000) !important;
    font-size: var(--tkhf-copyright-size-full, 11px) !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-align: right !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

.tkhf-footer-slim .tkhf-footer-copyright {
    font-size: var(--tkhf-copyright-size-slim, 9px) !important;
}

.tkhf-footer-nav,
.tkhf-footer-nav-placeholder {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 38px !important;
    max-width: 140px !important;
    height: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    appearance: none !important;
}

.tkhf-footer-nav {
    cursor: pointer !important;
}

.tkhf-footer-nav img {
    display: block !important;
    max-width: 100% !important;
    max-height: 82% !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    object-fit: contain !important;
    transition: opacity 0.18s ease, transform 0.18s ease !important;
}

.tkhf-footer-nav span {
    position: absolute !important;
    z-index: 2 !important;
    left: 2% !important;
    right: 2% !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--tkhf-footer-label-color, #000000) !important;
    font-family: var(--tkhf-footer-label-font, Arial, Helvetica, sans-serif) !important;
    font-size: clamp(9px, 1.25cqw, 22px) !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
    opacity: 0 !important;
    pointer-events: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.tkhf-footer-nav:hover img,
.tkhf-footer-nav:focus-visible img {
    opacity: var(--tkhf-footer-hover-opacity, 0.5) !important;
    transform: scale(0.98) !important;
}

.tkhf-footer-nav:hover span,
.tkhf-footer-nav:focus-visible span {
    opacity: 1 !important;
}

@media (max-width: 1120px) {
    .tkhf-menu-toggle { font-size: calc(var(--tkhf-menu-label-size, 18px) * 0.95) !important; }
    .tkhf-menu-list a { font-size: calc(var(--tkhf-menu-item-text-size, 15px) * 0.95) !important; }
    .tkhf-footer-inner { column-gap: 1.8% !important; }
}

@media (max-width: 992px) {
    .tkhf-menu-toggle { font-size: calc(var(--tkhf-menu-label-size, 18px) * 0.9) !important; }
    .tkhf-menu-list a { font-size: calc(var(--tkhf-menu-item-text-size, 15px) * 0.9) !important; }
    .tkhf-header { height: calc(var(--tkhf-header-full-height, 200px) * 0.82) !important; min-height: calc(var(--tkhf-header-full-height, 200px) * 0.82) !important; }
    .tkhf-header-slim { height: calc(var(--tkhf-header-slim-height, 112px) * 0.86) !important; min-height: calc(var(--tkhf-header-slim-height, 112px) * 0.86) !important; }
    .tkhf-footer { height: calc(var(--tkhf-footer-full-height, 112px) * 0.86) !important; min-height: calc(var(--tkhf-footer-full-height, 112px) * 0.86) !important; }
    .tkhf-footer-slim { height: calc(var(--tkhf-footer-slim-height, 72px) * 0.9) !important; min-height: calc(var(--tkhf-footer-slim-height, 72px) * 0.9) !important; }
}

@media (max-width: 768px) {
    .tkhf-menu-toggle { font-size: calc(var(--tkhf-menu-label-size, 18px) * 0.82) !important; }
    .tkhf-menu-list a { font-size: calc(var(--tkhf-menu-item-text-size, 15px) * 0.82) !important; }
    .tkhf-header { height: calc(var(--tkhf-header-full-height, 200px) * 0.68) !important; min-height: calc(var(--tkhf-header-full-height, 200px) * 0.68) !important; }
    .tkhf-header-slim { height: calc(var(--tkhf-header-slim-height, 112px) * 0.74) !important; min-height: calc(var(--tkhf-header-slim-height, 112px) * 0.74) !important; }
    .tkhf-footer { height: calc(var(--tkhf-footer-full-height, 112px) * 0.72) !important; min-height: calc(var(--tkhf-footer-full-height, 112px) * 0.72) !important; }
    .tkhf-footer-slim { height: calc(var(--tkhf-footer-slim-height, 72px) * 0.82) !important; min-height: calc(var(--tkhf-footer-slim-height, 72px) * 0.82) !important; }
    .tkhf-footer-inner { column-gap: 1% !important; padding: 0 !important; }
    .tkhf-footer-copyright { font-size: max(7px, calc(var(--tkhf-copyright-size-full, 11px) * 0.8)) !important; }
    .tkhf-footer-slim .tkhf-footer-copyright { font-size: max(6px, calc(var(--tkhf-copyright-size-slim, 9px) * 0.8)) !important; }
}

@media (max-width: 480px) {
    .tkhf-menu-toggle { font-size: calc(var(--tkhf-menu-label-size, 18px) * 0.74) !important; }
    .tkhf-menu-list a { font-size: calc(var(--tkhf-menu-item-text-size, 15px) * 0.74) !important; padding-top: 7px !important; padding-bottom: 7px !important; }
    .tkhf-header { height: calc(var(--tkhf-header-full-height, 200px) * 0.54) !important; min-height: calc(var(--tkhf-header-full-height, 200px) * 0.54) !important; }
    .tkhf-header-slim { height: calc(var(--tkhf-header-slim-height, 112px) * 0.66) !important; min-height: calc(var(--tkhf-header-slim-height, 112px) * 0.66) !important; }
    .tkhf-header-decor { max-width: 18cqw !important; max-height: 44% !important; }
    .tkhf-menu-panel { min-width: 170px !important; }
    .tkhf-footer { height: calc(var(--tkhf-footer-full-height, 112px) * 0.58) !important; min-height: calc(var(--tkhf-footer-full-height, 112px) * 0.58) !important; }
    .tkhf-footer-slim { height: calc(var(--tkhf-footer-slim-height, 72px) * 0.7) !important; min-height: calc(var(--tkhf-footer-slim-height, 72px) * 0.7) !important; }
    .tkhf-footer-inner { column-gap: 0.5% !important; }
    .tkhf-footer-copyright { font-size: 6px !important; }
    .tkhf-footer-nav, .tkhf-footer-nav-placeholder { min-width: 30px !important; }
}


/* V017: mobile touch separation for search icon and header back button */
@media (max-width: 768px) {
    .tkhf-header-full .tkhf-search {
        z-index: 90 !important;
        left: 91% !important;
        top: 5% !important;
        width: min(300px, 54cqw) !important;
        max-width: 54cqw !important;
        transform: translateX(-100%) !important;
    }

    .tkhf-header-full .tkhf-search button {
        flex-basis: 44px !important;
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        z-index: 95 !important;
        touch-action: manipulation !important;
    }

    .tkhf-header-full .tkhf-search button svg {
        width: 32px !important;
        height: 32px !important;
    }

    .tkhf-header-full .tkhf-search:hover input[type="search"],
    .tkhf-header-full .tkhf-search:focus-within input[type="search"],
    .tkhf-header-full .tkhf-search.is-open input[type="search"] {
        width: calc(100% - 44px) !important;
    }

    .tkhf-header-full .tkhf-header-back {
        z-index: 35 !important;
        top: 58% !important;
        max-height: 38% !important;
        pointer-events: auto !important;
    }
}

@media (max-width: 480px) {
    .tkhf-header-full .tkhf-search {
        left: 94% !important;
        top: 2% !important;
        width: min(270px, 68cqw) !important;
        max-width: 68cqw !important;
    }

    .tkhf-header-full .tkhf-search button {
        flex-basis: 46px !important;
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        min-height: 46px !important;
    }

    .tkhf-header-full .tkhf-search button svg {
        width: 34px !important;
        height: 34px !important;
    }

    .tkhf-header-full .tkhf-search:hover input[type="search"],
    .tkhf-header-full .tkhf-search:focus-within input[type="search"],
    .tkhf-header-full .tkhf-search.is-open input[type="search"] {
        width: calc(100% - 46px) !important;
    }

    .tkhf-header-full .tkhf-header-back {
        top: 66% !important;
        width: min(var(--tkhf-header-back-width-full, 13%), 130px) !important;
        min-width: 58px !important;
        max-height: 32% !important;
    }
}


/* V018: if the search slideout opens on small screens, place it below the title and hide the icon. */
@media (max-width: 768px) {
    .tkhf-header-full .tkhf-search.is-open,
    .tkhf-header-full .tkhf-search:focus-within {
        left: 50% !important;
        top: 72% !important;
        width: min(620px, 88cqw) !important;
        max-width: 88cqw !important;
        transform: translateX(-50%) !important;
        z-index: 120 !important;
    }

    .tkhf-header-full .tkhf-search.is-open input[type="search"],
    .tkhf-header-full .tkhf-search:focus-within input[type="search"] {
        width: 100% !important;
        padding: 0 12px !important;
        opacity: 1 !important;
    }

    .tkhf-header-full .tkhf-search.is-open button,
    .tkhf-header-full .tkhf-search:focus-within button {
        flex-basis: 0 !important;
        width: 0 !important;
        min-width: 0 !important;
        padding: 0 !important;
        opacity: 0 !important;
        overflow: hidden !important;
        pointer-events: none !important;
    }
}

@media (max-width: 480px) {
    .tkhf-header-full .tkhf-search.is-open,
    .tkhf-header-full .tkhf-search:focus-within {
        top: 78% !important;
        width: min(520px, 92cqw) !important;
        max-width: 92cqw !important;
    }
}

/* V020: ensure search icon/form is hidden on the EasyPosts overview page in every responsive state. */
.tkhf-header.tkhf-is-overview-page .tkhf-search,
.tkhf-header.tkhf-is-overview-page .tkhf-search.is-open,
.tkhf-header.tkhf-is-overview-page .tkhf-search:focus-within {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* V020: reinforced overview-page search suppression in all breakpoints. */
.tkhf-header.tkhf-is-overview-page .tkhf-search * {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* V021: Suche/Lupe oeffnet direkt die Suchseite. Kein Slideout-Suchfeld mehr. */
.tkhf-search-direct {
    width: clamp(30px, 2.8cqw, 46px) !important;
    max-width: clamp(30px, 2.8cqw, 46px) !important;
}

.tkhf-search-direct input[type="search"],
.tkhf-search-direct input[type="hidden"] {
    display: none !important;
}

.tkhf-search-direct:hover input[type="search"],
.tkhf-search-direct:focus-within input[type="search"],
.tkhf-search-direct.is-open input[type="search"] {
    display: none !important;
    width: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
}


/* V023: Header darf den Seiteninhalt nicht ueberdecken. Dynamisches Inline-CSS steuert, ob diese Ebene aktiv ist. */
.tkhf-header {
    background-color: transparent;
}

/* V025: Login-/Startseite ohne Top- und Zurueck-Navigation. */
.tkhf-header.tkhf-is-login-page .tkhf-header-back,
.tkhf-footer.tkhf-is-login-page .tkhf-footer-top,
.tkhf-footer.tkhf-is-login-page .tkhf-footer-back {
    display: none !important;
}
