/* This page owns its layout: no fixed-nav or hero overrides from styles.css. */
@font-face {
    font-family:Outfit;
    src:url('assets/fonts/outfit-latin.woff2') format('woff2');
    font-style:normal;
    font-weight:100 900;
    font-display:swap
}

@font-face {
    font-family:'Matcha World';
    src:url('assets/fonts/matcha-world-de.woff2') format('woff2');
    font-style:normal;
    font-weight:400;
    font-display:swap
}

:root {
    color-scheme:light;
    --ink:#292d39;
    --coral:#f87869;
    --paper:#fff7ef;
    --night:#263c48;
    --mint:#d7eee5;
    --radius:24px
}

* {
    box-sizing:border-box
}

html {
    scroll-behavior:smooth;
    scroll-padding-top:110px
}

body {
    margin:0;
    background:var(--coral);
    color:var(--ink);
    font:400 17px/1.65 var(--hk-font-body, Outfit),system-ui,sans-serif
}

button,input {
    font:inherit
}

button,a,input {
    -webkit-tap-highlight-color:transparent
}

a {
    color:inherit;
    text-underline-offset:4px
}

button {
    cursor:pointer
}

button:disabled {
    cursor:default;
    opacity:.45
}

img {
    display:block;
    max-width:100%;
    height:auto
}

svg {
    flex-shrink:0
}

[hidden] {
    display:none!important
}

:focus-visible {
    outline:3px solid #1e6673;
    outline-offset:5px
}

.skip-link {
    position:fixed;
    top:8px;
    left:20px;
    padding:12px 20px;
    z-index:2000;
    background:white;
    transform:translateY(-150%)
}

.skip-link:focus {
    transform:none
}

.glass-nav {
    position:sticky;
    top:14px;
    width:calc(100% - 40px);
    max-width:1140px;
    min-height:72px;
    margin:14px auto 0;
    padding:10px 24px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    border:1px solid #ffffff80;
    border-radius:999px;
    background:#fff7eff5;
    box-shadow:0 8px 28px #63372b14;
    z-index:100
}

.logo-container {
    display:flex;
    align-items:center;
    flex-shrink:0
}

.logo-img {
    width:40px;
    height:40px;
    object-fit:contain
}

.nav-links {
    display:flex;
    align-items:center;
    gap:24px
}

.nav-links a {
    text-decoration:none;
    font-size:.95rem;
    font-weight:600;
    white-space:nowrap
}

.nav-links a:not(.cta-button):hover {
    color:var(--ink)
}

.nav-links a[aria-current='page'] {
    color:var(--ink);
    font-weight:700
}

.nav-links .cta-button {
    padding:10px 22px;
    border-radius:999px;
    background:#0071e3;
    color:white
}

.nav-links .cta-button:hover {
    background:#005ec1;
    color:white
}

.hk-container {
    width:100%;
    max-width:1140px;
    margin-inline:auto;
    padding-inline:24px
}

.hk-band-hero {
    background:var(--coral);
    padding:36px 0 64px
}

.hk-hero {
    text-align:center;
    max-width:940px;
    margin:auto
}

.badge {
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:7px 16px;
    border:1px solid #803b2a38;
    border-radius:999px;
    font-size:.82rem;
    font-weight:600;
    background:#fff7ef65
}

.hk-hero-title,.hk-stage-title,.hk-lib-title h2,.hk-section h2,.hk-alexa-headline,.hoerprobe-title,.hk-final h2 {
    font-family:var(--hk-font-heading, 'Matcha World'),var(--hk-font-body, Outfit),sans-serif;
    font-weight:400;
    line-height:1.2;
    letter-spacing:.015em;
    text-wrap:balance
}

.hk-hero-title {
    max-width:850px;
    margin:24px auto;
    font-size:clamp(2.1rem,5.7vw,4.1rem)
}

.hk-lead {
    max-width:760px;
    margin:0 auto;
    font-size:clamp(1rem,1.7vw,1.17rem);
    line-height:1.75
}

.hk-rating {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
    width:fit-content;
    max-width:100%;
    margin:0 auto 22px;
    padding:9px 16px;
    border:1px solid #803b2a38;
    border-radius:18px;
    background:var(--paper);
    font-size:.88rem;
    line-height:1.5
}

