/* WeissKlang L1 product detail ------------------------------------------- */

.l1-product-page {
    --l1p-nav-height: 3.35rem;
    --l1p-nav-edge-gap: clamp(1.6rem, 2.8vw, 3.25rem);
    --l1p-anchor-depth: 1.5rem;
    --l1p-anchor-scroll-shift: 3.125rem;
    background: #000000;
}

.l1-product-page .site-header {
    position: relative;
}

.l1-product-page .l1p-product-nav {
    border-bottom-color: rgba(100, 37, 123, 0.38);
    background: rgba(9, 5, 13, 0.84);
}

.l1-product-page .l1p-product-nav.is-stuck {
    border-bottom-color: rgba(100, 37, 123, 0.58);
    background: rgba(7, 3, 11, 0.78);
}

.l1-product-page .l1p-product-nav__link:hover,
.l1-product-page .l1p-product-nav__link:focus-visible,
.l1-product-page .l1p-product-nav__link.is-active,
.l1-product-page .l1p-product-nav__top:hover,
.l1-product-page .l1p-product-nav__top:focus-visible {
    color: #5da4d0;
}

.l1-product-page .l1-hero {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.18), transparent 28%, transparent 72%, rgba(0, 0, 0, 0.18)),
        url("../images/l1startp.jpg") center / cover no-repeat;
}

.l1-product-page .l1-hero__heading h1 {
    text-align: center;
}

.l1-product-page .l1-hero__heading h1 strong {
    color: #64257b;
    font-size: 1.18em;
    font-weight: 700;
}

.l1-feature .l1p-feature__inner {
    grid-template-columns: minmax(19rem, 0.72fr) minmax(0, 1.06fr);
    grid-template-areas:
        ". logo"
        "media details";
}

.l1-feature .l1p-feature__logo {
    justify-self: end;
}

.l1-feature .l1p-feature__details,
.l1-feature .l1p-feature__list,
.l1-feature .l1p-feature__uses {
    margin-left: auto;
}

.l1-feature .l1p-feature__details {
    align-items: flex-end;
    text-align: right;
}

.l1-feature .l1p-feature__list li {
    margin-left: auto;
}

.l1-feature .l1p-feature__uses {
    text-align: right;
}

.l1-feature .l1p-feature__list i {
    background: #64257b;
}

.l1-feature .l1p-feature__list li:hover {
    color: #b889cc;
}

.l1-feature .l1p-feature__media {
    transform: translateX(-5rem) scale(0.975);
}

.l1-feature.is-visible .l1p-feature__media {
    transform: translateX(0) scale(1);
}

.l1-feature .l1p-feature__video {
    justify-self: start;
}

.l1-product-page .l1-story-group {
    background: #000000;
}

.l1-product-page .l1-story {
    min-height: clamp(43rem, 55vw, 55rem);
}

.l1-product-page .l1-story .l1p-story__background,
.l1-product-page .l1-story--one .l1p-story__background {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    background: transparent;
}

.l1-product-page .l1-story--one .l1p-story__background {
    object-position: 0 center;
    transform: scale(0.8);
    transform-origin: left bottom;
}

.l1-product-page .l1-story--two .l1p-story__background {
    object-position: right center;
}

.l1-product-page .l1-story--three .l1p-story__background,
.l1-product-page .l1-story--four .l1p-story__background {
    object-position: left center;
}

.l1-product-page .l1-story--five .l1p-story__background {
    object-position: right center;
}

