/* =========================================
   Block: Der Weg (kss/lswn-path)
   ========================================= */

.lswn-path {
    position: relative;
    padding: var(--lswn-section) var(--lswn-edge);
    max-width: 1060px;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.lswn-path__headline {
    font-family: var(--lswn-serif);
    font-weight: 400;
    line-height: var(--lswn-leading-heading);
    letter-spacing: var(--lswn-tracking-heading);
    font-size: var(--lswn-text-h2);
    color: var(--lswn-wine);
    text-align: center;
    margin: 0 0 14px;
}
.lswn-path__headline i { font-style: italic; color: var(--lswn-gold); }

.lswn-path__intro {
    text-align: center;
    color: var(--lswn-ink-soft);
    max-width: 47ch;
    margin: 0 auto 84px;
}

/* --- Schiene: die sich beim Scrollen zeichnende Ranke --- */
.lswn-path__rail {
    position: relative;
}
.lswn-path__rail-svg {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 180px;
    height: 100%;
    pointer-events: none;
    overflow: visible;
}
.lswn-path__rail-svg path {
    fill: none;
    stroke: var(--lswn-gold);
    stroke-width: 1.3;
    stroke-linecap: round;
}
@media (max-width: 780px) {
    .lswn-path__rail-svg { left: 16px; transform: none; width: 80px; }
}

/* --- Station: abwechselnd links/rechts der Schiene --- */
.lswn-path__station {
    position: relative;
    width: calc(50% - 92px);
    margin-bottom: clamp(56px, 9vw, 116px);
}
.lswn-path__station:nth-child(odd) { text-align: right; }
.lswn-path__station:nth-child(even) { margin-left: calc(50% + 92px); }
@media (max-width: 780px) {
    .lswn-path__station,
    .lswn-path__station:nth-child(odd),
    .lswn-path__station:nth-child(even) {
        width: auto;
        margin-left: 74px;
        text-align: left;
    }
}
.lswn-path__no {
    font-family: var(--lswn-serif);
    font-style: italic;
    font-size: 16px;
    color: var(--lswn-gold);
    display: block;
    margin-bottom: 9px;
}
.lswn-path__station h3 {
    font-size: var(--lswn-text-h3);
    color: var(--lswn-wine);
    font-family: var(--lswn-serif);
    font-weight: 400;
    margin: 0 0 11px;
}
.lswn-path__station p {
    color: var(--lswn-ink-soft);
    font-size: 16px;
    line-height: 1.84;
    margin: 0;
}

/* --- Einblenden beim Scrollen ins Bild --- */
.lswn-path__headline,
.lswn-path__intro,
.lswn-path__station {
    opacity: 0;
    transform: translateY(36px);
    transition: opacity 1.1s cubic-bezier(.19, 1, .22, 1), transform 1.1s cubic-bezier(.19, 1, .22, 1);
}
.lswn-path__headline.is-visible,
.lswn-path__intro.is-visible,
.lswn-path__station.is-visible {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .lswn-path__headline,
    .lswn-path__intro,
    .lswn-path__station {
        opacity: 1;
        transform: none;
        transition: none;
    }
}