.hk-rating-stars { flex:none; }

.hk-rating-source {
    flex-basis:100%;
    color:#5a514c;
    font-size:.78rem
}

.hk-cta-row {
    display:flex;
    justify-content:center;
    gap:12px;
    flex-wrap:wrap;
    margin-top:26px
}

.hk-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:12px 24px;
    border-radius:999px;
    font-size:.95rem;
    font-weight:700;
    text-decoration:none;
    transition:transform .2s
}

.hk-btn:hover {
    transform:translateY(-2px)
}

.hk-btn--primary {
    background:var(--ink);
    color:#fff
}

.hk-btn--ghost {
    border:1px solid currentColor;
    background:#ffffff24
}

.hk-trust {
    display:flex;
    gap:10px 22px;
    justify-content:center;
    flex-wrap:wrap;
    padding:0;
    margin:24px 0 0;
    list-style:none;
    font-size:.84rem;
    font-weight:500
}

.hk-trust li::before {
    content:'';
    display:inline-block;
    width:14px;
    height:14px;
    margin-right:5px;
    vertical-align:-2px;
    background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat
}

.hk-stage {
    margin:44px auto 0;
    padding:32px;
    background:var(--paper);
    border:1px solid #ffffffa0;
    border-radius:32px;
    box-shadow:0 18px 55px #7b392523;
    scroll-margin-top:110px
}

.hk-stage-grid {
    display:grid;
    grid-template-columns:minmax(190px,270px) minmax(0,1fr);
    align-items:center;
    gap:40px
}

.hk-stage-cover {
    position:relative;
    aspect-ratio:9/16;
    overflow:hidden;
    border-radius:20px;
    background:#eadbd0
}

.hk-stage-cover img,.hk-stage-cover video {
    width:100%;
    height:100%;
    object-fit:contain;
    position:absolute;
    inset:0
}

.hk-stage-anim-tag {
    position:absolute;
    bottom:14px;
    left:14px;
    padding:5px 10px;
    border-radius:999px;
    background:#292d39dc;
    color:white;
    font-size:.7rem;
    display:flex;
    align-items:center;
    gap:6px
}

.hk-anim-dot {
    width:6px;
    height:6px;
    border-radius:50%;
    background:#c7e9d8
}

.hk-stage-meta {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px 10px;
    font-size:.75rem;
    font-weight:600;
    color:#59636a
}

.hk-stage-chip {
    flex-basis:100%;
    color:#874332;
    font-weight:700;
    margin-bottom:4px
}

.hk-stage-title {
    font-size:clamp(1.55rem,3.2vw,2.4rem);
    margin:16px 0 12px
}

.hk-stage-sub {
    color:#535c62;
    font-size:1rem;
    line-height:1.7;
    margin:0 0 22px
}

.hk-stage-chap-bar {
    display:flex;
    flex-direction:column;
    gap:3px;
    margin-bottom:20px;
    padding:14px 16px;
    background:#ece6dd;
    border-radius:14px;
    font-size:.9rem
}

.hk-stage-chap-sub {
    font-size:.78rem;
    color:#5c605f
}

.hk-scrub-wrap {
    margin-bottom:22px
}

.hk-scrub-track {
    display:block;
    width:100%;
    height:24px;
    margin:0;
    accent-color:#9b4336;
    cursor:pointer
}

.hk-scrub-times {
    display:flex;
    justify-content:space-between;
    font-size:.78rem;
    color:#5c605f
}

.hk-controls {
    display:grid;
    grid-template-columns:46px minmax(0,1fr) 46px;
    align-items:center;
    max-width:440px;
    gap:10px
}

.hk-btn-bigplay {
    display:inline-flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    min-height:52px;
    min-width:0;
    padding:12px 22px;
    border:0;
    border-radius:999px;
    background:var(--ink);
    color:white;
    font-weight:700;
    font-size:.95rem
}

.hk-btn-skip {
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    border:1px solid #c7c1b8;
    background:transparent;
    border-radius:50%;
    color:var(--ink)
}