.l1-product-page .l1-story--one::after {
    background: linear-gradient(270deg, #ffffff 0%, rgba(255, 255, 255, 0.97) 32%, rgba(255, 255, 255, 0.62) 47%, rgba(255, 255, 255, 0) 63%);
}

.l1-product-page .l1-story--two::after {
    background: linear-gradient(90deg, rgba(4, 2, 7, 0.98) 0%, rgba(9, 4, 13, 0.94) 42%, rgba(22, 8, 28, 0.54) 61%, rgba(0, 0, 0, 0) 79%);
}

.l1-product-page .l1-story--three::after {
    background: linear-gradient(270deg, rgba(1, 8, 18, 0.97) 0%, rgba(4, 18, 35, 0.91) 43%, rgba(13, 44, 67, 0.5) 62%, rgba(0, 0, 0, 0) 80%);
}

.l1-product-page .l1-story--four::after {
    background: linear-gradient(90deg, rgba(8, 4, 4, 0.98) 0%, rgba(17, 9, 8, 0.93) 43%, rgba(53, 28, 21, 0.5) 62%, rgba(0, 0, 0, 0) 80%);
}

.l1-product-page .l1-story--five::after {
    background: linear-gradient(270deg, rgba(1, 6, 14, 0.98) 0%, rgba(4, 15, 29, 0.93) 43%, rgba(14, 44, 72, 0.5) 62%, rgba(0, 0, 0, 0) 80%);
}

.l1-product-page .l1-story .l1p-story__content h2 {
    overflow: visible;
    padding: 0.08em 0.08em 0.16em;
    margin-inline: -0.08em;
    letter-spacing: 0.025em;
}

.l1-product-page .l1-story .l1p-story__content h2 strong {
    width: max-content;
    max-width: 100%;
    padding: 0.04em 0.08em 0.14em;
    margin: -0.04em -0.08em -0.14em;
    background: linear-gradient(96deg, #7f3c98 0%, #b080c0 52%, #6ea9c9 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.l1-product-page .l1-story--one .l1p-story__content h2 {
    display: flex;
    max-width: none;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 0.28em;
    white-space: nowrap;
}

.l1-product-page .l1-story--one .l1p-story__content h2 span,
.l1-product-page .l1-story--one .l1p-story__content h2 strong {
    display: inline;
}

.l1-product-page .l1-story--one .l1p-story__content h2 strong {
    font-size: 1.22em;
    line-height: 0.9;
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    color: #64257b;
}

.l1-product-page .l1-story__tablet-break {
    display: none;
}

.l1-product-page .l1-story--two .l1p-story__content h2 strong {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    color: #dec3a8;
}

.l1-product-page .l1-story--three .l1p-story__content h2 strong {
    background-image: linear-gradient(96deg, #d8edf5 0%, #75aac3 48%, #7168aa 100%);
}

.l1-product-page .l1-story--four .l1p-story__content h2 strong {
    max-width: none;
    padding-right: 0.18em;
    background-image: linear-gradient(96deg, #70c4e6 0%, #568bc9 52%, #5d55a7 100%);
}

.l1-product-page .l1-story--five .l1p-story__content h2 strong {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    color: #55d982;
}

.l1-product-page .l1-story--five .l1p-story__content h2 {
    display: flex;
    max-width: none;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 0.28em;
    white-space: nowrap;
}

.l1-product-page .l1-story--five .l1p-story__content h2 span,
.l1-product-page .l1-story--five .l1p-story__content h2 strong {
    display: inline;
}

.l1-detail-triptych {
    display: grid;
    overflow: hidden;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(0.8rem, 1.5vw, 1.5rem);
    padding: clamp(1rem, 2.2vw, 2.25rem);
    border-top: 0;
    background: #000000;
}

.l1-detail-triptych figure {
    position: relative;
    overflow: hidden;
    margin: 0;
    opacity: 0;
    transform: translateY(1.75rem);
    transition:
        opacity 700ms ease calc(90ms + var(--l1-detail-index) * 120ms),
        transform 850ms cubic-bezier(0.16, 1, 0.3, 1) calc(90ms + var(--l1-detail-index) * 120ms);
}

.l1-detail-triptych.is-visible figure {
    opacity: 1;
    transform: translateY(0);
}

.l1-detail-triptych img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 2 / 1;
    object-fit: cover;
    filter: brightness(0.94) saturate(0.9);
    transition: filter var(--transition);
}

.l1-detail-triptych figure:hover img {
    filter: brightness(1.05) saturate(1);
}

.l1-technical {
    --l1p-polar-cardioid: #64257b;
    --l1p-polar-omni: #6ec1e4;
    --l1p-polar-eight: #9d73b2;
}

.l1-product-page .l1-technical .l1p-technical__heading h2 strong {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    color: #64257b;
}

.l1-product-page .l1-technical .l1p-technical__heading p,
.l1-product-page .l1-technical .l1p-technical__heading p span,
.l1-product-page .l1-technical .l1p-technical__heading p strong {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    color: #171a1f;
    font-weight: 300;
}

.l1-product-page .l1-spec--single-value dt {
    display: inline-flex;
    max-width: 100%;
    align-items: baseline;
    gap: 0.42em;
    white-space: nowrap;
}

.l1-product-page .l1-spec--single-value dt span {
    display: inline;
    margin-top: 0;
    font-size: 0.76em;
    letter-spacing: 0.025em;
}

.l1-product-page .l1-technical .l1p-measurement::before {
    background: linear-gradient(90deg, #64257b, #8b6ca3, #6ec1e4);
}

.l1-product-page .l1-audio-showcase {
    background:
        radial-gradient(circle at 88% 5%, rgba(100, 37, 123, 0.18), transparent 30rem),
        #000000;
}

.l1-product-page .l1-audio-intro h2 strong {
    background: linear-gradient(96deg, #ffffff 0%, #a071b4 48%, #64257b 76%, #6ec1e4 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.l1-product-page .l1-audio-intro__question {
    color: #ad7fc0;
}

.l1-product-page .l1-audio-comparison {
    background: linear-gradient(
        104deg,
        #000000 0%,
        #000000 55%,
        #160b20 70%,
        #321642 84%,
        #040406 100%
    );
}

.l1-product-page .l1-audio-comparison:nth-child(2) {
    background: linear-gradient(
        104deg,
        #000000 0%,
        #000000 55%,
        #101a31 70%,
        #294873 84%,
        #040406 100%
    );
}

.l1-product-page .l1-audio-comparison:nth-child(3) {
    background: linear-gradient(
        104deg,
        #000000 0%,
        #000000 55%,
        #211022 70%,
        #482242 84%,
        #040406 100%
    );
}

.l1-product-page .l1-audio-comparison__info h3 span {
    color: #6c99c6;
}

.l1-product-page .l1-audio-comparison__visual img {
    width: 88%;
    margin-inline: auto;
}

.l1-product-page .l1p-audio-player--l1 {
    --l1p-player-accent: #9c67b2;
}

.l1-product-page .l1p-audio-player--l1 .l1p-audio-player__meta strong {
    color: #bd8fcf;
}

.l1-product-page .l1-purchase-stage {
    background:
        linear-gradient(115deg, rgba(100, 37, 123, 0.035), transparent 32%),
        #ffffff;
}

@media (max-width: 69.999rem) {
    .l1-product-page {
        --l1p-nav-edge-gap: clamp(1rem, 2vw, 1.6rem);
    }

    .l1-feature .l1p-feature__inner {
        grid-template-columns: minmax(14rem, 0.52fr) minmax(0, 1fr);
    }
}

@media (max-width: 47.999rem) {
    .l1-product-page {
        --l1p-nav-height: 0rem;
        --l1p-nav-edge-gap: 1rem;
    }

    .l1-product-page .site-header {
        position: sticky;
        top: 0;
    }

    .l1-product-page .l1-hero {
        background-position: center;
    }

    .l1-product-page .l1-hero .l1p-hero__inner {
        min-height: 37rem;
    }

    .l1-feature .l1p-feature__inner {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "origin logo"
            "details details"
            "media media";
        row-gap: 3rem;
    }

    .l1-feature .l1p-feature__logo {
        justify-self: end;
    }

    .l1-feature .l1p-feature__origin {
        justify-self: start;
    }

    .l1-feature .l1p-feature__details,
    .l1-feature .l1p-feature__list,
    .l1-feature .l1p-feature__uses {
        width: 100%;
        margin-left: 0;
    }

    .l1-feature .l1p-feature__media {
        min-height: 30rem;
        opacity: 1;
        transform: none;
    }

    .l1-feature .l1p-feature__video {
        width: min(86%, 24rem);
        justify-self: start;
        opacity: 0;
        transform: translate3d(-4.5rem, 0, 0) scale(0.975);
    }

    .l1-feature.is-visible.is-video-ready .l1p-feature__video {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }

    .l1-product-page .l1-story,
    .l1-product-page .l1-story--one,
    .l1-product-page .l1-story--two,
    .l1-product-page .l1-story--three,
    .l1-product-page .l1-story--four,
    .l1-product-page .l1-story--five {
        min-height: 0;
        padding-top: 0;
    }

    .l1-product-page .l1-story .l1p-story__background,
    .l1-product-page .l1-story--one .l1p-story__background {
        position: relative;
        inset: auto;
        width: 100%;
        height: clamp(21rem, 108vw, 38rem);
        object-fit: cover;
    }

    .l1-product-page .l1-story--one .l1p-story__background {
        object-position: 0 center;
        background: #ffffff;
        transform: scale(0.8);
        transform-origin: left bottom;
    }

    .l1-product-page .l1-story--two .l1p-story__background {
        object-position: 82% center;
    }

    .l1-product-page .l1-story--three .l1p-story__background,
    .l1-product-page .l1-story--four .l1p-story__background {
        object-position: 22% center;
    }

    .l1-product-page .l1-story--five .l1p-story__background {
        object-position: 82% center;
    }

    .l1-product-page .l1-story--one .l1p-story__inner {
        background: #ffffff;
    }

    .l1-product-page .l1-story--two .l1p-story__inner {
        background: linear-gradient(180deg, #030106 0%, #09040d 55%, #06101b 100%);
    }

    .l1-product-page .l1-story--three .l1p-story__inner {
        background: linear-gradient(180deg, #06101b 0%, #07182a 52%, #140b0d 100%);
    }

    .l1-product-page .l1-story--four .l1p-story__inner {
        background: linear-gradient(180deg, #140b0d 0%, #0c090e 52%, #071729 100%);
    }

    .l1-product-page .l1-story--five .l1p-story__inner {
        background: linear-gradient(180deg, #071729 0%, #06101c 55%, #07070b 100%);
    }

    .l1-product-page .l1-story .l1p-story__content h2,
    .l1-product-page .l1-story--four .l1p-story__content h2 {
        max-width: 15ch;
        font-size: clamp(2.1rem, 9.4vw, 3.2rem);
    }

    .l1-product-page .l1-story--one .l1p-story__content h2 {
        max-width: none;
        font-size: clamp(1.85rem, 8.7vw, 3rem);
    }

    .l1-product-page .l1-story--four .l1p-story__content h2 {
        max-width: none;
    }

    .l1-product-page .l1-story--five .l1p-story__content h2 {
        max-width: none;
        font-size: clamp(1.9rem, 8.8vw, 3rem);
    }

    .l1-product-page .l1-story--four .l1p-story__content h2 span,
    .l1-product-page .l1-story--four .l1p-story__content h2 strong {
        white-space: normal;
    }

    .l1-detail-triptych img {
        min-height: 0;
    }

    .l1-product-page .l1-spec--single-value dt {
        font-size: clamp(0.56rem, 2.45vw, 0.7rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .l1-detail-triptych figure {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

@media (max-width: 47.999rem) {
    .l1-product-page .l1-story--four .l1p-story__background { object-position: right center; }
    .l1-product-page .l1-story--five .l1p-story__background { object-position: 8% center; }
    .l1-product-page .l1-story--one .l1p-story__background { object-position: center; transform-origin: center bottom; }
    .l1-product-page .l1p-hero__mobile-visual { width: 100vw; max-width: none; margin-inline: calc(50% - 50vw); object-position: center; }
}