.hk-btn-skip:hover {
    background:#e8e0d5
}

.hk-autoplay-hint {
    grid-column:1/-1;
    width:100%;
    margin-top:4px;
    font-size:.78rem;
    color:#5c605f
}

.hk-stage.is-playing {
    border-color:#874332
}

.hk-band-library {
    background:var(--paper);
    padding:70px 0
}

.hk-lib-header {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    flex-wrap:wrap;
    margin-bottom:28px
}

.hk-kicker,.hoerprobe-tag {
    display:inline-block;
    font-size:.73rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
    margin-bottom:14px
}

.hk-lib-title h2,.hk-section h2 {
    font-size:clamp(1.8rem,3.5vw,2.7rem);
    margin:0 0 16px;
    max-width:850px
}

.hk-lib-title p {
    margin:0;
    max-width:650px;
    color:#535c62
}

.hk-filters {
    display:flex;
    gap:8px;
    flex-wrap:wrap
}

.hk-filter-btn {
    border:1px solid #cdc7bd;
    background:transparent;
    border-radius:999px;
    min-height:44px;
    padding:8px 16px;
    font-size:.85rem;
    font-weight:600;
    color:var(--ink)
}

.hk-filter-btn.active {
    background:var(--ink);
    border-color:var(--ink);
    color:white
}

.hk-cards-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
    margin-bottom:64px
}

.hk-card {
    display:flex;
    flex-direction:column;
    gap:16px;
    min-width:0;
    padding:16px;
    background:#fff;
    border:1px solid #e5ded5;
    border-radius:var(--radius);
    scroll-margin-top:110px;
    transition:border-color .2s,box-shadow .2s
}

.hk-card:hover {
    border-color:#b56856;
    box-shadow:0 6px 24px #63372b10
}

.hk-card.is-active {
    border-color:#a04b3d;
    box-shadow:0 0 0 1px #a04b3d
}

.hk-card-top {
    display:flex;
    gap:16px;
    align-items:center
}

.hk-card-cover {
    width:110px;
    min-width:110px;
    aspect-ratio:9/16;
    border-radius:14px;
    overflow:hidden;
    background:#eee7dd
}

.hk-card-cover img {
    width:100%;
    height:100%;
    object-fit:contain
}

.hk-card-head {
    min-width:0
}

.hk-card-tags {
    font-size:.68rem;
    color:#73503d;
    font-weight:600;
    line-height:1.6
}

.hk-card-tags span {
    display:block
}

.hk-card-head h3 {
    font-size:1.12rem;
    line-height:1.35;
    margin:8px 0
}

.hk-card-head h3 a {
    text-decoration:none
}

.hk-card-dur {
    font-size:.73rem;
    color:#626761
}

.hk-card-desc {
    margin:0;
    font-size:.88rem;
    line-height:1.65;
    color:#535c62
}

.hk-card-action {
    margin-top:auto
}

.hk-card-playbtn {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
    min-height:46px;
    border:1px solid #d8c6b8;
    border-radius:999px;
    background:#fff7ef;
    color:var(--ink);
    font-size:.86rem;
    font-weight:600
}

.hk-card-playbtn:hover,.hk-card.is-active .hk-card-playbtn {
    background:var(--ink);
    border-color:var(--ink);
    color:white
}

.hk-section {
    padding:40px 0 10px
}

.hk-section>p,.hk-prose p {
    font-size:1.03rem;
    line-height:1.8;
    margin:0 0 18px;
    max-width:880px
}

.hk-ages {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    margin-top:28px
}

.hk-age {
    padding:24px;
    border-radius:var(--radius);
    background:#e1eee4
}

.hk-age--b {
    background:#f8dfcd
}

.hk-age--c {
    background:#e4e0f0
}

.hk-age-badge {
    font-size:.75rem;
    font-weight:700;
    letter-spacing:.08em
}

.hk-age h3 {
    font-size:1.2rem;
    margin:8px 0
}

.hk-age p,.hk-age ul {
    font-size:.9rem;
    line-height:1.75
}

.hk-age ul {
    padding-left:18px
}

.hk-band-coral {
    background:#ef927e;
    padding:76px 0
}

.hk-alexa-hero-grid {
    display:grid;
    grid-template-columns:1.4fr .7fr;
    gap:40px;
    align-items:center
}

.hk-alexa-headline {
    font-size:clamp(1.9rem,4vw,3rem);
    margin:0 0 20px
}

.hk-alexa-intro p {
    font-size:1.02rem
}

.hk-alexa-intro a,.hk-band-coral>div>p a {
    color:var(--ink)!important
}

.hk-alexa-intro .hk-kicker {
    color:var(--ink)!important;
    background:#fff7ef80!important;
    border:0!important
}


.hk-alexa-ctas {
    display:flex;
    gap:12px;
    flex-wrap:wrap
}

.hk-alexa-amazon-btn,.hk-alexa-sublink {
    display:inline-flex;
    gap:8px;
    align-items:center;
    padding:12px 20px;
    border:1px solid var(--ink);
    border-radius:999px;
    text-decoration:none;
    font-size:.9rem;
    font-weight:600
}

.hk-alexa-amazon-btn {
    background:var(--ink);
    color:white!important
}

.hk-alexa-intro a.hk-alexa-amazon-btn {
    color:white!important
}

.hk-alexa-device-img {
    width:100%;
    max-width:320px;
    margin:auto
}

.alexa-rubriken {
    text-align:center;
    border-top:1px solid #292d3930;
    margin:40px 0 0;
    padding:34px 0
}

.hoerprobe-title {
    font-size:clamp(1.7rem,3.7vw,2.6rem);
    margin:0 0 24px
}

.alexa-rubriken-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
    max-width:820px;
    margin:auto
}

.mt-rubrik-kachel {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:66px;
    padding:14px;
    border-radius:16px;
    text-decoration:none;
    font-weight:700;
    font-size:1.1rem;
    background:#ffdf86
}

.mt-rubrik-kachel--anime {
    background:#f3c4d7
}

.mt-rubrik-kachel--superheroes {
    background:#ffb6a0
}

.mt-rubrik-kachel--animals {
    background:#d3e9b0
}

.mt-rubrik-kachel--icefire {
    background:linear-gradient(100deg,#c6e1f2,#f9c49f)
}

.mt-rubrik-kachel--aladdin {
    background:#e3c8ef
}

.mt-rubrik-kachel:hover {
    box-shadow:0 5px 20px #63372b20
}

.hk-alexa-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px
}

.hk-alexa-kachel {
    display:flex;
    gap:12px;
    align-items:flex-start;
    padding:20px;
    border-radius:20px;
    background:#fff7ef80;
    color:var(--ink);
    text-decoration:none
}

.hk-alexa-badge {
    display:grid;
    place-items:center;
    flex-shrink:0;
    width:30px;
    height:30px;
    border-radius:50%;
    background:#fff7ef;
    font-size:.8rem;
    font-weight:700
}

.hk-alexa-khead h3 {
    font-size:1rem;
    line-height:1.4;
    margin:0 0 6px
}

.hk-alexa-kbody p {
    font-size:.83rem;
    margin:0 0 12px;
    line-height:1.6
}

.hk-alexa-kplay {
    font-size:.75rem;
    font-weight:700
}

.hk-band-coral>div>p {
    color:var(--ink)!important
}

.hk-band-app {
    background:var(--mint);
    padding:60px 0
}

.hk-split {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:30px;
    margin-top:28px
}

.hk-feature {
    display:flex;
    gap:14px;
    margin-bottom:24px
}

.hk-feature-ic {
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    flex-shrink:0;
    border-radius:14px;
    background:#fff7ef90;
    font-size:1.2rem
}

.hk-feature h3 {
    font-size:1.05rem;
    margin:0 0 5px
}

.hk-feature p {
    font-size:.92rem;
    margin:0
}

.hk-table-wrap {
    overflow:auto;
    margin-top:28px;
    border-radius:20px;
    background:#ffffffa0;
    border:1px solid #263c4820
}

.hk-table {
    border-collapse:collapse;
    width:100%;
    text-align:left;
    font-size:.9rem
}

.hk-table th,.hk-table td {
    padding:16px;
    border-bottom:1px solid #263c4820
}

.hk-table th {
    background:#263c48;
    color:#fff
}

.hk-table tr:last-child td {
    border:0
}

.hk-band-guide {
    background:#f4e7de;
    padding:60px 0
}

.hk-faq {
    margin-top:28px
}

.hk-faq details {
    margin:0 0 12px;
    background:#fff7ef;
    border:1px solid #ded1c7;
    border-radius:18px;
    padding:0 22px
}

.hk-faq summary {
    cursor:pointer;
    padding:20px 0;
    font-weight:600;
    font-size:1rem
}

.hk-faq details p {
    margin:0 0 22px;
    font-size:.95rem;
    line-height:1.8
}

.hk-final {
    margin:50px 0 20px;
    padding:44px 24px;
    background:#ef927e;
    border-radius:28px;
    text-align:center
}

.hk-final h2 {
    font-size:clamp(1.8rem,3.7vw,2.8rem);
    margin:0 0 20px
}

.hk-final p {
    max-width:650px;
    margin:auto
}

.hk-floatbar {
    position:fixed;
    bottom:max(16px,env(safe-area-inset-bottom));
    left:50%;
    transform:translateX(-50%);
    width:calc(100% - 32px);
    max-width:660px;
    z-index:110;
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 16px;
    background:#263c48;
    color:white;
    border:1px solid #ffffff30;
    border-radius:22px;
    box-shadow:0 10px 40px #0003
}

.hk-float-cover {
    width:40px;
    height:56px;
    flex-shrink:0;
    overflow:hidden;
    border-radius:8px
}

.hk-float-cover img {
    width:100%;
    height:100%;
    object-fit:contain
}

.hk-float-text {
    flex:1;
    min-width:0
}

.hk-float-title {
    font-size:.86rem;
    font-weight:600;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}

.hk-float-sub {
    font-size:.72rem;
    color:#e1eee4
}

.hk-float-controls {
    display:flex;
    gap:6px
}

.hk-float-btn {
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border:0;
    border-radius:50%;
    background:transparent;
    color:white
}

.hk-float-btn--main {
    background:#f8ae99;
    color:var(--ink)
}

@media(max-width:1000px) {
    .hk-cards-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .hk-alexa-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .hk-ages {
        grid-template-columns:1fr
    }
    .nav-links {
        gap:16px
    }
    .hk-stage-grid {
        gap:28px
    }
}

@media(max-width:700px) {
    html {
        scroll-padding-top:88px
    }
    body {
        font-size:16px
    }
    .glass-nav {
        top:8px;
        width:calc(100% - 24px);
        margin-top:8px;
        padding:8px 12px;
        min-height:64px;
        gap:8px
    }
    .nav-links {
        gap:10px
    }
    .nav-links a {
        display:inline-flex;
        align-items:center;
        min-height:44px;
        font-size:.84rem
    }
    .nav-links a[href='index.html'] {
        display:none
    }
    .nav-links .cta-button {
        padding:9px 13px
    }
    .hk-container {
        padding-inline:20px
    }
    .hk-band-hero {
        padding:28px 0 44px
    }
    .hk-hero-title {
        font-size:clamp(1.9rem,6.5vw,2.8rem);
        margin:22px 0
    }
    .hk-cta-row {
        gap:10px
    }
    .hk-btn {
        font-size:.84rem;
        padding:11px 18px
    }
    .hk-trust {
        font-size:.75rem;
        gap:8px 14px
    }
    .hk-stage {
        padding:16px;
        margin-top:30px;
        margin-inline:-8px;
        scroll-margin-top:0;
        border-radius:24px
    }
    .hk-stage-grid {
        grid-template-columns:1fr;
        gap:20px
    }
    .hk-stage-cover {
        width:min(100%,260px);
        margin:auto
    }
    .hk-stage-info {
        display:flex;
        flex-direction:column;
        min-width:0
    }
    .hk-stage-title {
        font-size:1.65rem
    }
    .hk-stage-sub {
        order:1;
        margin:18px 0 0;
        font-size:.95rem
    }
    .hk-stage-meta {
        font-size:.7rem
    }
    .hk-stage-chap-bar {
        margin-bottom:12px;
        padding:12px;
        font-size:.85rem
    }
    .hk-scrub-wrap {
        margin-bottom:14px
    }
    .hk-scrub-track {
        height:32px
    }
    .hk-controls {
        grid-template-columns:48px minmax(0,1fr) 48px;
        gap:8px
    }
    .hk-btn-skip {
        width:48px;
        height:48px
    }
    .hk-btn-bigplay {
        min-height:56px;
        padding:10px;
        font-size:.9rem;
        line-height:1.25
    }
    .hk-autoplay-hint {
        display:none
    }
    .hk-band-library,.hk-band-coral,.hk-band-app,.hk-band-guide {
        padding:46px 0
    }
    .hk-cards-grid {
        grid-template-columns:1fr;
        gap:16px
    }
    .hk-card-cover {
        width:110px;
        min-width:110px
    }
    .hk-card-head h3 {
        font-size:1.25rem
    }
    .hk-alexa-hero-grid,.hk-split {
        grid-template-columns:1fr
    }
    .hk-alexa-device-wrap {
        order:2
    }
    .hk-alexa-device-img {
        max-width:220px
    }
    .alexa-rubriken-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .hk-alexa-grid {
        grid-template-columns:1fr
    }
    .hk-alexa-headline {
        font-size:2rem
    }
        .hk-floatbar {
        padding:10px;
        gap:8px
    }
    .hk-float-controls {
        gap:0
    }
    .hk-float-btn {
        width:36px;
        height:40px
    }
    .hk-float-cover {
        display:none
    }
    .hk-float-title {
        font-size:.78rem
    }
    .hk-float-sub {
        font-size:.65rem
    }
    .hk-table th,.hk-table td {
        padding:12px;
        min-width:135px
    }
    .hk-table {
        font-size:.8rem
    }
    .hk-final {
        padding:32px 20px
    }
    .hk-faq details {
        padding:0 18px
    }
}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
    *,*::before,*::after {
        animation:none!important;
        transition:none!important
    }
}

.hk-hero-title-sub {
    display:block;
    margin:0 auto 24px;
    font-family:var(--hk-font-body, Outfit),system-ui,sans-serif;
    font-size:clamp(.9rem,2vw,1.3rem);
    font-weight:600;
    letter-spacing:0;
    line-height:1.5
}

.hk-alexa-grid {
    padding:0;
    list-style:none
}

.hk-alexa-kachel {
    height:100%
}

.hk-topic-heading {
    margin:6px 0 20px;
    font-size:1.1rem
}

.hk-related {
    margin:28px 0 0;
    text-align:center;
    font-size:.95rem
}

.hk-related a {
    font-weight:600
}
/* Defer layout and paint for content below the viewport; all text stays in HTML. */
.hk-card {
    content-visibility: auto;
    contain-intrinsic-size: auto 400px;
}

/* Same footer proportions and responsive sizes as the other landing pages. */
/* Footer Expanded */
.main-footer {
  padding: 8vw 2vw 4vw; /* Matched Alexa Footer Width/Padding */
  background: var(--night);
  color: #fff;
  line-height: 1.6;
  border-top: 1px solid rgba(255,255,255,.12);
}

.main-footer .container {
  max-width: none;
  width: 100%;
  padding: 0;
  margin: 0;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.5fr 1fr 1fr; /* Globally unified ratio */
  gap: 2vw; /* Consistent with new design spacing */
  margin-bottom: 4rem;
  align-items: start;
}

.footer-logo {
  display: flex;
  align-items: center;
  gap: 0.36vw;
  margin: 0 0 1vw;
}

.footer-logo-img {
  width: 1.8vw;
  height: auto;
  display: block;
  transform: none;
}

.footer-wordmark {
  width: auto;
  height: 2.2vw;
  margin-top: 0;
  display: block;
  transform: translateY(0.14vw);
}

.footer-col p {
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.9vw;
  margin: 0;
  line-height: 1.5;
}

.footer-col h4 {
  font-size: 0.9vw; /* Matched Alexa Scale */
  font-weight: 800;
  margin-bottom: 2vw;
  color: rgba(255, 255, 255, 0.75);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.footer-col a {
  display: block;
  color: #fff;
  text-decoration: none;
  font-size: 1vw; /* Matched Alexa Scale */
  margin-bottom: 1vw;
  font-weight: 500;
  transition: 0.3s;
}

.footer-col a:hover {
  color: var(--coral);
}

.lang-selector {
  display: flex;
  gap: 1.5rem; /* Matched spacing */
  flex-wrap: wrap;
  margin-top: 0.5rem;
}

.lang-link {
  display: inline-block; /* Force horizontal */
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.75);
  font-weight: 700;
  text-decoration: none;
  font-size: 0.9rem;
}

.lang-link.active {
  color: #fff;
}

.lang-link:hover {
  color: var(--coral);
}

.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding-top: 2vw;
  display: flex;
  justify-content: space-between;
  font-size: 0.8vw; /* Matched Alexa Scale */
  color: rgba(255, 255, 255, 0.75);
  font-weight: 500;
}

/* Tablet-Footer: nach den vw-Basisregeln, sonst überschreibt 1vw die lesbare Schrift */
@media (min-width: 769px) and (max-width: 1199px) {
  .main-footer {
    padding: 3.25rem 2.5rem 2.75rem;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2.4rem 3rem;
    margin-bottom: 2rem;
    align-items: start;
  }

  .footer-col:first-child {
    grid-column: 1 / -1;
    padding-bottom: 1.25rem;
    margin-bottom: 0.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }

  .footer-logo {
    gap: 0.55rem;
    margin-bottom: 0.5rem;
  }

  .footer-logo-img {
    width: 40px;
    height: 40px;
  }

  .footer-wordmark {
    height: 32px;
    transform: none;
  }

  .footer-col p {
    font-size: 1rem;
    line-height: 1.5;
  }

  .footer-col h4 {
    font-size: 0.78rem;
    margin-bottom: 1rem;
    letter-spacing: 0.08em;
  }

  .footer-col a {
    font-size: 1.05rem;
    line-height: 1.45;
    margin-bottom: 0.7rem;
    overflow-wrap: break-word;
  }

  /* Entdecken: volle Breite, Links zweispaltig – sonst hängt die Spalte durch */
  .footer-col:nth-child(4) {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 2.5rem;
  }

  .footer-col:nth-child(4) h4 {
    grid-column: 1 / -1;
  }

  .lang-selector {
    gap: 1.15rem;
  }

  .lang-link {
    font-size: 1.05rem;
  }

  .footer-bottom {
    font-size: 0.9rem;
    padding-top: 1.75rem;
  }
}


@media (max-width: 768px) {
  .main-footer {
    padding: 15vw 5vw 8vw;
  }

  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10vw;
    text-align: left;
  }

  .footer-col h4 {
    font-size: 4vw; /* Slightly adjusted for readable scale */
    margin-bottom: 4vw;
  }

  .footer-col a, .footer-col p {
    font-size: 3.8vw;
    margin-bottom: 3vw;
  }

  .footer-logo-img {
    width: 6vw;
    height: auto; /* Prevent distortion on mobile */
    transform: none;
  }

  .footer-wordmark {
    height: 6.6vw;
    margin-top: 0;
    transform: translateY(0.42vw);
  }

  .footer-bottom {
    flex-direction: column;
    gap: 4vw;
    font-size: 3.5vw;
    align-items: flex-start;
    padding-top: 5vw;
  }

  .lang-selector {
    gap: 4vw;
  }

  .lang-link {
    font-size: 3.8vw;
  }

}

.hk-feature-ic svg { width:24px; height:24px; }
.hk-alexa-kplay { display:inline-flex; align-items:center; gap:5px; }

/* Hash links must use real section heights, as on the shared landing pages. */
html:has(:target) .hk-card {
    content-visibility: visible;
}

.hk-ages { grid-template-columns:repeat(2,minmax(0,1fr)); }
.hk-age--d { background:#f2dfe9; }
@media(max-width:1000px) { .hk-ages { grid-template-columns:1fr; } }