:root {
    --color-primary: #E63232;
    --color-primary-dark: #a23a39;
    --color-primary-light: #fff2f2;
    --color-dark: #000207;
    --color-white: #ffffff;
    --color-text: #5a554f;
    --color-grey-light: #e6e6e6;
    --color-light: #f8f6f2;
    --color-grey: #bbb;
    --bg-raster: linear-gradient(rgba(90, 85, 79, .045) 1px, transparent 1px),linear-gradient(90deg, rgba(90, 85, 79, .045) 1px, transparent 1px), linear-gradient(135deg, #f7f5f1, #fff 70%);
    --bg-raster-size: 48px 48px, 48px 48px, auto;;
    --shadow-soft: 0 18px 50px rgba(0, 31, 49, 0.16);
    --shadow-glow: 0 0 26px rgba(235, 90, 10, 0.9);
    --font-sans: 'Inter', sans-serif;
    --container: 1600px;
    --container-md: 1400px;
    --container-sm: 1200px;
    --container-xs: 1000px;
    --radius-lg: 1.5rem;
    --radius-md: 0.5rem;
    --radius-pill: 999px;
    --anchor-offset: 96px;
    --transition: ease all 0.5s;
}

* {
    box-sizing: border-box;
}

html {
    overflow-x:hidden;
}

body {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    margin: 0;
    font-family: var(--font-sans);
    color: var(--color-text);
    background: var(--color-white);
    line-height: 1.45;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    overflow-y:hidden;
}

html.no-scroll,
body.no-scroll {
    overflow: hidden;
}

.body-bottom {
    width:100vw;
    height:100px;
    background: linear-gradient(
            to top,
            rgba(255,255,255,1) 0%,
            rgba(255,255,255,.8) 30%,
            rgba(255,255,255,0) 100%
    );
    position: fixed;
    left:0;
    bottom:0;
    z-index:9;
}

img,
svg {
    max-width: 100%;
    display: block;
}

main {
    background:var(--color-white);
    position: relative;
    padding-top:7.5rem;
}

/*main:after {
    content:'';
    bottom:0;
    left:0;
    display:block;
    width:100%;
    height:200px;
    background: #FFFFFF;
    background: linear-gradient(180deg,rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 90%);
    position: sticky;
    z-index:10;
}*/

a {
    color: var(--color-primary);
    text-decoration: none;
}

h1 {
    font-size:4rem;
    line-height: 4.75rem;
    line-height: .98;
    letter-spacing: -.045em;
}

h2 {
    font-weight:600;
    font-size:2.5rem;
    line-height: 3rem;
    line-height: .98;
    letter-spacing: -.045em;
}

h3 {
    /*font-size:1.75rem;
    font-weight:700;
    color:var(--color-primary);*/
    font-weight:600;
    margin: 0 0 1.35rem;
    color: var(--color-primary);
    font-size: clamp(1.75rem, 3.7vw, 4rem);
    line-height: .98;
    letter-spacing: -.045em;
}

p {
    line-height: 1.7;
}

.text-center {
    text-align:center;
}

.text-left {
    text-align:left;
}

.platzhalter-text {
    position:absolute;
    top:50%;
    left:50%;
    color:deeppink;
    transform: translate(-50%,-50%);
    font-weight:800;
    font-size:2rem;
    z-index:9;
}

.container {
    padding-left: 5%;
    padding-right: 5%;
    margin-inline: auto;
    width: 100%;
    max-width:var(--container);
    position: relative;
}

.container-md {
    max-width:var(--container-md);
}

.container-sm {
    max-width:var(--container-sm);
}

.container-xs {
    max-width:var(--container-xs);
}

.indent {
    padding:0 20%;
}

.spacer {
    margin:7.5rem 0;
}

.spacer-small {
    margin:4.5rem 0;
}

.spacer-inner {
    padding-top:7.5rem;
    padding-bottom:7.5rem;
}

.position-relative {
    position:relative;
    z-index: 1;
}

.keyvisual-absolute {
    width: 880px;
    position: absolute;
    right: -10%;
    top: -75px;
    opacity: 0.75;
}

.bg-primary {
    color:var(--color-white);
    background:var(--color-primary) !important;
}

.bg-primary h3 {
    color:var(--color-white);
}

.bg-primary-light {
    background:var(--color-primary-light) !important;
}

.bg-grey-light {
    background:var(--color-grey-light) !important;
}

.bg-light {
    background:var(--color-light) !important;
}

.bg-white {
    background:var(--color-white) !important;
    border:none !important;
}

.bg-raster {
    background:var(--bg-raster) !important;
    background-size:var(--bg-raster-size) !important;
}

.content-block {
    padding:2rem;
    border-radius: var(--radius-md);
    box-shadow:0 8px 24px rgba(0, 0, 0, .1);
    position: relative;
    background:var(--color-white);
}

.content-block h3 {
    font-size:1.5rem;
}

@media(max-width:900px) {
    .spacer {
        margin:5rem 0;
    }

    .spacer-small {
        margin:2.5rem 0;
    }

    .spacer-inner {
        padding-top:5rem;
        padding-bottom:5rem;
    }
}

@media(max-width:600px) {
    .indent {
        padding:0 15px;
    }
}

/* --------------- CHRONICLE CONTENT BLOCKS ---------------------------------------*/

.content-block-wrapper {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(5rem, 8vw, 8rem) 0;

}

.content-block-wrapper:before {
    content:attr(data-period);
    position:absolute;
    top:2rem;
    right:2rem;
    z-index:-1;
    color:transparent;
    -webkit-text-stroke:1px rgba(0, 0, 0, .15);
    font-size:clamp(6rem, 14vw, 14rem);
    font-weight:700;
    line-height:1;
    white-space:nowrap;
    pointer-events:none;
}

.content-block-heading {
    position:relative;
    max-width:48rem;
    margin-bottom:clamp(3.5rem, 6vw, 6rem);
}

.content-block-kicker {
    display:block;
    margin-bottom:.75rem;
    color:var(--color-primary);
    font-size:.78rem;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.content-block-heading h2 {
    max-width:30rem;
    margin:0;
    color:var(--color-primary);
    font-size:clamp(1.5rem, 3vw, 3rem);
    line-height:1.08;
}

.content-block-grid {
    position:relative;
}

.content-block-grid:before {
    content:'';
    position:absolute;
    top:1.25rem;
    right:calc(100% / 6);
    left:calc(100% / 6);
    height:1px;
    background:linear-gradient(
            90deg,
            transparent,
            var(--color-primary) 8%,
            var(--color-primary) 92%,
            transparent
    );
}

.content-block-column {
    position:relative;
    display:flex;
}

.content-block-column:before {
    content:'';
    position:absolute;
    top:.9rem;
    left:50%;
    z-index:2;
    width:11px;
    height:11px;
    background:var(--color-primary);
    border:2px solid var(--color-primary);
    border-radius:50%;
    transform:translateX(-50%);
}

.content-block-column:after {
    content:'';
    position:absolute;
    top:1.25rem;
    left:50%;
    width:1px;
    height:2.75rem;
    background:var(--color-primary);
}

.content-block-wrapper .content-block {
    display:flex;
    flex-direction:column;
    width:100%;
    min-height:25rem;
    margin-top:4rem;
    padding:clamp(1.75rem, 3vw, 2.75rem);
    overflow:hidden;
    text-align:left;
    background:
            linear-gradient(var(--color-white), var(--color-white)) padding-box,
            linear-gradient(145deg, rgba(230, 50, 30, .48), rgba(230, 50, 30, 0) 45%) border-box;
    border:1px solid transparent;
    border-radius:.25rem;
    box-shadow:0 20px 55px rgba(90, 85, 79, .12);
    transition:transform .45s ease, box-shadow .45s ease;
}

.content-block-wrapper .content-block:hover {
    transform:translateY(-8px);
    box-shadow:0 28px 70px rgba(90, 85, 79, .17);
}

.content-block-meta {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:1rem;
    margin-bottom:2rem;
    padding-bottom:1.25rem;
    border-bottom:1px solid var(--color-grey-light);
}

.content-block-index {
    color:var(--color-primary);
    font-size:3.5rem;
    font-weight:200;
    line-height:.8;
    letter-spacing:-.06em;
}

.content-block-category {
    color:var(--color-grey);
    font-size:1rem;
    font-weight:500;
    display:none;
}

.content-block-wrapper .content-block h3 {
    margin-top:0;
    margin-bottom:1.25rem;
    color:var(--color-primary);
    font-size:clamp(1.35rem, 2vw, 1.75rem);
    line-height:1.15;
}

.content-block-wrapper .content-block p {
    position:relative;
    z-index:1;
    margin-top:0;
    margin-bottom:0;
}

@media (max-width:900px) {
    .content-block-grid {
        gap:2rem;
        padding-left:2.75rem;
    }

    .content-block-grid:before {
        top:0;
        right:auto;
        bottom:0;
        left:.45rem;
        width:1px;
        height:auto;
        background:linear-gradient(
                180deg,
                transparent,
                var(--color-primary) 5%,
                var(--color-primary) 95%,
                transparent
        );
    }

    .content-block-column:before {
        top:2.25rem;
        left:-2.3rem;
    }

    .content-block-column:after {
        top:2.55rem;
        left:-2.3rem;
        width:2.3rem;
        height:1px;
    }

    .content-block-wrapper .content-block {
        min-height:0;
        margin-top:0;
    }
}

@media (max-width:600px) {
    .content-block-wrapper {
        padding:4.5rem 0;
    }

    .content-block-heading {
        margin-bottom:3rem;
    }

    .content-block-grid {
        padding-left:2rem;
    }

    .content-block-column:before,
    .content-block-column:after {
        left:-1.55rem;
    }

    .content-block-column:after {
        width:1.55rem;
    }

    .content-block-wrapper .content-block {
        padding:1.5rem;
    }
}

.lead {
    font-size:2rem;
    font-weight:500;
}

.btn {
    padding:0.75rem 1.5rem;
    border-radius: var(--radius-md);
    font-size:0.85rem;
    font-weight:600;
    transition: var(--transition);
}

.btn-primary {
    background:var(--color-primary);
    color:var(--color-white);
    border:1px solid var(--color-primary);
}

.btn-primary:hover {
    background:none;
    color:var(--color-primary);
}

.button {
    padding:20px 80px 20px 40px;
    background-color:var(--color-primary);
    color:#fff;
    border-radius:50px;
    border:1px solid var(--color-primary);
    font-size:0.85rem;
    font-weight:600;
    width:max-content;
    transition: var(--transition);
}
.button:hover {
    background-color:transparent;
    color:var(--color-primary);;
    border:1px solid var(--color-primary);
}
.button:hover .ico {
    margin-left:30px;
    background-color:var(--color-primary);
    color:white;
    transform:rotate(405deg);
}
.button:hover .ico:after {
    width:10px;
    height:10px;
    background-image:url('../images/arrow.svg');
    color:var(--color-white);
}
.button:active {
    background-color:var(--color-primary);
    color:white;
}
.ico {
    transition:all 0.5s;
    background-color:white;
    color:var(--color-primary);
    width: 40px;
    height: 40px;
    padding: 5px;
    border-radius: 20px;
    position: absolute;
    margin-left: 30px;
    margin-top: -13.5px;
    font-size: 1.5em;
}

.ico:after {
    content:'';
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    width:20px;
    height:20px;
    background-repeat: no-repeat;
    background-size:contain;
    color:var(--color-primary);
}

.ico.ico-chapter:after {
    background-image:url('../images/search.svg');
}

.blend-mode-multiply {
    mix-blend-mode: multiply;
}

.more-content {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition:
            grid-template-rows .7s cubic-bezier(.22, 1, .36, 1),
            opacity .4s ease;
}

.more-content > div {
    overflow: hidden;
}

.more-content.open {
    grid-template-rows: 1fr;
    opacity: 1;
}

.more-toggle {
    position:relative;
}

.more-toggle:after {
    content:'';
    position: absolute;
    bottom:-3px;
    width:100%;
    right:50%;
    height:2px;
    background:var(--color-primary);
    transition: var(--transition);
    opacity:0;
}

.more-toggle:hover:after {
    width:20px;
    right:0;
    opacity:1;
}

.start-objekt {
    max-width: 250px;
    margin-left: 21%;
}

/* --------------- LIGHTBOX ---------------------------------------*/

.glightbox {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
}

.glightbox:after {
    content:'';
    position: absolute;
    top:48%;
    left:50%;
    transform: translate(-50%,-50%);
    width:50px;
    height:50px;
    background:url('../images/lightbox-icon.svg') no-repeat;
    background-size:contain;
    opacity:0;
    transition: var(--transition);
}

.glightbox:hover:after {
    opacity:1;
    top:50%;
}

/*.glightbox .imgwrap {
    position: relative;
}

.glightbox .imgwrap:after {
    content:'';
    position: absolute;
    top:48%;
    left:50%;
    transform: translate(-50%,-50%);
    width:50px;
    height:50px;
    background:url('../images/lightbox-icon.svg') no-repeat;
    background-size:contain;
    opacity:0;
    transition: var(--transition);
}

.glightbox .imgwrap:hover:after {
    opacity:1;
    top:50%;
}*/



/* --------------- BLOCKQUOTE ---------------------------------------*/

blockquote {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    width:min(100%, 42rem);
    margin:clamp(2.5rem, 5vw, 4rem) 0 0;
    padding:clamp(2.5rem, 5vw, 4.5rem) clamp(2rem, 4vw, 3.5rem);
    font-size:clamp(1.65rem, 3vw, 2.5rem);
    font-weight:500;
    letter-spacing:-.035em;
    line-height:1.2;
}

blockquote.bg-primary {
    background:
            linear-gradient(135deg, rgba(255, 255, 255, .08), transparent 48%),
            linear-gradient(145deg, var(--color-primary) 0%, #c82618 100%) !important;
    border:1px solid rgba(255, 255, 255, .18);
    border-radius:var(--radius-lg);
    box-shadow:
            0 26px 60px rgba(162, 58, 57, .25),
            inset 0 1px 0 rgba(255, 255, 255, .16);
}

blockquote p {
    position:relative;
    z-index:2;
    max-width:31rem;
    padding:0 0 0 clamp(1rem, 2vw, 1.5rem);
    margin:0;
    border-left:2px solid var(--color-primary);
    color:var(--color-primary);
    line-height: .98;
    letter-spacing: -.045em;
}

blockquote:before {
    content:'';
    position:absolute;
    top:clamp(1.1rem, 2vw, 1.75rem);
    left:clamp(1.25rem, 2.5vw, 2.25rem);
    z-index:1;
    background:url('../images/quote.svg') no-repeat;
    background-size:contain;
    width:clamp(3.75rem, 7vw, 6rem);
    height:clamp(3.25rem, 6vw, 5.25rem);
    opacity:1;
    pointer-events:none;
}

blockquote.bg-primary-light:after {
    content:'125';
    position:absolute;
    right:-.05em;
    bottom:-.18em;
    z-index:1;
    color:transparent;
    -webkit-text-stroke:1px var(--color-primary);
    font-size:clamp(6rem, 13vw, 10rem);
    font-weight:700;
    letter-spacing:-.08em;
    line-height:1;
    pointer-events:none;
    opacity:0.25;
}

@media (max-width:600px) {
    blockquote {
        margin-top:2.5rem;
        padding:2.25rem 1.5rem;
        font-size:1.45rem;
        letter-spacing:-.025em;
    }

    blockquote.bg-primary {
        border-radius:var(--radius-md);
    }

    blockquote p {
        padding-left:1rem;
    }

    blockquote.bg-primary:after {
        right:-.1em;
        bottom:-.12em;
    }
}

/* --------------- EXKURS ---------------------------------------*/

.exkurs-button {
    background: var(--color-primary);
    width:40px;
    height:40px;
    border-radius:50%;
    position:absolute;
    cursor:pointer;
    z-index:99;
    transition:transform .3s ease;
}

.exkurs-button::after {
    content:"+";
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--color-white);
    font-size:1.25rem;
}

.exkurs-button::before {
    content:"";
    position:absolute;
    inset:0;
    border-radius:50%;
    background:var(--color-primary);
    z-index:-1;
    animation:pulse 2s infinite;
}

.exkurs-button:hover {
    transform:scale(1.1);
}

@keyframes pulse {

    0% {
        transform:scale(1);
        opacity:.6;
    }

    70% {
        transform:scale(2);
        opacity:0;
    }

    100% {
        transform:scale(2);
        opacity:0;
    }

}

.exkurs-button.werk-im-wandel {
    top: 37%;
    left: 42%;
}

.exkurs-button.bergauf {
    top: 24%;
    right: 40%;
}

.exkurs-button.name-mit-zukunft {
    top:35%;
    right:25%;
}

.exkurs-button.neue-maerkte {
    top:35%;
    right:25%;
}

.exkurs-button.arbeitsordnung {
    top:20%;
    right:-5%;
}

.exkurs-button.steigendepreise {
    top:50%;
    left:20%;
}

.exkurs-button.regelventilinfo {
    top:40%;
    left:30%;
}

.exkurs-button.technik-braucht-menschen {
    top: 56%;
    left: 44%;
}

.exkurs-button.firmenhund {
    top: 56%;
    left: 44%;
}

.exkurs-button.inflation {
    top: 56%;
    left: 5%;
}

.exkurs-button.einladung {
    top:60%;
    right:40%;
}

.exkurs-button.energiewirtschaft {
    top: 6%;
    right: -3%;
}

.exkurs-button.museum {
    bottom: -54%;
    left: 7%;
}

.exkurs-button.pionierleistung {
    top: 5%;
    left: -14%;
}

.exkurs-button.gruss {
    top: 5%;
    left: -14%;
}

.exkurs-button.vorgaenge {
    top: 5%;
    right: -14%;
}

.exkurs-button.brackwede {
    top: 40%;
    left: 30%;
}

.exkurs-button.rechtsform {
    top: 15%;
    left: 25%;
}

.exkurs-button.suedafrika {
    top: 20%;
    right: -10%;
}

.exkurs-button.adolf-tuxhorn {
    top: 25%;
    right:0%;
}


.exkurs-overlay {
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.35);

    opacity:0;
    visibility:hidden;

    transition:.4s;

    z-index:998;
}

.exkurs-panel {

    position:fixed;

    top:0;
    right:0;

    width:min(50vw,700px);
    height:100vh;

    background:#fff;

    transform:translateX(100%);

    transition:
            transform .7s cubic-bezier(.77,0,.18,1);

    z-index:999;

    overflow:auto;

    padding:80px;

}



.exkurs-panel .subline {
    color:var(--color-primary);
    font-size:1rem;
    margin-bottom:0;
}

.exkurs-panel h2 {
    font-size:2rem;
    margin-top:0;
}


body.exkurs-open .exkurs-overlay {

    opacity:1;
    visibility:visible;

}

body.exkurs-open .exkurs-panel {

    transform:translateX(0);

}


.exkurs-close {

    position:absolute;
    top:30px;
    right:30px;
    transition: var(--transition);
    background:none;
    border:0;
    color:var(--color-primary);
    font-size:3rem;
    font-weight:100;
    cursor:pointer;

}

.exkurs-close:hover {
    transform:scale(1.25);
}

@media (max-width: 768px) {
    .exkurs-panel {
        width:min(100vw,700px);
        padding:3rem 1rem;
    }

    .exkurs-panel h2 {
        font-size:1.25rem;
    }

    .exkurs-panel p {
        font-size:0.8rem;
    }
}

/* --------------- HEADER ---------------------------------------*/

header {
    position:absolute;
    top:0;
    padding:1.75rem 0 1.75rem 0;
    z-index:99;
    width:100%;
}

header .logo {
    width:175px;
    float:left;
}

body > header.site-header {
    transition:
            transform .24s cubic-bezier(.22, 1, .36, 1),
            background-color .2s ease,
            box-shadow .2s ease,
            padding .2s ease;
}

body > header.site-header.is-scroll-nav {
    position:fixed;
    top:0;
    right:0;
    left:0;
    z-index:1000;
    padding:.8rem 0;
    opacity:1 !important;
    visibility:visible;
    background:var(--color-white);
    box-shadow:0 10px 30px rgba(0, 2, 7, .1);
    transform:translateY(-110%) !important;
}

body > header.site-header .logo {
    margin:unset;
}

body > header.site-header.is-scroll-nav.is-hidden-instantly {
    transition:none !important;
}

body > header.site-header.is-scroll-nav.is-visible,
body.menu-open > header.site-header.is-scroll-nav {
    transform:translateY(0) !important;
}

body.menu-open > header.site-header.is-scroll-nav {
    z-index:997;
}

body > header.site-header.is-scroll-nav .container {
    display:flex;
    align-items:center;
    justify-content:space-between;
}

body > header.site-header.is-scroll-nav .logo,
body > header.site-header.is-scroll-nav .burger {
    float:none;
}

body > header.site-header.is-scroll-nav .logo {
    width:155px;
    margin-right:auto;
}

body > header.site-header.is-scroll-nav .burger {
    margin-left:auto;
}

body > header.site-header.is-scroll-nav .burger,
body > header.site-header.is-scroll-nav.subpage .burger {
    background:var(--color-primary);
}

body > header.site-header.is-scroll-nav .burger:hover,
body > header.site-header.is-scroll-nav.subpage .burger:hover {
    background:var(--color-primary-dark);
}

body > header.site-header.is-scroll-nav .burger span,
body > header.site-header.is-scroll-nav.subpage .burger span {
    height:1px;
    background:var(--color-white);
}

@media (max-width:600px) {
    body > header.site-header.is-scroll-nav {
        padding:.65rem 0;
    }

    body > header.site-header.is-scroll-nav .logo {
        width:140px;
    }
}

header.subpage .burger {
    background:var(--color-white);
}

header.subpage .burger span {
    background:var(--color-primary);
    height:2px;
}

/* --------------- MENU ---------------------------------------*/

.burger {
    position:relative;
    z-index:1001;
    width:45px;
    height:45px;
    border:0;
    background:none;
    cursor:pointer;
    float:right;
    background:var(--color-primary);
    padding-left:12px;
    padding-right:12px;
    border-radius:var(--radius-pill);
    transition: var(--transition);
}

.burger:hover {
    background: var(--color-primary-dark);
}

.burger span {
    display:block;
    height:1px;
    background:var(--color-white);
    margin:5px 0;
    transition:.4s ease;
}


/* Overlay */

.menu-overlay {
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.35);
    opacity:0;
    visibility:hidden;
    transition:.5s ease;
    z-index:998;
}


/* Menü */

.chapter-menu {
    position:fixed;
    top:0;
    right:0;
    height:100vh;
    width:min(520px,90vw);

    background:#fff;

    transform:translateX(100%);
    transition:
            transform .7s cubic-bezier(.77,0,.18,1);

    z-index:999;

    padding:80px 60px;
    overflow-y:auto;
}


.chapter-list {
    list-style:none;
    padding:0;
    margin:0;
}


.chapter-list li {
    margin-bottom:50px;
    opacity:0;
    transform:translateX(40px);

    transition:
            opacity .5s ease,
            transform .5s ease;
}


.chapter-year {
    display:block;
    font-size:.9rem;
    color:var(--color-primary);
    margin-bottom:8px;
}


.chapter-list a {
    color:var(--color-text);
    text-decoration:none;
    font-size:1.5rem;
    line-height:1.15;
    transition:.3s ease;
}


.chapter-list a:hover {
    color:var(--color-primary);
}


/* Close */

.menu-close {
    position:absolute;
    top:25px;
    right:35px;

    border:0;
    font-size:3rem;
    cursor:pointer;
    background:none;
    border-radius:var(--radius-pill);
    transition: var(--transition);
    line-height: 42px;
    color: var(--color-primary);
    font-weight: 100;
}

@media(max-width:600px) {
    .chapter-menu {
        padding: 60px 30px;
    }
    .chapter-list a {
        font-size:1.15rem;
    }
}



/* OPEN */

body.menu-open .chapter-menu {
    transform:translateX(0);
}

body.menu-open .menu-overlay {
    opacity:1;
    visibility:visible;
}


body.menu-open .chapter-list li {
    opacity:1;
    transform:translateX(0);
}


/* gestaffeltes Einblenden */

body.menu-open .chapter-list li:nth-child(1) {
    transition-delay:.15s;
}

body.menu-open .chapter-list li:nth-child(2) {
    transition-delay:.25s;
}

body.menu-open .chapter-list li:nth-child(3) {
    transition-delay:.35s;
}

body.menu-open .chapter-list li:nth-child(4) {
    transition-delay:.45s;
}

body.menu-open .chapter-list li:nth-child(5) {
    transition-delay:.55s;
}

body.menu-open .chapter-list li:nth-child(6) {
    transition-delay:.65s;
}

body.menu-open .chapter-list li:nth-child(7) {
    transition-delay:.75s;
}

/* --------------- INFALTION ---------------------------------------*/

.inflation-image {
    position: relative;
}

/* --------------- CHAPTER TIMELINE ---------------------------------------*/

.chapter-timeline {
    --timeline-item-height: 3.75rem;
    --timeline-translate: 7.5rem;
    position:fixed;
    top:50%;
    right:clamp(.75rem, 1vw, 2rem);
    z-index:90;
    transform:translateY(-50%);
    transition:opacity .35s ease, visibility .35s ease;
}

.chapter-timeline-window {
    height:18.75rem;
    padding-right:5px;
    overflow:hidden;
    -webkit-mask-image:linear-gradient(
            to bottom,
            transparent,
            #000 12%,
            #000 88%,
            transparent
    );
    mask-image:linear-gradient(
            to bottom,
            transparent,
            #000 12%,
            #000 88%,
            transparent
    );
}

.chapter-timeline-list {
    position:relative;
    margin:0;
    padding:0;
    list-style:none;
    transform:translateY(var(--timeline-translate));
    transition:transform .7s cubic-bezier(.77, 0, .18, 1);
}

.chapter-timeline-list:before {
    content:'';
    position:absolute;
    top:1.875rem;
    right:6px;
    bottom:1.875rem;
    width:1px;
    background:var(--color-grey-light);
}

.chapter-timeline-item {
    height:var(--timeline-item-height);
}

.chapter-timeline-link {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:.8rem;
    height:100%;
    color:var(--color-dark);
    text-decoration:none;
}

.chapter-timeline-copy {
    max-width:15rem;
    padding:.35rem .5rem;
    text-align:right;
    border-radius:var(--radius-md);
    opacity:.55;
    transform:translateX(4px) scale(.96);
    transform-origin:right center;
    transition:var(--transition);
}

.chapter-timeline-copy:hover {
    background:rgba(255, 255, 255, .88);
}

.chapter-timeline-year,
.chapter-timeline-title {
    display:block;
}

.chapter-timeline-year {
    font-size:.78rem;
    font-weight:600;
    line-height:1.15;
}

.chapter-timeline-title {
    max-height:0;
    overflow:hidden;
    font-size:.72rem;
    font-weight:500;
    line-height:1.25;
    opacity:0;
    transition:var(--transition);
    display:none;
}

.chapter-timeline-dot {
    position:relative;
    z-index:1;
    flex:0 0 auto;
    width:9px;
    height:9px;
    background:var(--color-white);
    border:1px solid var(--color-primary);
    border-radius:var(--radius-pill);
    transition:var(--transition);
    margin-right: 2px;
}

.chapter-timeline-link:hover,
.chapter-timeline-link:focus-visible,
.chapter-timeline-item.is-current .chapter-timeline-link {
    color:var(--color-primary);
}

.chapter-timeline-link:hover .chapter-timeline-copy,
.chapter-timeline-link:focus-visible .chapter-timeline-copy,
.chapter-timeline-item.is-current .chapter-timeline-copy {
    opacity:1;
    transform:translateX(0) scale(1);
}

.chapter-timeline-link:hover .chapter-timeline-dot,
.chapter-timeline-link:focus-visible .chapter-timeline-dot,
.chapter-timeline-item.is-current .chapter-timeline-dot {
    background:var(--color-primary-dark);
}

.chapter-timeline-item.is-current .chapter-timeline-copy {
    box-shadow:0 8px 24px rgba(0, 0, 0, .1);
    background:rgba(255, 255, 255, .88);
}

.chapter-timeline-item.is-current .chapter-timeline-title {
    max-height:2.5rem;
    margin-top:.2rem;
    opacity:1;
}

.chapter-timeline-item.is-current .chapter-timeline-dot {
    width:13px;
    height:13px;
    margin-right:0px;
    box-shadow:0 0 0 4px rgba(230, 50, 30, .16);
}

.chapter-timeline-link:focus-visible {
    outline:none;
}

.chapter-timeline-link:focus-visible .chapter-timeline-copy {
    box-shadow:0 0 0 2px var(--color-primary-dark);
}

body.menu-open .chapter-timeline {
    opacity:0;
    visibility:hidden;
}

@media (max-width:900px) {
    .chapter-timeline {
        right:.5rem;
        width:9rem;
        display:none;
    }

    .chapter-timeline-copy {
        max-width:7rem;
        opacity:0;
        pointer-events:none;
    }

    .chapter-timeline-title {
        display:none;
    }

    .chapter-timeline-item.is-current .chapter-timeline-copy {
        opacity:1;
    }
}

@media (prefers-reduced-motion:reduce) {
    .chapter-timeline,
    .chapter-timeline-list,
    .chapter-timeline-copy,
    .chapter-timeline-title,
    .chapter-timeline-dot {
        transition:none;
    }
}

/* --------------- IMAGE COMPARISION ---------------------------------------*/

img-comparison-slider {
    visibility: hidden;
    cursor: grab;
}

img-comparison-slider [slot='second'] {
    display: none;
}

img-comparison-slider.rendered {
    visibility: inherit;
}

img-comparison-slider.rendered [slot='second'] {
    display: unset;
}

img-comparison-slider.rendered {
    width:100%;
    outline:none;
    display:block;
}

.before figcaption,
.after figcaption {
    background:#003054;
    border-radius: 50px;
    color: #CBD3DE;
    padding: 12px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    line-height: 100%;
}

.before figcaption {
    left: 12px;
}

.after figcaption {
    right: 12px;
}

.slider-with-animated-handle:active .custom-animated-handle {
    opacity: 0;
}

.custom-animated-handle {
    transition: transform 0.2s;
}

.slider-with-animated-handle:hover .custom-animated-handle {
    transform: scale(1.2);
}

.slider-with-animated-handle .custom-animated-handle {
    width:50px;
    height:50px;
    border-radius:50%;
    position: relative;
    background-image:url('../images/handle-icon-02.svg');
    background-size: contain;
    transition: ease all 0.5s;
}

.bildvergleich {
    position: relative;
}

.bildvergleich .content-box {
    top:5%;
    left:5%;
    background:var(--color-primary);
    color:var(--color-white);
    padding:2rem;
    border-radius: var(--radius-md);
    position:absolute;
    max-width:500px;
}

.bildvergleich .content-box h3 {
    color: var(--color-white);
}

@media(max-width:900px) {
    .bildvergleich .content-box {
        position: relative;
        margin-top:-5%;
    }
}

/* --------------- STAGE ---------------------------------------*/

.stage {
    height:100vh;
    background:var(--color-dark);
}

.stage.stage-subpage {
    height:auto;
    max-height:100%;

}

.stage.stage-subpage .container {
    padding-top:20rem;
    padding-bottom:10rem;

}

.stage-image {
    width:100%;
    height:100%;
    position: absolute;
    object-position:center;
}

.stage-image img {
    position:absolute;
    width:100%;
    height:100%;
    object-fit: cover;
    top:0;
    left:0;
    object-position: center;

}

.stage h1 {
    max-width:550px;
    text-align: center;
    margin:auto;
    color:var(--color-white);
    padding-top:20vh;
    font-weight:600;
    opacity:0;
    filter:blur(80px);
    animation: revealH1 1.5s ease 3s forwards;
    font-size: 5.5rem;
    line-height: 5.75rem;
}

.stage h1 img {
    margin-top:-40px;
    opacity:0;
    filter:blur(80px);
    animation: revealH1 1.5s ease 3.5s forwards;
}

.stage .container {
    height:100%;
}

.stage .stage-content-block {
    position: absolute;
    right:5%;
    bottom:10%;
    padding:2rem;
    border-radius: var(--radius-md);
    opacity:0;
    filter:blur(80px);
    animation: revealH1 1s ease 5s forwards;
}

.stage .stage-content-block img {
    width:350px;
    height:275px;
}

.stage-years {
    position:relative;
    margin-bottom:12.5rem;
}

.stage-years .year-wrapper {
    --stage-year-parallax-y:0px;
    font-size:15rem;
    line-height:13rem;
    color: var(--color-primary-dark);
    position: absolute;
    left: 50%;
    top: 50%;
    transform:translate(-50%, -50%) translate3d(0, var(--stage-year-parallax-y), 0);
    font-weight:200;
    will-change:transform;
}

.stage-years h1 {
    padding-top:0;
    opacity:0;
    filter:blur(80px);
    animation: revealH1 2s ease 1.5s forwards;
    max-width:800px;
    font-size:4rem;
    line-height:4.5rem;
}

.stage-years h1 .stage-years-subline {
    font-size:2rem;
    max-width:750px;
    margin:auto;
    line-height:2rem;
}

.stage-subpage-text-left {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20%;
}

.stage-subpage-illu {
    width: 55%;
    position: absolute;
    bottom: 7.5%;
    right: 0;
}

.stage-subpage-illu img {
    max-height:600px;
    margin:auto;
}

.stage-years .year-wrapper .year {
    opacity: 0;
    filter: blur(8px);
    animation: revealYear 2s ease forwards;
}

.stage-years .year-wrapper .year.year2 {
    animation-delay: .5s;
}

@media (max-width: 768px) {
    .stage-subpage h2 {
        font-size:1.35rem;
    }

    .stage-subpage p {
        font-size:0.9rem;
        line-height:1.5rem;
    }
}

@keyframes revealYear {
    to {
        opacity: 1;
        filter: blur(0);
    }
}

@keyframes revealH1 {
    0% {
        opacity:0;
        filter:blur(80px);
    }

    100% {
        opacity:1;
        filter:blur(0);
    }
}

@media(max-width:1210px) {
    .stage .stage-content-block img {
        width: 280px;
        height: 215px;
    }
}

@media(max-width:900px) {
    .stage.stage-subpage .container {
        padding-top: 16rem;
    }
    .stage-years {
        margin-bottom: 10.5rem;
    }
    .stage-years h1 {
        font-size:3rem;
        line-height: 4rem;
    }
    .stage-years .year-wrapper {
        font-size: 11rem;
        line-height: 10rem;
    }
    .stage-subpage-text-left {
        grid-template-columns: unset;
    }

}

@media(max-width:600px) {
    .stage h1 {
        font-size: 3.5rem;
        line-height: 4rem;
    }
    .stage h1 img {
        margin-top: -20px;
    }
    .stage-years h1 {
        font-size: 7vw;
        line-height: 9vw;
    }
    .stage.stage-subpage .container {
        padding-top: 12.5rem;
    }
    .stage-years {
        margin-bottom: 7.5rem;
    }
    .stage-years .year-wrapper {
        font-size: 8rem;
        line-height: 6.75rem;
    }
}


/* --------------- INTRO ---------------------------------------*/

.intro-full {
    width:100vw;
    height:100vh;
    position:fixed;
    top:0;
    left:0;
    z-index:99999;
    animation:introOut 1s cubic-bezier(.77,0,.18,1) 3s forwards;
}

@keyframes introOut {

    from {
        transform:translateX(0);
    }

    to {
        transform:translateX(-100%);
    }

}

.intro-full .logo-wrapper {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:400px;
    height:400px;
}

.intro-image {
    width:250px;
    position:absolute;
    top:45%;
    left:42.5%;
    transform:translate(-50%,-50%);
    mix-blend-mode: multiply;
    opacity:0.5;
}

.intro-image img {
    mix-blend-mode: multiply;
    opacity:0.5;
}

.intro .subline {
    color:var(--color-text);
    font-weight:600;
}

.intro .intro-text {
    color:var(--color-primary);
}

.intro .intro-text p {
    margin:0.5rem;
}

/* Dezente Kapitel-Introvariante für den Generationenwechsel */
.intro {
    position:relative;
}

.intro .container {
    max-width:72rem;
}

.intro .subline {
    display:inline-flex;
    align-items:center;
    gap:.85rem;
    color:var(--color-dark);
    font-size:1rem;
    font-weight:500;
}

.intro .subline::before,
.intro .subline::after {
    content:'';
    width:clamp(1.75rem, 4vw, 3.5rem);
    height:1px;
    background:rgba(230, 50, 30, .42);
}

.intro .intro-text {
    position:relative;
    margin-top:1.25rem;
    padding:clamp(2rem, 4vw, 3.5rem) clamp(.5rem, 4vw, 3.5rem);
    color:var(--color-text);
    background:linear-gradient(
            90deg,
            transparent,
            rgba(230, 50, 30, .035) 18%,
            rgba(230, 50, 30, .035) 82%,
            transparent
    );
    border-top:1px solid rgba(90, 85, 79, .12);
    border-bottom:1px solid rgba(90, 85, 79, .12);
}

.intro .lead {
    max-width:61rem;
    margin-inline:auto;
    font-size:clamp(1.4rem, 2.3vw, 2rem);
    font-weight:500;
    line-height:1.45;
    color:var(--color-primary);
}

@media (max-width:600px) {

    .intro .intro-text {
        margin-top:1rem;
        padding:2rem .25rem;
    }

    .intro .lead {
        font-size:1.3rem;
        line-height:1.5;
    }

    .intro-full .logo-wrapper {
        width:75%;
    }
}

/* --------------- ENGAGEMENT IN KRIEGSZEITEN ---------------------------------------*/

.wartime-engagement__layout {
    align-items:center;
}

.wartime-engagement__copy {
    grid-column:1 / span 6;
}

.wartime-engagement__copy h3 {
    margin-bottom:1.75rem;
}

.wartime-engagement__copy p {
    max-width:43rem;
    margin:0;
}

.wartime-engagement__visual {
    grid-column:8 / span 5;
    margin:0;
    padding:clamp(.45rem, .8vw, .75rem);
    background:rgba(255, 255, 255, .9);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 24px 60px rgba(90, 85, 79, .12);
}

.wartime-engagement__visual a,
.wartime-engagement__visual img {
    display:block;
    width:100%;
}

.wartime-engagement__visual a {
    overflow:hidden;
}

@media (max-width:900px) {

    .wartime-engagement__copy,
    .wartime-engagement__visual {
        grid-column:1 / span 6;
    }

    .wartime-engagement__visual {
        max-width:43rem;
    }
}

@media (max-width:600px) {

    .wartime-engagement__copy,
    .wartime-engagement__visual {
        grid-column:1;
    }
}

.intro-text-left {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
}

@media (max-width:900px) {
    .intro-text-left {
        grid-template-columns:minmax(0, 1fr);
        gap:clamp(3rem, 8vw, 5rem);
    }

    .intro-text-left > .position-relative {
        width:100%;
        max-width:46rem;
    }

    .intro-text-left .more-toggle {
        display:inline-flex;
        min-height:2.75rem;
        margin-top:.25rem;
        padding:.35rem 0;
        align-items:center;
    }

    .intro-text-left > .keyvisual-absolute {
        top:auto;
        right:unset;
        left:15%;
        bottom:0;
        width:min(42rem, 76vw);
        opacity:.3;
    }

    .intro-text-left > .start-objekt {
        grid-row:2;
        width:clamp(11rem, 34vw, 15rem);
        max-width:none;
        margin:0 auto;
    }
}

@media (max-width:600px) {
    .intro-text-left {
        gap:2.75rem;
    }

    .intro-text-left > .position-relative {
        font-size:.98rem;
        line-height:1.65;
    }

    .intro-text-left > .keyvisual-absolute {
        width: 100%;
    }

    .intro-text-left > .start-objekt {
        width:min(11rem, 52vw);
    }
}

.opa-osna-wrapper {
    padding:2rem;
}

/* --------------- SPLIDE ---------------------------------------*/

.image-slider {
    width:100%;
}

.image-slider .splide__slide {
    height:600px;
}

.image-slider img {
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
}


.slider-navigation {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:30px;
    margin-top:40px;
}

.slider-navigation .splide__pagination__page {
    display:none !important;
}

.slider-navigation button {
    background:none;
    border:0;
    cursor:pointer;
    font-size:1rem;
}

.slider-prev,
.slider-next {
    font-size:1rem !important;
    background:var(--color-primary) !important;
    color:var(--color-white) !important;
}

.slider-titles {
    display:flex;
    gap:35px;
}

.slider-titles button {
    opacity:.5;
}

.slider-titles button.active {
    opacity:1;
    font-weight:700;
}

.gallery-main {
    width:100%;
}

.gallery-main .splide__slide {
    height:800px;
}

.gallery-main img {
    width:100%;
    height:100%;
    object-fit:cover;
}

.gallery-thumbs {
    margin-top:20px;
}

.gallery-thumbs .splide__slide {
    height:75px;
    opacity:.5;
    cursor:pointer;
    transition:var(--transition);
    background:var(--color-primary);
    border:none !important;
    border-radius: var(--radius-md);
}

.gallery-thumbs .splide__slide:hover {
    opacity:0.75;
    mix-blend-mode: lighten;
}

.gallery-thumbs .splide__slide.is-active {
    opacity:0.75;
    mix-blend-mode: lighten;
}

.gallery-thumbs .splide__slide.is-active img {
    mix-blend-mode: lighten;
}

.gallery-thumbs img {
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius: var(--radius-md);
}

.slider-navigation{
    display:flex;
    align-items:center;
    gap:20px;
    margin-top:30px;
}

.slider-prev,
.slider-next{
    width:42px;
    height:42px;
    border:none;
    background:var(--color-white);
    border-radius:50%;
    cursor:pointer;
    transition: var(--transition);
    display:flex;
    align-items:center;
    justify-content:center;
}

.slider-prev:hover {
    transform: scale(1.2);
}

.slider-next:hover {
    transform: scale(1.2);
}

.slider-scrollbar{
    flex:1;
    position:relative;
    height:4px;
    background:#ddd;
    border-radius:99px;
}

.slider-scrollbar__thumb{
    position:absolute;
    top:0;
    left:0;
    height:100%;
    width:120px;
    background:#000;
    border-radius:99px;
}

@media(max-width:600px) {
    .gallery-main .splide__slide {
        height:auto;
    }
}

/* --------------- OVERFLOW SLIDER ---------------------------------------*/

.overflow-slider-wrapper {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(5rem, 8vw, 8rem) 0;
    color:var(--color-white);
    background:
            var(--color-dark);
    background-size:auto, 48px 48px, 48px 48px, auto;
}

.overflow-slider-wrapper:before {
    content:attr(data-period);
    position:absolute;
    top:2rem;
    left:2rem;
    z-index:-1;
    color:transparent;
    -webkit-text-stroke:1px rgba(255, 255, 255, .2);
    font-size:clamp(7rem, 19vw, 19rem);
    font-weight:700;
    line-height:1;
    pointer-events:none;
}

.overflow-slider-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:2rem;
    margin-bottom:clamp(3.5rem, 6vw, 6rem);
    padding-bottom:1rem;
    border-bottom:1px solid rgba(255, 255, 255, .18);
}

.overflow-slider-kicker,
.overflow-slider-stock {
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.overflow-slider-kicker {
    color:var(--color-primary);
}

.overflow-slider-stock {
    color:rgba(255, 255, 255, .5);
}

.overflow-slider-layout {
    align-items:start;
}

.overflow-slider-wrapper .box-top {
    position:relative;
    z-index:5;
    padding:2rem;
    background:rgba(255, 255, 255, .15);
    border-radius:.25rem;
    box-shadow:0 24px 70px rgba(0, 0, 0, .25);
    backdrop-filter:blur(8px);
}

.overflow-slider-wrapper .box-top h3 {
    margin-top:0;
    margin-bottom:1.5rem;
    color:var(--color-primary);
    line-height:1.05;
}

.overflow-slider-wrapper .box-top p {
    color:rgba(255, 255, 255, .72);
}

.overflow-slider-tags span {
    padding:.35rem .65rem;
    color:rgba(255, 255, 255, .78);
    border:1px solid rgba(255, 255, 255, .2);
    border-radius:var(--radius-pill);
    font-size:.65rem;
    font-weight:600;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.overflow-slider-wrapper .splide {
    min-width:0;
    padding-top:1rem;
}

.overflow-slider-wrapper .splide__track {
    overflow:visible;
}

.overflow-slider-wrapper .splide__slide {
    width:auto;
    padding-bottom:1rem;
}

.overflow-slider-wrapper .splide__slide:nth-child(even) {
    padding-top:2.5rem;
}

.overflow-slide-card {
    display:block;
    width:clamp(15rem, 21vw, 22rem);
    padding:.75rem;
    color:var(--color-dark);
    background:#f5f2eb;
    border:1px solid rgba(255, 255, 255, .65);
    border-radius:.2rem;
    box-shadow:0 22px 50px rgba(0, 0, 0, .35);
    transform:rotate(-1deg);
    transition:transform .45s ease, box-shadow .45s ease;
}

.overflow-slider-wrapper .splide__slide:nth-child(even) .overflow-slide-card {
    transform:rotate(1deg);
}

.overflow-slide-card:hover,
.overflow-slide-card:focus-visible,
.overflow-slider-wrapper .splide__slide:nth-child(even) .overflow-slide-card:hover,
.overflow-slider-wrapper .splide__slide:nth-child(even) .overflow-slide-card:focus-visible {
    outline:none;
    box-shadow:0 30px 70px rgba(0, 0, 0, .48);
    transform:translateY(-8px) rotate(0);
}

.overflow-slider-wrapper .splide__slide img {
    width:100%;
    aspect-ratio:1906 / 2398;
    object-fit:contain;
    background:var(--color-white);
}

.overflow-slide-meta {
    display:block;
    min-height:4rem;
    padding:.9rem .25rem .3rem;
    border-top:1px solid rgba(90, 85, 79, .16);
}

.overflow-slide-meta > span,
.overflow-slide-meta strong {
    display:block;
}

.overflow-slide-meta > span {
    margin-bottom:.25rem;
    color:var(--color-primary);
    font-size:.82rem;
    font-weight:400;
    display: none;
}

.overflow-slide-meta strong {
    color:var(--color-text);
    font-size:.78rem;
    line-height:1.25;
}

.overflow-slider-wrapper .slider-navigation {
    display:grid;
    grid-template-columns:42px minmax(8rem, 1fr) 42px;
    gap:1rem;
    justify-content:stretch;
    margin-top:2rem;
}

.overflow-slider-wrapper .slider-prev,
.overflow-slider-wrapper .slider-next {
    border:1px solid rgba(255, 255, 255, .25);
    box-shadow:0 8px 24px rgba(0, 0, 0, .22);
}

.overflow-slider-wrapper .slider-scrollbar {
    overflow:hidden;
    background:rgba(255, 255, 255, .16);
}

.overflow-slider-wrapper .slider-scrollbar__thumb {
    width:clamp(3rem, 22%, 7.5rem);
    background:var(--color-primary);
}

.overflow-slider-hint {
    grid-column:2;
    color:rgba(255, 255, 255, .42);
    font-size:.65rem;
    letter-spacing:.08em;
    text-align:center;
    text-transform:uppercase;
}

/* Helle Archivvariante, z. B. für historische Zeitungsanzeigen */
.overflow-slider-wrapper-light {
    color:var(--color-text);
    background:
            linear-gradient(rgba(90, 85, 79, .055) 1px, transparent 1px),
            linear-gradient(90deg, rgba(90, 85, 79, .055) 1px, transparent 1px),
            linear-gradient(135deg, #f4f1ea 0%, #fffdf8 72%, #f7f2e8 100%);
    background-size:48px 48px, 48px 48px, auto;
}

.overflow-slider-wrapper-light:before {
    -webkit-text-stroke-color:rgba(233, 76, 43, .13);
}

.overflow-slider-wrapper-light .box-top {
    background:rgba(255, 253, 248, .9);
    border:1px solid rgba(90, 85, 79, .12);
    box-shadow:0 24px 60px rgba(90, 85, 79, .13);
}

.overflow-slider-wrapper-light .box-top h3 {
    color:var(--color-primary);
}

.overflow-slider-wrapper-light .box-top p {
    color:var(--color-text);
}

.overflow-slider-wrapper-light .overflow-slider-kicker {
    display:block;
    margin-bottom:1rem;
}

.overflow-slider-wrapper-light .overflow-slide-card {
    background:#fffdf8;
    border-color:rgba(90, 85, 79, .14);
    box-shadow:0 18px 42px rgba(90, 85, 79, .19);
}

.overflow-slider-wrapper-light .overflow-slide-card:hover,
.overflow-slider-wrapper-light .overflow-slide-card:focus-visible,
.overflow-slider-wrapper-light .splide__slide:nth-child(even) .overflow-slide-card:hover,
.overflow-slider-wrapper-light .splide__slide:nth-child(even) .overflow-slide-card:focus-visible {
    box-shadow:0 28px 58px rgba(90, 85, 79, .25);
}

.overflow-slider-wrapper-light .slider-prev,
.overflow-slider-wrapper-light .slider-next {
    color:var(--color-dark);
    background:rgba(255, 253, 248, .82);
    border-color:rgba(90, 85, 79, .2);
    box-shadow:0 8px 22px rgba(90, 85, 79, .13);
}

.overflow-slider-wrapper-light .slider-scrollbar {
    background:rgba(90, 85, 79, .14);
}

.overflow-slider-wrapper-light .overflow-slider-hint {
    color:rgba(90, 85, 79, .58);
}

@media (max-width:900px) {
    .overflow-slider-layout {
        gap:3rem;
    }

    .overflow-slider-wrapper .box-top {
        max-width:44rem;
    }

    .overflow-slide-card {
        width:clamp(15rem, 42vw, 21rem);
    }
}

@media (max-width:600px) {
    .overflow-slider-wrapper {
        padding:4.5rem 0;
    }

    .overflow-slider-heading {
        align-items:flex-start;
        flex-direction:column;
        gap:.5rem;
    }

    .overflow-slider-wrapper .box-top {
        padding:1.5rem;
    }

    .overflow-slide-card {
        width:72vw;
    }

    .overflow-slider-wrapper .splide__slide:nth-child(even) {
        padding-top:1.5rem;
    }

    .overflow-slider-hint {
        display:none;
    }
}

/* --------------- KEYVISUAL ---------------------------------------*/

.logo {
    overflow: visible;
}

.logo svg {
    display: block;
    overflow: visible;
}

.logo {
    max-width: 400px;
    margin: auto;
}

.logo path {
    opacity: 0;
    transform-origin: center;
    will-change: transform, opacity, filter;

    animation: revealPart .9s cubic-bezier(.22,1,.36,1) forwards;
}


/* leicht unterschiedliche Startrichtungen */

.logo path:nth-child(odd) {
    transform: translate(-20px, 12px) rotate(-3deg) scale(.96);
}

.logo path:nth-child(even) {
    transform: translate(20px, -12px) rotate(3deg) scale(.96);
}


/* Delays */

.logo path:nth-child(1)  { animation-delay: .00s; }
.logo path:nth-child(2)  { animation-delay: .08s; }
.logo path:nth-child(3)  { animation-delay: .16s; }
.logo path:nth-child(4)  { animation-delay: .24s; }
.logo path:nth-child(5)  { animation-delay: .32s; }
.logo path:nth-child(6)  { animation-delay: 1.40s; }
.logo path:nth-child(7)  { animation-delay: .48s; }
.logo path:nth-child(8)  { animation-delay: .56s; }
.logo path:nth-child(9)  { animation-delay: .64s; }
.logo path:nth-child(10) { animation-delay: .72s; }
.logo path:nth-child(11) { animation-delay: .80s; }
.logo path:nth-child(12) { animation-delay: .88s; }


@keyframes revealPart {

    0%{
        opacity:0;
        filter:blur(12px);
    }

    60%{
        opacity:1;
        filter:blur(0);
        transform:translate(0,0) rotate(0deg) scale(1.03);
    }

    100%{
        opacity:1;
        filter:blur(0);
        transform:translate(0,0) rotate(0deg) scale(1);
    }

}

.blueprint line,
.blueprint path,
.blueprint polyline,
.blueprint circle,
.blueprint rect {

    fill:none;
    animation: drawLine 2s cubic-bezier(.77,0,.18,1) forwards;

}


@keyframes drawLine {

    to {
        stroke-dashoffset:0;
    }

}

/* --------------- QUOTE ---------------------------------------*/

.quote-text {
    font-size:2.75rem;
    color:var(--color-primary);
    margin-bottom:1rem;
    line-height:3.5rem;
}

/* --------------- CIRCLES / PEOPLE ARCHIVE ---------------------------------------*/

.circles-wrapper {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(5rem, 8vw, 8rem) 0;
    background:
            #f8f6f2;
}

.circles-wrapper:before {
    content:attr(data-label);
    position:absolute;
    top:-1rem;
    left:-1rem;
    z-index:-1;
    color:transparent;
    -webkit-text-stroke:1px rgba(230, 50, 30, .09);
    font-size:clamp(6rem, 15vw, 15rem);
    font-weight:700;
    line-height:1;
    letter-spacing:-.06em;
    pointer-events:none;
}

.circles-copy {
    position:relative;
    z-index:3;
    max-width:35rem;
    margin-bottom:-8rem;
    padding:2rem 2.25rem 2.25rem;
    background:var(--color-white);
    border-top:1px solid rgba(90, 85, 79, .1);
    border-right:1px solid rgba(90, 85, 79, .1);
    border-bottom:1px solid rgba(90, 85, 79, .1);
    border-left:1px solid rgba(90, 85, 79, .1);
    border-radius:.25rem;
    box-shadow:0 24px 60px rgba(90, 85, 79, .12);
    backdrop-filter:blur(10px);
}

.circles-kicker {
    display:block;
    margin-bottom:.8rem;
    color:var(--color-primary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.circles-copy h2 {
    margin:0 0 1.25rem;
    color:var(--color-dark);
    font-size:clamp(2rem, 3.4vw, 3.35rem);
    line-height:1.06;
}

.circles-copy p {
    max-width:31rem;
    margin:0;
}

.circles-stage {
    position:relative;
    z-index:1;
}

.circles-stage:before,
.circles-stage:after {
    content:'';
    position:absolute;
    top:51%;
    left:62%;
    z-index:2;
    border:1px solid rgba(230, 50, 30, .24);
    border-radius:50%;
    pointer-events:none;
    transform:translate(-50%, -50%);
}

.circles-stage:before {
    width:35%;
    aspect-ratio:1;
}

.circles-stage:after {
    width:38%;
    aspect-ratio:1;
    border-color:rgba(230, 50, 30, .1);
}

.circles-stage svg {
    width:100%;
    overflow:visible;
}

.circles-stage svg .cls-2 {
    fill:#dedbd5;
    transform-box:fill-box;
    transform-origin:center;
    animation:chronicleCirclePulse 9s ease-in-out infinite;
}

.circles-stage svg .cls-2:nth-of-type(3n) {
    fill:#dedbd5;
    animation-delay:-3s;
}

.circles-stage svg .cls-2:nth-of-type(4n) {
    fill:#dedbd5;
    animation-name:chronicleCirclePulseAccent;
    animation-delay:-6s;
}

.circles-stage image {
    /*filter:grayscale(1) contrast(1.05);*/
}

.circles-caption {
    position:absolute;
    right: 10.5%;
    bottom: 18%;
    z-index:3;
    min-width:13rem;
    padding:1rem 1.25rem;
    background:var(--color-primary);
    color:var(--color-white);
    box-shadow:0 16px 38px rgba(90, 85, 79, .18);
}

.circles-caption:before {
    content:'';
    position:absolute;
    top:50%;
    right:100%;
    width:4rem;
    height:1px;
    background:var(--color-primary);
}

.circles-caption-index,
.circles-caption strong {
    display:block;
}

.circles-caption-index {
    margin-bottom:.2rem;
    font-size:.8rem;
    font-weight:400;
    opacity:.72;
}

.circles-caption strong {
    font-size:.9rem;
}

@media (max-width:900px) {
    .circles-copy {
        max-width:34rem;
        margin-bottom:-3rem;
    }

    .circles-copy:after {
        display:none;
    }

    .circles-stage svg {
        width:125%;
        max-width:none;
        margin-left:-12.5%;
    }
}

@media (max-width:600px) {
    .circles-wrapper {
        padding:4.5rem 0;
    }

    .circles-copy {
        margin-bottom:1rem;
        padding:1.5rem;
    }

    .circles-stage {
        width:calc(100% + 2rem);
        margin-left:-1rem;
    }

    .circles-stage svg {
        width:175%;
        margin-left:-58%;
    }

    .circles-stage:before {
        width:58%;
    }

    .circles-stage:after {
        width:64%;
    }

    .circles-stage:before,
    .circles-stage:after {
        left:50%;
    }

    .circles-caption {
        position:relative;
        right:auto;
        bottom:auto;
        width:max-content;
        margin:-1.5rem 1rem 0 auto;
    }
}

@media (prefers-reduced-motion:reduce) {
    .circles-stage svg .cls-2 {
        animation:none;
    }

    .circles-stage svg .cls-2:nth-of-type(4n) {
        opacity:.16;
    }
}

/* --------------- WER IM WANDEL ---------------------------------------*/

.werkimwandel {
    margin-top:10rem;
}

.werkimwandel img {
    margin-top:-35%;
    mix-blend-mode: multiply;
}

@media(max-width:900px) {
    .werkimwandel img {
        margin-top:0;
    }
}

/* --------------- ENERGY CHAIN / CHAPTER 5 ---------------------------------------*/

.energy-chain-section {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(5rem, 8vw, 8rem) 0;
    background:var(--bg-raster);
    background-size:var(--bg-raster-size);
}

.energy-chain-heading {
    display:grid;
    grid-template-columns:minmax(0, 1.05fr) minmax(18rem, .75fr);
    align-items:end;
    gap:clamp(2rem, 7vw, 8rem);
    margin-bottom:clamp(6.5rem, 9vw, 10rem);
    position:relative;
    z-index:2;
}

.energy-chain-illu img {
    position:absolute;
    width:55%;
    top:-35%;
    left:45%;
}

.energy-chain-kicker {
    display:block;
    margin-bottom:.85rem;
    color:var(--color-primary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.energy-chain-heading h2 {
    max-width:38rem;
    margin:0;
    color:var(--color-primary);
    font-size:clamp(2rem, 4vw, 4rem);
    line-height:1;
    letter-spacing:-.04em;
}

.energy-chain-heading > p {
    margin:0 0 .5rem;
    padding-left:1.5rem;
    border-left:3px solid var(--color-primary);
}

.energy-chain-hero {
    position:relative;
    display:grid;
    grid-template-columns:minmax(0, 1.45fr) minmax(16rem, .55fr);
    min-height:clamp(28rem, 52vw, 48rem);
    margin:0;
    overflow:hidden;
    background:var(--color-dark);
    border-radius:.25rem;
    box-shadow:0 28px 70px rgba(90, 85, 79, .18);
}

.energy-chain-hero:after {
    content:'';
    position:absolute;
    inset:0;
    background:
            linear-gradient(90deg, rgba(0, 2, 7, .68), transparent 56%),
            linear-gradient(0deg, rgba(0, 2, 7, .52), transparent 45%);
    pointer-events:none;
}

.energy-chain-hero-main,
.energy-chain-hero-side {
    min-width:0;
    min-height:inherit;
    overflow:hidden;
}

.energy-chain-hero-main img,
.energy-chain-hero-side img {
    width:100%;
    height:100%;
    min-height:inherit;
    object-fit:cover;
    filter:grayscale(1) contrast(1.06);
}

.energy-chain-hero-main img {
    object-position:center;
}

.energy-chain-hero-side {
}

.energy-chain-hero-side img {
    object-position:center;
}

.energy-chain-decade {
    position:absolute;
    top:clamp(1.5rem, 4vw, 4rem);
    right:clamp(1.5rem, 4vw, 4rem);
    z-index:2;
    color:transparent;
    -webkit-text-stroke:1px rgba(255, 255, 255, .55);
    font-size:clamp(3rem, 9vw, 9rem);
    font-weight:700;
    line-height:1;
    letter-spacing:-.06em;
}

.energy-chain-hero figcaption {
    position:absolute;
    bottom:clamp(1.5rem, 4vw, 4rem);
    left:clamp(1.5rem, 4vw, 4rem);
    z-index:2;
    max-width:37rem;
    padding:1.5rem 1.75rem;
    color:var(--color-white);
    background:rgba(230, 50, 30, .92);
    box-shadow:0 18px 45px rgba(0, 0, 0, .22);
}

.energy-chain-hero figcaption.top {
    top:clamp(1.5rem, 4vw, 4rem);
    bottom:unset;
}

.energy-chain-hero figcaption h3 {
    color:var(--color-white);
}

.energy-chain-hero figcaption > span,
.energy-chain-hero figcaption > strong,
.energy-chain-hero figcaption > small {
    display:block;
}

.energy-chain-hero figcaption > span {
    margin-bottom:.35rem;
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.14em;
    opacity:.75;
    text-transform:uppercase;
}

.energy-chain-hero figcaption > strong {
    margin-bottom:.65rem;
    font-size:clamp(1.35rem, 2.5vw, 2rem);
    line-height:1.1;
}

.energy-chain-hero figcaption > small {
    font-size:.68rem;
    opacity:.72;
}

.energy-chain-flow {
    position:relative;
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:clamp(1rem, 2.4vw, 2.5rem);
    margin:clamp(4rem, 7vw, 7rem) 0 0;
    padding:0;
    list-style:none;
}

.energy-chain-flow:before {
    content:'';
    position:absolute;
    top:1.4rem;
    right:calc(12.5% - 1.4rem);
    left:calc(12.5% - 1.4rem);
    height:2px;
    background:linear-gradient(90deg, var(--color-grey-light), var(--color-primary));
}

.energy-chain-step {
    position:relative;
    min-width:0;
    padding-top:4.25rem;
}

.energy-chain-step:not(:last-child):after {
    content:'›';
    position:absolute;
    top:.15rem;
    right:calc(-1.2vw - .5rem);
    z-index:2;
    color:var(--color-primary);
    font-size:2.2rem;
    font-weight:200;
    line-height:1;
}

.energy-chain-marker {
    position:absolute;
    top:0;
    left:50%;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:center;
    width:2.8rem;
    height:2.8rem;
    color:var(--color-primary);
    background:var(--color-primary-light);
    border:1px solid var(--color-primary);
    border-radius:50%;
    box-shadow:0 0 0 7px rgba(230, 50, 30, .1);
    font-size:.68rem;
    font-weight:700;
    transform:translateX(-50%);
}

.energy-chain-card {
    height:100%;
    overflow:hidden;
    background:rgba(255, 255, 255, .94);
    border:1px solid rgba(90, 85, 79, .12);
    border-radius:.25rem;
    box-shadow:0 18px 44px rgba(90, 85, 79, .1);
    transition:transform .45s ease, box-shadow .45s ease;
}

.energy-chain-card:hover {
    transform:translateY(-8px);
    box-shadow:0 28px 64px rgba(90, 85, 79, .16);
}

.energy-chain-media {
    height:18rem;
    overflow:hidden;
    background:#e8e5df;
}

.energy-chain-media img {
    width:100%;
    height:100%;
    object-fit:cover;
    filter:grayscale(1);
    transition:transform .6s ease;
}

.energy-chain-card:hover .energy-chain-media img {
    transform:scale(1.04);
}

.energy-chain-media-illustration {
    padding:1rem;
    background:var(--color-white);
}

.energy-chain-media-illustration img {
    object-fit:contain;
    filter:grayscale(1) contrast(1.12);
}

.energy-chain-label,
.energy-chain-card h3,
.energy-chain-card p,
.energy-chain-card > small {
    margin-right:1.5rem;
    margin-left:1.5rem;
}

.energy-chain-label {
    display:block;
    margin-top:1.5rem;
    margin-bottom:.5rem;
    color:var(--color-primary);
    font-size:.8rem;
    font-weight:500;
}

.energy-chain-card h3 {
    margin-top:0;
    margin-bottom:1rem;
    color:var(--color-dark);
    font-size:clamp(1.35rem, 2vw, 1.8rem);
    line-height:1.1;
}

.energy-chain-card p {
    margin-top:0;
    margin-bottom:1.25rem;
    font-size:.9rem;
    display:none;
}

.energy-chain-card > small {
    display:block;
    margin-bottom:1.5rem;
    color:var(--color-grey);
    font-size:.62rem;
    display:none;
}

.energy-chain-step-focus .energy-chain-marker {
    color:var(--color-white);
    background:var(--color-primary);
}

.energy-chain-step-focus .energy-chain-card {
    border-color:rgba(230, 50, 30, .42);
}

.energy-chain-step-focus .energy-chain-label {
    width:max-content;
    padding:.35rem .6rem;
    color:var(--color-white);
    background:var(--color-primary);
}

.energy-chain-conclusion {
    display:grid;
    grid-template-columns:minmax(18rem, .55fr) minmax(0, 1.15fr);
    gap:0;
    margin-top:clamp(7rem, 10vw, 10rem);
    color:var(--color-primary);
    background:var(--color-primary-light);
}

.energy-chain-document {
    position:relative;
    display:block;
    min-height:28rem;
    padding:1.5rem;
    overflow:visible;
}

.energy-chain-document img {
    width:100%;
    height:120%;
    object-fit:contain;
    transition:transform .6s ease;
    position:absolute;
    top:-10%;
}

.energy-chain-document:hover img,
.energy-chain-document:focus-visible img {
    transform:scale(1.025);
}

.energy-chain-conclusion-copy {
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:clamp(2rem, 5vw, 5rem);
}

.energy-chain-conclusion-copy span {
    align-self:start;
    padding-top:.35rem;
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.15em;
    opacity:.72;
    text-transform:uppercase;
}

.energy-chain-conclusion-copy p {
    max-width:58rem;
    margin:1.5rem 0;
    font-size:clamp(1.35rem, 2.5vw, 2.25rem);
    font-weight:500;
    line-height:1.25;
}

.energy-chain-conclusion-copy small {
    font-size:.68rem;
    opacity:.72;
}

@media (max-width:1100px) {
    .energy-chain-hero:after {
        background:none;
    }
    .energy-chain-hero {
        background:none;
    }
    .energy-chain-hero figcaption {
        position:relative;
    }
    .energy-chain-flow {
        grid-template-columns:repeat(2, minmax(0, 1fr));
        row-gap:3rem;
    }

    .energy-chain-flow:before,
    .energy-chain-step:not(:last-child):after {
        display:none;
    }

    .energy-chain-step {
        padding-top:0;
    }

    .energy-chain-marker {
        top:1rem;
        left:1rem;
        color:var(--color-white);
        background:var(--color-primary);
        transform:none;
    }
}

@media(max-width:900px) {

}

@media (max-width:800px) {
    .energy-chain-heading,
    .energy-chain-conclusion {
        grid-template-columns:1fr;
    }

    .energy-chain-heading {
        gap:2rem;
    }

    .energy-chain-hero {
        grid-template-columns:minmax(0, 1.2fr) minmax(10rem, .8fr);
        min-height:34rem;
    }

    .energy-chain-decade {
        top:1.5rem;
        right:1.5rem;
    }

    .energy-chain-illu img {
        position:relative;
        width:75%;
        margin-bottom:-10rem;
        left:unset;
        top:unset;
    }
}

@media (max-width:600px) {
    .energy-chain-section {
        padding:4.5rem 0;
    }

    .energy-chain-flow {
        grid-template-columns:1fr;
        gap:2rem;
    }

    .energy-chain-hero {
        min-height:38rem;
        grid-template: unset;
    }

    .energy-chain-hero-main img {
        object-position:58% center;
    }

    .energy-chain-hero figcaption {
        right:1rem;
        bottom:1rem;
        left:1rem;
    }

    .energy-chain-media {
        height:14rem;
    }

    .energy-chain-document {
        min-height:22rem;
    }
    .energy-chain-illu img {
        width:100%;
    }
}

/* --------------- ILLU MENU ---------------------------------------*/

.illu-menu .illus {
    height:650px;
    position:relative;
    margin-top:-50px;
}

.illu {
    max-width:1000px;
    margin:auto;
    position:absolute;
    height:100%;
    width:100%;
    left:50%;

    opacity:0;
    transform:translate(-50%, 20px);
    pointer-events:none;

    transition:
            opacity .6s ease,
            transform .6s ease;
}

.illu.active {
    opacity:1;
    transform:translate(-50%, 0);
    pointer-events:auto;
}

.illu-menu h3 {
    max-width:40rem;
}

.illu-menu .text-center h3 {
    margin:auto;
}

.illu img {
    opacity:1;
    height:100%;
    object-fit: contain;
    object-position: center;
    width:100%;
}

.illu-years {
    position: absolute;
    color:var(--color-primary);
    font-size:9rem;
    font-weight:200;
    top:50%;
    left:50%;
    transform:translate(-50%, calc(-50% + 20px));
    line-height:7.5rem;
}

.illu-text {
    color:var(--color-primary);
    position: absolute;
    top:55%;
    right:-11%;
    transform: translate(0,-50%);
    font-size:1.5rem;
    font-weight:600;
    width:300px;
    line-height: .98;
    letter-spacing: -.045em;
}

.illu-text-last {
    right:-18%;
}

.illu-links {
    display: flex;
    padding: 0;
    margin: 0;
    list-style: none;
    margin-top:5rem;
    position: relative;
}

.illu-links:before {
    content:'';
    position: absolute;
    bottom:-20px;
    width:100%;
    height:1px;
    background: var(--color-grey-light);
}

.illu-links li {
    flex: 1;
    text-align: center;
    cursor: pointer;
    transition: var(--transition);
    font-weight:600;
    position:relative;
    color:var(--color-grey);
}

.illu-links li button {
    display:flex;
    width:100%;
    min-height:2.75rem;
    padding:.35rem .5rem;
    align-items:center;
    justify-content:center;
    border:0;
    background:transparent;
    color:inherit;
    font:inherit;
    cursor:pointer;
}

.illu-links li button:focus-visible {
    border-radius:var(--radius-pill);
    outline:2px solid var(--color-primary);
    outline-offset:4px;
}

.illu-links li:after {
    content:'';
    position:absolute;
    left:50%;
    bottom:-24px;
    width:7px;
    height:7px;
    background:var(--color-white);
    border:1px solid var(--color-primary);
    border-radius: var(--radius-pill);
    z-index:9;
    transition: var(--transition);
}

.illu-links .active:after {
    background:var(--color-primary);
    bottom:-25px;
    width:10px;
    height:10px;
}

.illu-links li:hover {
    color: var(--color-text);
}

.illu-links li:hover:after {
    background: var(--color-primary);
}

.illu-links .active {
    color:var(--color-primary) !important;
    font-weight:600;
}

.illu-years,
.illu-text {
    opacity:0;
    transform:translate(-50%, calc(-50% + 20px));
    transition:
            opacity .5s ease .35s,
            transform .5s ease .35s;
}

.illu.active .illu-years,
.illu.active .illu-text {
    opacity:1;
    transform:translate(-50%, -50%);
}

.illu .button {
    margin-top:1rem;
    display: block;
    width:max-content;
}

@media(max-width:900px) {
    #illu-menu {
        margin-top:clamp(2.5rem, 7vw, 4rem);
    }

    .illu-menu .illus {
        height:clamp(31rem, 72vw, 38rem);
        margin-top:0;
    }

    .illu-years {
        font-size:clamp(5rem, 15vw, 8rem);
        line-height:.86;
    }

    .illu-text {
        top:auto;
        right:auto;
        bottom:0;
        left:50%;
        width:min(30rem, 88%);
        text-align:center;
        transform:translate(-50%, 1rem);
    }

    .illu.active .illu-text {
        transform:translate(-50%, 0);
    }

    .illu .button {
        margin:1rem auto 0;
    }

    .illu-links {
        gap:.65rem;
        margin-top:clamp(2rem, 6vw, 3rem);
        padding:.35rem .15rem .85rem;
        overflow-x:auto;
        overflow-y:hidden;
        overscroll-behavior-inline:contain;
        scroll-behavior:smooth;
        scroll-padding-inline:.15rem;
        scroll-snap-type:x mandatory;
        scrollbar-color:var(--color-primary) var(--color-grey-light);
        scrollbar-width:thin;
        touch-action:pan-x;
        -webkit-overflow-scrolling:touch;
    }

    .illu-links::-webkit-scrollbar {
        height:4px;
    }

    .illu-links::-webkit-scrollbar-track {
        background:var(--color-grey-light);
        border-radius:var(--radius-pill);
    }

    .illu-links::-webkit-scrollbar-thumb {
        background:var(--color-primary);
        border-radius:var(--radius-pill);
    }

    .illu-links::before,
    .illu-links li::after {
        display:none;
    }

    .illu-links li {
        flex:0 0 clamp(8.75rem, 29vw, 11rem);
        min-width:0;
        border:1px solid rgba(90, 85, 79, .15);
        border-radius:var(--radius-pill);
        background:var(--color-white);
        scroll-snap-align:center;
    }

    .illu-links li button {
        min-height:3rem;
        padding:.7rem .9rem;
        white-space:nowrap;
        font-size:0.9rem;
    }

    .illu-links li:hover {
        border-color:rgba(230, 50, 30, .4);
    }

    .illu-links .active {
        border-color:var(--color-primary);
        background:var(--color-primary);
        color:var(--color-white) !important;
        box-shadow:0 8px 22px rgba(230, 50, 30, .2);
    }
}

@media(max-width:600px) {
    .illu-menu .illus {
        height:30rem;
    }

    .illu-years {
        font-size:clamp(4rem, 20vw, 6rem);
    }

    .illu-text {
        width:94%;
        font-size:1.25rem;
    }

    .illu-links {
        gap:.5rem;
    }

    .illu-links li {
        flex-basis:clamp(8.5rem, 43vw, 10rem);
    }
}

/* --------------- TEXT IMAGE ---------------------------------------*/

/* =========================================================
   TEXT IMAGE MODULE
========================================================= */

.text-image {
    width:100%;
}

.text-image-wrapper {
    display:grid;
    grid-template-columns:repeat(12, 1fr);
    gap:clamp(30px, 5vw, 80px);
    align-items:center;
}


/* =========================================================
   CONTENT
========================================================= */

.text-image-text {
    grid-column:span 5;
}

.text-image-text h2 {
    margin-top:0;
}

.text-image-text p {
    margin-bottom:0;
}


.text-image-image {
    grid-column:span 6;
    margin:0;
}

.text-image-image img {
    width:100%;
    height:auto;
    display:block;
}


/* =========================================================
   TEXT LINKS / BILD RECHTS
========================================================= */

.text-image.text-right .text-image-text {
    grid-column:1 / span 5;
}

.text-image.text-right .text-image-image {
    grid-column:7 / span 6;
}



/* =========================================================
   BILD LINKS / TEXT RECHTS
========================================================= */

.text-image.text-left .text-image-image {
    grid-column:1 / span 6;
    grid-row:1;
}

.text-image.text-left .text-image-text {
    grid-column:8 / span 5;
    grid-row:1;
}



/* =========================================================
   VARIANTE: BILD GRÖSSER
========================================================= */

.text-image.text-wide .text-image-image {
    grid-column:6 / span 7;
}

.text-image.text-wide .text-image-text {
    grid-column:1 / span 4;
}


.text-image.text-left.text-wide .text-image-image {
    grid-column:1 / span 7;
}

.text-image.text-left.text-wide .text-image-text {
    grid-column:9 / span 4;
}



/* =========================================================
   VARIANTE: VOLLBREITE
========================================================= */

.text-image.text-full .text-image-text {
    grid-column:1 / span 12;
}

.text-image.text-full .text-image-image {
    grid-column:1 / span 12;
}



/* =========================================================
   LARGE TABLET / SMALL DESKTOP
========================================================= */

@media (max-width:1100px) {

    .text-image-wrapper {
        gap:40px;
    }


    .text-image.text-right .text-image-text,
    .text-image.text-left .text-image-text {
        grid-column:1 / span 6;
    }


    .text-image.text-right .text-image-image,
    .text-image.text-left .text-image-image {
        grid-column:7 / span 6;
    }


    .text-image.text-left .text-image-image {
        grid-row:auto;
    }


    .text-image.text-left .text-image-text {
        grid-row:auto;
    }


    .text-image.text-wide .text-image-image,
    .text-image.text-left.text-wide .text-image-image {
        grid-column:7 / span 6;
    }


    .text-image.text-wide .text-image-text,
    .text-image.text-left.text-wide .text-image-text {
        grid-column:1 / span 6;
    }

}



/* =========================================================
   TABLET
========================================================= */

@media (max-width:800px) {

    .text-image-wrapper {
        grid-template-columns:repeat(6,1fr);
        gap:30px;
    }


    .text-image-text,
    .text-image-image,
    .text-image.text-right .text-image-text,
    .text-image.text-right .text-image-image,
    .text-image.text-left .text-image-text,
    .text-image.text-left .text-image-image,
    .text-image.text-wide .text-image-text,
    .text-image.text-wide .text-image-image,
    .text-image.text-left.text-wide .text-image-text,
    .text-image.text-left.text-wide .text-image-image {
        grid-column:1 / span 6;
    }


    .text-image.text-left .text-image-image {
        grid-row:auto;
    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width:600px) {

    .text-image-wrapper {
        grid-template-columns:1fr;
        gap:25px;
    }


    .text-image-text,
    .text-image-image,
    .text-image.text-right .text-image-text,
    .text-image.text-right .text-image-image,
    .text-image.text-left .text-image-text,
    .text-image.text-left .text-image-image {
        grid-column:1;
    }


}

/* --------------- KAPITEL 6 / ROTER FADEN ---------------------------------------*/

.chapter-six-lead {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(5.5rem, 9vw, 9rem) 0;
    background:var(--color-light);
}

.chapter-six-lead::before {
    content:'1969';
    position:absolute;
    top:-.14em;
    right:-.03em;
    z-index:-1;
    color:transparent;
    -webkit-text-stroke:1px rgba(230, 50, 30, .1);
    font-size:clamp(9rem, 24vw, 24rem);
    font-weight:700;
    line-height:1;
    letter-spacing:-.08em;
    pointer-events:none;
}

.chapter-six-lead__layout {
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter-six-lead__visual {
    grid-column:1 / span 7;
    position:relative;
    margin:0;
    padding:clamp(.6rem, 1vw, 1rem);
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 28px 70px rgba(90, 85, 79, .18);
    transform:rotate(-1deg);
}

.chapter-six-lead__visual::before {
    content:'';
    position:absolute;
    top:-1.5rem;
    right:-1.5rem;
    z-index:-1;
    width:42%;
    aspect-ratio:1;
    border:1px solid rgba(230, 50, 30, .24);
    border-radius:50%;
}

.chapter-six-lead__visual a {
    display:block;
    overflow:hidden;
}

.chapter-six-lead__visual img {
    width:100%;
    aspect-ratio:1.46 / 1;
    object-fit:cover;
    filter:grayscale(1) contrast(1.05);
    transition:transform .7s ease;
}

.chapter-six-lead__visual:hover img {
    transform:scale(1.025);
}

.chapter-six-lead__visual figcaption {
    display:flex;
    align-items:center;
    gap:1rem;
    padding:1rem .35rem .25rem;
    font-size:.68rem;
    line-height:1.3;
}

.chapter-six-lead__visual figcaption span {
    padding:.35rem .55rem;
    background:var(--color-primary);
    color:var(--color-white);
    font-size:.58rem;
    font-weight:700;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.chapter-six-lead__visual figcaption strong {
    color:var(--color-text);
}

.chapter-six-lead__copy {
    grid-column:9 / span 4;
    position:relative;
    z-index:2;
}

.chapter-six-lead__kicker {
    display:block;
    margin-bottom:1.1rem;
    color:var(--color-primary);
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.chapter-six-lead__copy h2 {
    margin:0 0 1.5rem;
    color:var(--color-primary);
    font-size:clamp(2.35rem, 4.5vw, 4.6rem);
    line-height:.98;
    letter-spacing:-.045em;
}

.chapter-six-lead__copy p {
    margin:0;
    padding-left:1.25rem;
    border-left:2px solid var(--color-primary);
    line-height:1.7;
}

/* --------------- WIEDERVERWENDBARE KAPITEL-STORY-SECTION ---------------------------------------*/

.chapter-story {
    position:relative;
    overflow:hidden;
    background:var(--color-white);
    border-bottom:1px solid rgba(90, 85, 79, .12);
}

.chapter-story--image-left {
    background:var(--color-light);
}

.chapter-story--raster {
    background:
            linear-gradient(rgba(90, 85, 79, .035) 1px, transparent 1px),
            linear-gradient(90deg, rgba(90, 85, 79, .035) 1px, transparent 1px),
            var(--color-white);
    background-size:48px 48px, 48px 48px, auto;
}

.chapter-story--anniversary {
    background:var(--color-primary-light);
}

.chapter-story--dark {
    background:var(--color-dark);
    color:var(--color-white);
}

.chapter-story__layout {
    position:relative;
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    gap:clamp(2.5rem, 6vw, 7rem);
    align-items:center;
    min-height:clamp(40rem, 62vw, 53rem);
    padding:clamp(5.5rem, 9vw, 9rem) 0;
}

.chapter-story__number {
    position:absolute;
    top:clamp(3rem, 7vw, 7rem);
    right:0;
    z-index:1;
    color:transparent;
    -webkit-text-stroke:1px rgba(230, 50, 30, .12);
    font-size:clamp(7rem, 16vw, 16rem);
    font-weight:700;
    line-height:.75;
    letter-spacing:-.07em;
    pointer-events:none;
}

.chapter-story--image-left .chapter-story__number {
    right:auto;
    left:0;
}

.chapter-story--dark .chapter-story__number {
    -webkit-text-stroke-color:rgba(255, 255, 255, .14);
}

.chapter-story__copy {
    grid-column:1 / span 5;
    position:relative;
    z-index:2;
    max-width:37rem;
}

.chapter-story--image-left .chapter-story__copy {
    grid-column:7 / span 5;
}

.chapter-story__kicker {
    display:block;
    margin-bottom:.8rem;
    color:var(--color-primary);
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.chapter-story__copy h2 {
    margin:0 0 1.35rem;
    color:var(--color-primary);
    font-size:clamp(2.4rem, 4.7vw, 4.75rem);
    line-height:.98;
    letter-spacing:-.045em;
}

.chapter-story__copy h3 {
    margin:0 0 1.35rem;
    color:var(--color-primary);
    font-size:clamp(2.15rem, 3.8vw, 3.8rem);
    line-height:1;
    letter-spacing:-.04em;
}

.chapter-story--dark .chapter-story__copy h3,
.chapter-story--dark .chapter-story__kicker {
    color:var(--color-white);
}

.chapter-story__copy p {
    margin:0;
    line-height:1.7;
}

.chapter-story__source {
    display:block;
    margin-top:1.5rem;
    color:rgba(90, 85, 79, .7);
    font-size:.78rem;
    font-weight:600;
    letter-spacing:.04em;
}

.chapter-story__media {
    grid-column:7 / span 6;
    position:relative;
    z-index:2;
    margin:0;
    padding:clamp(.55rem, 1vw, .9rem);
    box-shadow:0 24px 65px rgba(90, 85, 79, .17);
}

.chapter-story--image-left .chapter-story__media {
    grid-column:1 / span 6;
}

.chapter-story--portrait .chapter-story__media {
    grid-column:2 / span 4;
    width:min(100%, 27rem);
    justify-self:center;
    transform:rotate(-2deg);
}

.chapter-story__media a {
    display:block;
    overflow:hidden;
}

.chapter-story__media img {
    width:100%;
    object-fit:cover;
    /*filter:grayscale(1) contrast(1.04);*/
}

.chapter-story--portrait .chapter-story__media img {
    aspect-ratio:4 / 5;
    object-position:center top;
}

.partner-energie-logo {
    background: #fff;
    width: 200px;
    margin-top: 2rem;
    padding: 0.5rem;
    border-radius: 0.5rem;
}

.chapter-story--portrait .chapter-story__media--portrait-stack {
    margin-bottom:clamp(2.5rem, 5vw, 4.5rem);
}

.chapter-story--portrait .chapter-story__media--portrait-stack .chapter-story__media-foreground {
    position:absolute;
    right:clamp(-7.5rem, -8vw, -3.5rem);
    bottom:clamp(-3.5rem, -4vw, -2rem);
    z-index:3;
    width:72%;
    padding:clamp(.35rem, .7vw, .6rem);
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 20px 50px rgba(55, 50, 45, .28);
    transform:rotate(3deg);
}

.chapter-story--portrait .chapter-story__media--portrait-stack .chapter-story__media-foreground img {
    aspect-ratio:4 / 3;
    object-position:center;
}

.chapter-story--portrait .chapter-story__media--portrait-stack figcaption {
    position:relative;
    z-index:4;
    width:35%;
}

.chapter-story--research .chapter-story__media img {
    aspect-ratio:1.2 / 1;
    object-position:center 58%;
}

.chapter-story--research .chapter-story__comparison {
    overflow:hidden;
    aspect-ratio:1.2 / 1;
}

.chapter-story--research .chapter-story__comparison figure {
    width:100%;
    height:100%;
    margin:0;
}

.chapter-story--research .chapter-story__comparison img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.chapter-story--research .chapter-story__comparison .after .image-credit {
    right:5px;
    left:auto !important;
    max-width:calc(50% - 10px) !important;
    text-align:right;
}

.chapter-story__media--object {
    grid-column:2 / span 4 !important;
    padding:clamp(1.5rem, 4vw, 3rem);
    background:var(--color-primary-light);
    box-shadow:none;
}

.chapter-story__media--object img {
    max-height:34rem;
    aspect-ratio:4 / 5;
    object-fit:contain;
}

.chapter-story--document .chapter-story__media {
    grid-column:8 / span 4;
    width:min(100%, 28rem);
    justify-self:center;
    transform:rotate(2deg);
}

.chapter-story--document .chapter-story__media img {
    aspect-ratio:3 / 4;
    object-position:top;
}

.chapter-story__media--illustration {
    min-height:clamp(25rem, 38vw, 36rem);
    padding:2rem;
    box-shadow:none;
}

.chapter-story__media--illustration img {
    height:100%;
    min-height:clamp(21rem, 32vw, 31rem);
    object-fit:contain;
    filter:none;
}

.chapter-story__media figcaption {
    padding:.8rem .25rem .1rem;
    color:var(--color-primary);
    font-size:.9rem;
    font-weight:500;
    line-height:1.35;
}

.chapter-story__gallery {
    grid-column:7 / span 6;
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:clamp(.75rem, 1.5vw, 1.25rem);
}

.chapter-story--image-left .chapter-story__gallery {
    grid-column:1 / span 6;
}

.chapter-story__gallery figure {
    margin:0;
    padding:.6rem;
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 18px 45px rgba(90, 85, 79, .16);
}

.chapter-story__gallery figure:first-child {
    grid-column:1 / span 2;
}

.chapter-story__gallery img {
    width:100%;
    height:13rem;
    object-fit:cover;
}

.chapter-story__gallery figure:first-child img {
    height:clamp(17rem, 25vw, 23rem);
}

.chapter-story__gallery figcaption {
    padding:.75rem .2rem .1rem;
    color:var(--color-primary);
    font-size:.68rem;
    font-weight:500;
    line-height:1.35;
}

.chapter-story__gallery--portraits figure:first-child {
    grid-column:auto;
}

.chapter-story__gallery--portraits img,
.chapter-story__gallery--portraits figure:first-child img {
    height:auto;
    aspect-ratio:4 / 5;
    object-fit:cover;
    object-position:center top;
}

.chapter-story__gallery--documents figure:first-child {
    grid-column:auto;
}

.chapter-story__gallery--documents figure {
    display:flex;
    flex-direction:column;
    overflow:hidden;
}

.chapter-story__gallery--documents figure > a {
    display:block;
    overflow:hidden;
}

.chapter-story__gallery--documents img,
.chapter-story__gallery--documents figure:first-child img {
    display:block;
    height:auto;
    aspect-ratio:3 / 4;
    object-fit:contain;
    object-position:center;
    background:var(--color-grey-light);
}

.chapter-story__gallery--documents figcaption {
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:.2rem;
    min-height:3.8rem;
    padding:.75rem .25rem .15rem;
    color:var(--color-text);
    border-top:1px solid rgba(90, 85, 79, .14);
}

.chapter-story__gallery--documents figcaption span {
    color:var(--color-primary);
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.chapter-story__gallery--documents figcaption strong {
    font-size:.72rem;
    line-height:1.35;
}

.chapter-story__formula {
    display:flex;
    flex-wrap:wrap;
    gap:.65rem;
    align-items:center;
    margin-top:2.25rem;
    padding-top:1.25rem;
    border-top:1px solid rgba(90, 85, 79, .18);
    color:var(--color-primary);
    font-size:.64rem;
    font-weight:700;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.chapter-story__formula span[aria-hidden] {
    opacity:.5;
}

@media (max-width:900px) {
    .chapter-six-lead__layout,
    .chapter-story__layout {
        grid-template-columns:repeat(6, minmax(0, 1fr));
    }

    .chapter-six-lead__visual {
        grid-column:1 / span 6;
    }

    .chapter-six-lead__copy {
        grid-column:1 / span 5;
    }

    .chapter-story__copy,
    .chapter-story--image-left .chapter-story__copy {
        grid-column:1 / span 6;
        grid-row:auto;
        max-width:43rem;
    }

    .chapter-story__media,
    .chapter-story--image-left .chapter-story__media,
    .chapter-story__gallery,
    .chapter-story--image-left .chapter-story__gallery {
        grid-column:1 / span 6;
        grid-row:auto;
        width:100%;
        max-width:48rem;
        justify-self:start;
    }

    .chapter-story--image-left .chapter-story__media,
    .chapter-story--image-left .chapter-story__gallery {
        grid-row:2;
    }

    .chapter-story--portrait .chapter-story__media,
    .chapter-story__media--object {
        max-width:30rem;
    }

    .chapter-story--portrait .chapter-story__media--portrait-stack {
        width:min(82%, 30rem);
        margin-left:0;
        margin-bottom:clamp(3rem, 9vw, 5rem);
    }


    .chapter-story--portrait .chapter-story__media--portrait-stack .chapter-story__media-foreground {
        right:-12%;
        bottom:-2.5rem;
        width:70%;
    }

    .chapter-story__media--illustration {
        min-height:20rem;
        padding:1rem;
    }

    .chapter-story__media--illustration img {
        min-height:18rem;
    }

    .chapter-story__gallery {
        grid-template-columns:1fr;
    }

    .chapter-story__gallery figure:first-child {
        grid-column:1;
    }

    .chapter-story__gallery img,
    .chapter-story__gallery figure:first-child img {
        height:auto;
        aspect-ratio:1.32 / 1;
    }

    .chapter-story__gallery--portraits {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .chapter-story__gallery--portraits img,
    .chapter-story__gallery--portraits figure:first-child img {
        aspect-ratio:4 / 5;
    }

    .chapter-story__gallery--documents img,
    .chapter-story__gallery--documents figure:first-child img {
        aspect-ratio:3 / 4;
    }

    .chapter-story--document .chapter-story__media {
        width:min(78%, 24rem);
        margin-inline:auto;
    }
}

/* --------------- CHAPTER 6 / VARIED STORY MODULES ---------------------------------------*/

.chapter6-new-kicker {
    display:block;
    margin-bottom:.9rem;
    color:var(--color-primary);
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.chapter6-new-lead {
    color:var(--color-primary);
    font-size:clamp(1.2rem, 1.8vw, 1.65rem);
    font-weight:600;
    line-height:1.35;
}

/* 6.8 · Technologischer Wandel */

.chapter6-tech-shift {
    position:relative;
    overflow:hidden;
    padding:clamp(5.5rem, 9vw, 9rem) 0;
    background:
            linear-gradient(rgba(90, 85, 79, .045) 1px, transparent 1px),
            linear-gradient(90deg, rgba(90, 85, 79, .045) 1px, transparent 1px),
            var(--color-light);
    background-size:48px 48px, 48px 48px, auto;
}

.chapter6-tech-shift:before {
    content:'1980er/1990er';
    position:absolute;
    top:1.5rem;
    right:2vw;
    color:transparent;
    -webkit-text-stroke:1px rgba(230, 50, 30, .12);
    font-size:clamp(8rem, 20vw, 19rem);
    font-weight:700;
    line-height:.8;
    pointer-events:none;
}

.chapter6-tech-shift__header {
    position:relative;
    z-index:2;
    max-width:68rem;
}

.chapter6-tech-shift__header h2,
.chapter6-knowledge__heading h2,
.chapter6-majuba__copy h2,
.chapter6-independence__copy h2 {
    margin:0;
    font-size:clamp(2.5rem, 5vw, 5rem);
    line-height:.98;
    letter-spacing:-.045em;
}

.chapter6-knowledge__heading h3 {
    color:var(--color-white);
}

.chapter6-tech-shift__header h2 {
    max-width:60rem;
    color:var(--color-primary);
}

.chapter6-tech-shift__layout {
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    gap:clamp(2.5rem, 6vw, 7rem);
    align-items:center;
}

.chapter6-tech-shift__copy {
    grid-column:1 / span 5;
}

.chapter6-tech-shift__copy p {
    margin:0;
}

.chapter6-tech-shift__copy p + p {
    margin-top:1.2rem;
}

.chapter6-tech-shift__visuals {
    grid-column:7 / span 6;
    position:relative;
    min-height:clamp(31rem, 48vw, 43rem);
}

.chapter6-tech-shift__figure {
    position:absolute;
    margin:0;
    padding:.7rem;
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 24px 60px rgba(90, 85, 79, .18);
    transition:transform .45s ease;
}

.chapter6-tech-shift__figure:hover {
    transform:translateY(-.5rem) rotate(0);
}

.chapter6-tech-shift__figure--main {
    top:0;
    right:0;
    width:88%;
    transform:rotate(1.5deg);
}

.chapter6-tech-shift__figure--secondary {
    bottom:0;
    left:0;
    z-index:2;
    width:56%;
    transform:rotate(-2.5deg);
}

.chapter6-tech-shift__figure a {
    position:relative;
    display:block;
    overflow:hidden;
}

.chapter6-tech-shift__figure img {
    display:block;
    width:100%;
    aspect-ratio:1.45 / 1;
    object-fit:cover;
}

.chapter6-tech-shift__figure figcaption {
    padding:.75rem .25rem .1rem;
    color:var(--color-text);
    font-size:.7rem;
    font-weight:600;
}

.chapter6-tech-shift__steps {
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:1px;
    margin:clamp(4rem, 7vw, 7rem) 0 0;
    padding:0;
    list-style:none;
    background:rgba(90, 85, 79, .15);
    border:1px solid rgba(90, 85, 79, .15);
}

.chapter6-tech-shift__steps li {
    min-height:8rem;
    padding:1.5rem;
    background:rgba(255, 255, 255, .92);
}

.chapter6-tech-shift__steps span,
.chapter6-tech-shift__steps strong {
    display:block;
}

.chapter6-tech-shift__steps span {
    margin-bottom:1.5rem;
    color:var(--color-primary);
    font-size:.7rem;
    font-weight:700;
}

.chapter6-tech-shift__steps strong {
    font-size:.9rem;
    line-height:1.3;
}

/* 6.9 · Digitales Wissensarchiv */

.chapter6-knowledge {
    position:relative;
    overflow:hidden;
    padding:clamp(5.5rem, 9vw, 9rem) 0;
    color:var(--color-white);
    background:var(--color-dark);
}

.chapter6-knowledge:after {
    content:'250.000';
    position:absolute;
    right:-.02em;
    bottom:-.2em;
    color:transparent;
    -webkit-text-stroke:1px rgba(255, 255, 255, .08);
    font-size:clamp(7rem, 17vw, 17rem);
    font-weight:700;
    line-height:1;
    pointer-events:none;
}

.chapter6-knowledge__heading {
    position:relative;
    z-index:2;
    max-width:67rem;
    margin-bottom:clamp(3.5rem, 6vw, 6rem);
}

.chapter6-knowledge__heading h2 {
    color:var(--color-white);
}

.chapter6-knowledge__layout {
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0, 5fr) minmax(12rem, 2fr) minmax(15rem, 3fr);
    gap:clamp(2rem, 4vw, 5rem);
    align-items:center;
}

.chapter6-knowledge__copy p {
    margin:0;
    color:rgba(255, 255, 255, .74);
}

.chapter6-knowledge__copy p + p {
    margin-top:1.2rem;
}

.chapter6-knowledge__facts {
    border-top:1px solid rgba(255, 255, 255, .18);
}

.chapter6-knowledge__facts div {
    padding:1.25rem 0;
    border-bottom:1px solid rgba(255, 255, 255, .18);
}

.chapter6-knowledge__facts strong,
.chapter6-knowledge__facts span {
    display:block;
}

.chapter6-knowledge__facts strong {
    color:var(--color-primary);
    font-size:clamp(1.8rem, 3.4vw, 3.4rem);
    line-height:1;
    letter-spacing:-.04em;
}

.chapter6-knowledge__facts span {
    margin-top:.45rem;
    color:rgba(255, 255, 255, .58);
    font-size:.7rem;
    line-height:1.35;
}

.chapter6-knowledge__document {
    margin:0;
    padding:.7rem;
    background:#f4f0e7;
    border:1px solid rgba(255, 255, 255, .2);
    box-shadow:0 28px 65px rgba(0, 0, 0, .4);
    transform:rotate(2deg);
}

.chapter6-knowledge__document a {
    position:relative;
    display:block;
    overflow:hidden;
}

.chapter6-knowledge__document img {
    display:block;
    width:100%;
    aspect-ratio:3 / 4;
    object-fit:cover;
    object-position:top;
}

.chapter6-knowledge__document figcaption {
    display:flex;
    flex-direction:column;
    gap:.2rem;
    padding:.8rem .25rem .15rem;
    color:var(--color-text);
}

.chapter6-knowledge__document figcaption span {
    color:var(--color-primary);
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.chapter6-knowledge__document figcaption strong {
    font-size:.72rem;
}

/* 6.10 · Majuba */

.chapter6-majuba {
    position:relative;
    isolation:isolate;
    min-height:clamp(48rem, 72vw, 64rem);
    overflow:hidden;
    color:var(--color-white);
    background:var(--color-dark);
}

.chapter6-majuba__media,
.chapter6-majuba__overlay {
    position:absolute;
    inset:0;
    margin:0;
}

.chapter6-majuba__media img {
    width:100%;
    height:100%;
    object-fit:cover;
    filter:grayscale(1) contrast(1.08);
}

.chapter6-majuba__media figcaption {
    position:absolute;
    right:2rem;
    bottom:1.5rem;
    z-index:3;
    color:rgba(255, 255, 255, .62);
    font-size:.68rem;
}

.chapter6-majuba__overlay {
    z-index:1;
    background:
            linear-gradient(90deg, rgba(15, 18, 19, .95) 0%, rgba(15, 18, 19, .82) 48%, rgba(15, 18, 19, .15) 100%),
            linear-gradient(0deg, rgba(15, 18, 19, .42), transparent 45%);
}

.chapter6-majuba__inner {
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    min-height:inherit;
    padding-top:clamp(5rem, 8vw, 8rem);
    padding-bottom:clamp(5rem, 8vw, 8rem);
}

.chapter6-majuba__copy {
    max-width:49rem;
}

.chapter6-majuba__copy h2 {
    max-width:46rem;
    margin-bottom:2rem;
    color:var(--color-white);
}

.chapter6-majuba__copy h3 {
    color:var(--color-white);
}

.chapter6-majuba__copy p {
    max-width:43rem;
    margin:0;
    color:rgba(255, 255, 255, .78);
}

.chapter6-majuba__copy p + p {
    margin-top:1.2rem;
}

.chapter6-majuba__fact {
    display:inline-flex;
    align-items:center;
    gap:1rem;
    margin-top:2.25rem;
    padding:1rem 1.25rem;
    background:rgba(230, 50, 30, .88);
    backdrop-filter:blur(8px);
}

.chapter6-majuba__fact strong {
    font-size:2rem;
    line-height:1;
}

.chapter6-majuba__fact span {
    max-width:9rem;
    font-size:.68rem;
    line-height:1.3;
}

/* 6.11 · Strategische Eigenständigkeit */

.chapter6-independence {
    position:relative;
    overflow:hidden;
    padding:clamp(5.5rem, 9vw, 9rem) 0;
    background:
            linear-gradient(rgba(90, 85, 79, .04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(90, 85, 79, .04) 1px, transparent 1px),
            var(--color-white);
    background-size:48px 48px, 48px 48px, auto;
}

.chapter6-independence__layout {
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    gap:clamp(2.5rem, 6vw, 7rem);
    align-items:center;
}

.chapter6-independence__archive {
    grid-column:1 / span 5;
    position:relative;
    min-height:clamp(34rem, 47vw, 44rem);
}

.chapter6-independence__document {
    position:absolute;
    margin:0;
    padding:.65rem;
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 24px 58px rgba(90, 85, 79, .2);
    transition:transform .45s ease;
}

.chapter6-independence__document--back {
    top:0;
    right:0;
    width:66%;
    transform:rotate(5deg);
}

.chapter6-independence__document--front {
    bottom:0;
    left:0;
    z-index:2;
    width:72%;
    transform:rotate(-3deg);
}

.chapter6-independence__document:hover {
    z-index:3;
    transform:translateY(-.5rem) rotate(0);
}

.chapter6-independence__document a {
    position:relative;
    display:block;
    overflow:hidden;
}

.chapter6-independence__document img {
    display:block;
    width:100%;
    aspect-ratio:3 / 4;
    object-fit:cover;
    object-position:top;
}

.chapter6-independence__document figcaption {
    display:flex;
    flex-direction:column;
    gap:.2rem;
    padding:.75rem .25rem .1rem;
    color:var(--color-text);
}

.chapter6-independence__document figcaption span {
    color:var(--color-primary);
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.chapter6-independence__document figcaption strong {
    font-size:.72rem;
    line-height:1.3;
}

.chapter6-independence__copy {
    grid-column:7 / span 6;
}

.chapter6-independence__copy h2 {
    margin-bottom:2rem;
    color:var(--color-primary);
}

.chapter6-independence__copy p {
    margin:0;
}

.chapter6-independence__copy p + p {
    margin-top:1.2rem;
}

.chapter6-independence__route {
    display:grid;
    grid-template-columns:auto minmax(1.5rem, 1fr) auto minmax(1.5rem, 1fr) auto;
    gap:.75rem;
    align-items:center;
    margin-top:2.25rem;
    padding-top:1.25rem;
    border-top:1px solid rgba(90, 85, 79, .18);
    color:var(--color-primary);
    font-size:.64rem;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.chapter6-independence__route-line {
    display:block;
    height:1px;
    background:rgba(230, 50, 30, .45);
}

@media (max-width:1000px) {

    .chapter6-tech-shift__copy {
        grid-column:1 / span 6;
    }

    .chapter6-tech-shift__visuals {
        grid-column:7 / span 6;
    }

    .chapter6-knowledge__layout {
        grid-template-columns:minmax(0, 2fr) minmax(12rem, 1fr);
    }

    .chapter6-knowledge__document {
        grid-column:2;
        width:min(100%, 22rem);
        justify-self:center;
    }

    .chapter6-independence__archive {
        grid-column:1 / span 6;
    }

    .chapter6-independence__copy {
        grid-column:7 / span 6;
    }
}

@media (max-width:760px) {

    .chapter6-tech-shift__layout,
    .chapter6-independence__layout {
        display:block;
    }

    .chapter6-tech-shift__visuals,
    .chapter6-independence__archive {
        margin-top:3.5rem;
    }

    .chapter6-tech-shift__steps {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .chapter6-knowledge__layout {
        grid-template-columns:1fr;
    }

    .chapter6-knowledge__document {
        grid-column:auto;
        width:min(78%, 22rem);
        margin-top:1rem;
        justify-self:start;
    }

    .chapter6-majuba__overlay {
        background:rgba(15, 18, 19, .86);
    }

    .chapter6-majuba__copy {
        max-width:100%;
    }
}

@media (max-width:500px) {

    .chapter6-tech-shift__header h2,
    .chapter6-knowledge__heading h2,
    .chapter6-majuba__copy h2,
    .chapter6-independence__copy h2 {
        font-size:2.55rem;
    }

    .chapter6-tech-shift__visuals {
        min-height:25rem;
    }

    .chapter6-tech-shift__steps {
        grid-template-columns:1fr;
    }

    .chapter6-tech-shift__steps li {
        min-height:0;
    }

    .chapter6-independence__archive {
        min-height:29rem;
    }

    .chapter6-independence__route {
        grid-template-columns:1fr;
        gap:.55rem;
    }

    .chapter6-independence__route-line {
        width:1px;
        height:1.25rem;
        margin-left:.15rem;
    }
}

.chapter6-section-kicker {
    display:block;
    margin-bottom:.85rem;
    color:var(--color-primary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

/* 6.4 · Kraftwerks-Panorama */
.chapter6-energy .energy-chain-heading {
    margin-bottom:clamp(3.5rem, 6vw, 6rem);
}

.chapter6-energy__decade {
    justify-self:end;
    color:transparent;
    -webkit-text-stroke:1px rgba(230, 50, 30, .35);
    font-size:clamp(4rem, 9vw, 8.5rem);
    font-weight:700;
    line-height:.8;
    letter-spacing:-.065em;
    white-space:nowrap;
}

.chapter6-energy__hero figcaption {
    max-width:40rem;
}

.chapter6-energy__hero figcaption p {
    margin-top:0;
}

/* 6.5 · Jubiläumszahl */
.chapter6-jubilee__press {
    margin:clamp(2rem, 4vw, 3.5rem) 0 0;
    padding:clamp(.4rem, .8vw, .65rem);
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 18px 45px rgba(90, 85, 79, .18);
    transform:rotate(-2deg);
}

.chapter6-jubilee__press a {
    display:block;
    overflow:hidden;
}

.chapter6-jubilee__press img {
    display:block;
    width:100%;
    height:auto;
}

.chapter6-jubilee__press figcaption {
    padding:.65rem .2rem .1rem;
    color:var(--color-primary);
    font-size:.72rem;
    font-weight:600;
}

.chapter6-anniversary {
    position:relative;
    overflow:hidden;
}

.chapter6-anniversary .number {
    top:-2rem;
    left:7%;
    color:rgba(255, 255, 255, .9);
    font-size:clamp(15rem, 27vw, 27.5rem);
    line-height:.8;
}

.chapter6-anniversary .grid {
    position:relative;
    z-index:2;
}

.chapter6-anniversary__image {
    position:relative;
    z-index:3;
    margin:0;
    padding:.75rem;
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 25px 65px rgba(90, 85, 79, .18);
    transform:rotate(-1.25deg);
}

.chapter6-anniversary__image a {
    display:block;
    overflow:hidden;
}

.chapter6-anniversary__image img {
    width:100%;
    aspect-ratio:1.52 / 1;
    object-fit:cover;
}

.chapter6-anniversary__image figcaption {
    padding:.75rem .2rem .1rem;
    color:var(--color-primary);
    font-size:.7rem;
}

.chapter6-anniversary .highlight-number-content {
    padding:clamp(1rem, 2vw, 2rem) 0;
}

/* 6.6 · Freigestelltes Museumsobjekt */
.chapter6-museum {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(5rem, 9vw, 9rem) 0;
    background:linear-gradient(90deg, var(--color-primary) 0 42%, var(--color-light) 42% 100%);
}

.chapter6-museum__layout {
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter6-museum__object {
    grid-column:1 / span 5;
    position:relative;
    display:flex;
    min-height:clamp(31rem, 42vw, 42rem);
    margin:0;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

.chapter6-museum__object::after {
    content:'';
    position:absolute;
    right:5%;
    bottom:4rem;
    left:5%;
    height:2rem;
    background:rgba(82, 8, 0, .24);
    border-radius:50%;
    filter:blur(14px);
}

.chapter6-museum__year {
    position:absolute;
    top:0;
    left:-.08em;
    color:transparent;
    -webkit-text-stroke:1px rgba(255, 255, 255, .4);
    font-size:clamp(5rem, 10vw, 10rem);
    font-weight:700;
    line-height:1;
    letter-spacing:-.06em;
}

.chapter6-museum__object img {
    position:relative;
    z-index:2;
    width:min(88%, 28rem);
    max-height:36rem;
    object-fit:contain;
    filter:drop-shadow(0 24px 18px rgba(73, 11, 5, .28));
}

.chapter6-museum__object figcaption {
    position:relative;
    z-index:2;
    align-self:flex-start;
    margin-top:1.25rem;
    color:rgba(255, 255, 255, .8);
    font-size:.7rem;
}

.chapter6-museum__copy {
    grid-column:7 / span 5;
    max-width:39rem;
}

.chapter6-museum__copy h3 {
    margin:0 0 1.4rem;
    color:var(--color-primary);
    font-size:clamp(2.4rem, 4.7vw, 4.75rem);
    line-height:.98;
    letter-spacing:-.045em;
}

.chapter6-museum__copy p {
    margin:0;
}

.chapter6-museum__label {
    display:flex;
    gap:1rem;
    align-items:center;
    margin-top:2.5rem;
    padding-top:1.25rem;
    border-top:1px solid rgba(90, 85, 79, .18);
}

.chapter6-museum__label span {
    padding:.45rem .65rem;
    color:var(--color-white);
    background:var(--color-primary);
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.chapter6-museum__label strong {
    color:var(--color-primary);
    font-size:.82rem;
}

/* 6.7 · Bildstrecke */
.chapter6-team .grid {
    gap:clamp(2.5rem, 6vw, 7rem);
}

.chapter6-team__slide {
    padding:1rem;
}

.chapter6-team__slide .imgwrap {
    padding:.7rem;
}

.chapter6-team__slide:nth-child(odd) .imgwrap {
    transform:rotate(-1.2deg);
}

.chapter6-team__slide:nth-child(even) .imgwrap {
    transform:rotate(1.2deg);
}

.chapter6-team__slide img {
    width:100%;
    object-fit:cover;
}

.chapter6-team__slide small {
    display:block;
    padding:.8rem 1rem 0;
    color:var(--color-primary);
    font-size:.68rem;
}

/* 6.8 · Zeitenwende als bildfüllende Bühne */
.chapter6-east {
    position:relative;
    isolation:isolate;
    min-height:clamp(42rem, 72vw, 58rem);
    overflow:hidden;
    background:var(--color-dark);
}

.chapter6-east__media {
    position:absolute;
    inset:0;
    z-index:-1;
    margin:0;
}

.chapter6-east__media::after {
    content:'';
    position:absolute;
    inset:0;
    background:
            linear-gradient(90deg, rgba(0, 2, 7, .9) 0%, rgba(0, 2, 7, .58) 50%, rgba(0, 2, 7, .1) 100%),
            linear-gradient(0deg, rgba(0, 2, 7, .6), transparent 50%);
}

.chapter6-east__media img {
    width:100%;
    height:100%;
    object-fit:cover;
    filter:grayscale(1) contrast(1.06);
}

.chapter6-east__media figcaption {
    position:absolute;
    right:clamp(1rem, 3vw, 3rem);
    bottom:1.5rem;
    z-index:2;
    color:rgba(255, 255, 255, .7);
    font-size:.68rem;
}

.chapter6-east__inner {
    display:flex;
    min-height:inherit;
    align-items:center;
}

.chapter6-east__copy {
    width:min(100%, 42rem);
    padding:clamp(2rem, 4vw, 4rem);
    color:var(--color-white);
    background:rgba(0, 2, 7, .66);
    border-left:4px solid var(--color-primary);
    backdrop-filter:blur(5px);
}

.chapter6-east__copy .chapter6-section-kicker,
.chapter6-east__copy h3 {
    color:var(--color-white);
}

.chapter6-east__copy h3 {
    margin:0 0 1.5rem;
    font-size:clamp(2rem, 4vw, 4rem);
    line-height:.96;
    letter-spacing:-.045em;
}

.chapter6-east__copy p {
    margin:0;
    line-height:1.7;
}

.chapter6-east__copy ul {
    display:grid;
    gap:.7rem;
    margin:2rem 0 0;
    padding:0;
    list-style:none;
}

.chapter6-east__copy li {
    position:relative;
    padding-left:2rem;
    line-height:1.45;
}

.chapter6-east__copy li::before {
    content:'';
    position:absolute;
    top:.05em;
    left:0;
    width:1.3rem;
    aspect-ratio:1;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e6321e' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V11l5 3V10l5 3V6h4v15M16 6h3M7 11V5h2v8'/%3E%3Cpath d='M7.5 17h1m3.5 0h1m3.5 0h1'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* 6.9 · Porträt-Ensemble */
.chapter6-continuity.story-duo--image-left .story-duo__copy {
    grid-column:9 / span 4;
    grid-row:1;
    align-self:center;
}

.chapter6-continuity.story-duo--image-left .story-duo__media {
    grid-column:1 / span 8;
    grid-row:1;
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, .7fr);
    grid-template-rows:repeat(2, minmax(0, 1fr));
    gap:clamp(.45rem, .7vw, .75rem);
    min-height:0;
    padding:clamp(.5rem, 1vw, 1rem);
    aspect-ratio:1.45 / 1;
}

.chapter6-continuity__portrait.story-duo__figure--main,
.chapter6-continuity__portrait.story-duo__figure--secondary,
.chapter6-continuity__portrait.story-duo__figure--tertiary {
    position:relative;
    inset:auto;
    width:auto;
    height:100%;
    transition:transform .45s ease, box-shadow .45s ease;
}

.chapter6-continuity__portrait.story-duo__figure--main {
    grid-column:1;
    grid-row:1 / 3;
    z-index:1;
    transform:translate(.25rem, .45rem) rotate(-1.25deg);
}

.chapter6-continuity__portrait.story-duo__figure--secondary {
    grid-column:2;
    grid-row:1;
    z-index:3;
    transform:translate(-2rem, .55rem) rotate(1.75deg);
}

.chapter6-continuity__portrait.story-duo__figure--tertiary {
    grid-column:2;
    grid-row:2;
    z-index:2;
    transform:translate(-1.65rem, -1rem) rotate(-1.5deg);
}

.chapter6-continuity .chapter6-continuity__portrait:hover {
    z-index:4;
    transform:translateY(-.35rem) rotate(0);
}

.chapter6-continuity__portrait.story-duo__figure a,
.chapter6-continuity__portrait.story-duo__figure img {
    width:100%;
    height:100%;
}

.chapter6-continuity__portrait.story-duo__figure img {
    aspect-ratio:auto;
    object-fit:cover;
}

.chapter6-continuity__portrait.story-duo__figure--secondary img {
    object-position:center 18%;
}

@media (max-width:900px) {
    .chapter6-continuity.story-duo--image-left .story-duo__copy,
    .chapter6-continuity.story-duo--image-left .story-duo__media {
        grid-column:1 / span 6;
        grid-row:auto;
    }
}

/* 6.10 · Internationales Archiv */
.chapter6-world .japan__year {
    top:.05em;
    font-size:clamp(4.2rem, 8vw, 7.5rem);
    letter-spacing:-.04em;
}

/* 6.11 · Forschungsabschluss */
.chapter6-future__heading {
    display:grid;
    grid-template-columns:minmax(0, .9fr) minmax(22rem, 1.1fr);
    gap:clamp(2.5rem, 7vw, 8rem);
    align-items:end;
    max-width:none;
}

.chapter6-future__lead {
    max-width:37rem;
    margin:1.5rem 0 0;
    font-size:clamp(1rem, 1.15vw, 1.1rem);
    line-height:1.7;
}

.chapter6-future__visual {
    margin:0;
    padding:.65rem;
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 22px 60px rgba(90, 85, 79, .16);
    transform:rotate(1deg);
}

.chapter6-future__visual a {
    display:block;
    overflow:hidden;
}

.chapter6-future__visual img {
    width:100%;
    aspect-ratio:1.65 / 1;
    object-fit:cover;
}

.chapter6-future__visual figcaption {
    padding:.75rem .2rem .1rem;
    color:var(--color-primary);
    font-size:.68rem;
}

.chapter6-future .content-block {
    min-height:18rem;
}

@media (max-width:900px) {
    .chapter6-energy__decade {
        justify-self:start;
    }

    .chapter6-anniversary .grid {
        gap:3rem;
    }

    .chapter6-anniversary__image,
    .chapter6-anniversary .highlight-number-content {
        grid-column:1 / span 6;
    }

    .chapter6-anniversary .highlight-number-content {
        max-width:40rem;
    }

    .chapter6-museum {
        background:linear-gradient(180deg, var(--color-primary) 0 48%, var(--color-light) 48% 100%);
    }

    .chapter6-museum__layout {
        grid-template-columns:repeat(6, minmax(0, 1fr));
    }

    .chapter6-museum__object,
    .chapter6-museum__copy {
        grid-column:1 / span 6;
    }

    .chapter6-museum__object {
        width:min(100%, 38rem);
        margin-inline:auto;
    }

    .chapter6-museum__copy {
        max-width:43rem;
        padding-top:2rem;
    }

    .chapter6-team .col-4,
    .chapter6-team .col-8 {
        grid-column:1 / span 6;
    }

    .chapter6-team .col-4 {
        max-width:42rem;
    }

    .chapter6-future__heading {
        grid-template-columns:1fr;
    }
}

@media (max-width:600px) {
    .chapter6-energy__decade {
        font-size:3.75rem;
    }

    .chapter6-anniversary .grid {
        padding-top:10rem;
    }

    .chapter6-anniversary .number {
        top:1rem;
        left:1rem;
        font-size:13rem;
    }

    .chapter6-anniversary__image {
        transform:none;
    }

    .chapter6-museum {
        padding:4.5rem 0 5rem;
        background:linear-gradient(180deg, var(--color-primary) 0 45%, var(--color-light) 45% 100%);
    }

    .chapter6-museum__object {
        min-height:27rem;
    }

    .chapter6-museum__copy h3 {
        font-size:2.7rem;
    }

    .chapter6-team__slide {
        padding:.5rem;
    }

    .chapter6-team__slide img {
        aspect-ratio:1.15 / 1;
    }

    .chapter6-east {
        min-height:48rem;
    }

    .chapter6-east__media::after {
        background:linear-gradient(0deg, rgba(0, 2, 7, .95) 0%, rgba(0, 2, 7, .55) 65%, rgba(0, 2, 7, .18) 100%);
    }

    .chapter6-east__inner {
        align-items:flex-end;
        padding-bottom:4rem;
    }

    .chapter6-east__copy {
        padding:1.6rem;
    }

    .chapter6-east__copy h3 {
        font-size:2.65rem;
    }

    .chapter6-continuity.story-duo--image-left .story-duo__media {
        grid-template-columns:repeat(2, minmax(0, 1fr));
        grid-template-rows:auto;
        gap:1rem;
        min-height:0;
        padding:0;
        aspect-ratio:auto;
    }

    .chapter6-continuity__portrait.story-duo__figure--main,
    .chapter6-continuity__portrait.story-duo__figure--secondary,
    .chapter6-continuity__portrait.story-duo__figure--tertiary {
        position:relative;
        inset:auto;
        width:auto;
        height:auto;
        transform:none;
    }

    .chapter6-continuity__portrait.story-duo__figure--main {
        grid-column:1 / -1;
        grid-row:auto;
    }

    .chapter6-continuity__portrait.story-duo__figure--secondary {
        grid-column:1;
        grid-row:auto;
    }

    .chapter6-continuity__portrait.story-duo__figure--tertiary {
        grid-column:2;
        grid-row:auto;
    }

    .chapter6-continuity__portrait.story-duo__figure a,
    .chapter6-continuity__portrait.story-duo__figure img {
        height:auto;
    }

    .chapter6-continuity__portrait.story-duo__figure--main img {
        aspect-ratio:1;
    }

    .chapter6-continuity__portrait.story-duo__figure--secondary img,
    .chapter6-continuity__portrait.story-duo__figure--tertiary img {
        aspect-ratio:4 / 5;
    }

    .chapter6-continuity .chapter6-continuity__portrait:hover {
        transform:translateY(-.25rem);
    }

    .chapter6-world .japan__year {
        font-size:3.5rem;
    }

    .chapter6-future__heading {
        display:block;
    }

    .chapter6-future__visual {
        margin-top:2.5rem;
        transform:none;
    }
}
/* --------------- CHAPTER 7 / GLOBALISIERUNG UND ENERGIEWENDE --------------------------*/

.image-credit-host--relative {
    position:relative;
}

.image-credit {
    position:absolute;
    z-index:20;
    box-sizing:border-box;
    display:block;
    overflow:hidden;
    padding:.2rem .38rem;
    color:rgba(255, 255, 255, .92);
    background:rgba(0, 0, 0, .58);
    border-radius:1px;
    font-size:.52rem;
    font-weight:500;
    line-height:1.25;
    letter-spacing:.015em;
    overflow-wrap:anywhere;
    white-space:normal;
    pointer-events:none;
}

.lightbox-image-credit {
    display:block;
    color:rgba(255, 255, 255, .78);
    font-size:.7rem;
    font-weight:500;
    line-height:1.45;
}

.gslide-description .lightbox-image-credit {
    color:var(--color-text);
}

.chapter7-story {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(5.5rem, 9vw, 9rem) 0;
}

.chapter7-story__heading {
    display:block;
    max-width:52rem;
    margin-bottom:clamp(3rem, 6vw, 5.5rem);
}

.chapter7-story__kicker {
    display:block;
    margin-bottom:.8rem;
    color:var(--color-primary);
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.chapter7-story h2 {
    max-width:100%;
    margin:0;
    color:var(--color-primary);
    font-size:clamp(2.25rem, 4vw, 4.1rem);
    line-height:1;
    letter-spacing:-.045em;
    overflow-wrap:break-word;
    hyphens:auto;
}

.chapter7-story__copy {
    position:relative;
    z-index:2;
    min-width:0;
}

.chapter7-story__copy > p {
    margin:0;
    line-height:1.75;
    margin-bottom:1rem;
}

.chapter7-paper {
    position:relative;
    z-index:2;
    margin:0;
    padding:clamp(.5rem, .9vw, .8rem);
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 24px 65px rgba(55, 50, 45, .18);
}

.chapter7-paper a {
    display:block;
    overflow:hidden;
}

.chapter7-paper img {
    display:block;
    width:100%;
    height:auto;
}

.chapter7-paper figcaption {
    display:flex;
    flex-wrap:wrap;
    gap:.25rem .65rem;
    align-items:baseline;
    padding:.8rem .25rem .1rem;
    color:var(--color-text);
    font-size:.7rem;
    line-height:1.4;
}

.chapter7-paper figcaption span {
    color:var(--color-primary);
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.chapter7-crisis {
    background:
            linear-gradient(rgba(90, 85, 79, .04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(90, 85, 79, .04) 1px, transparent 1px),
            var(--color-light);
    background-size:48px 48px, 48px 48px, auto;
}

.chapter7-crisis__layout {
    display:grid;
    grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter7-crisis__slider {
    min-width:0;
}

.chapter7-crisis__slider .slider-navigation {
    justify-content:center;
}

.chapter7-crisis__paper {
    transform:rotate(1.2deg);
}

.chapter7-crisis__facts {
    display:flex;
    gap:clamp(1rem, 2.5vw, 2rem);
    align-items:center;
    margin-top:2.5rem;
    padding-top:1.5rem;
    border-top:1px solid rgba(90, 85, 79, .2);
}

.chapter7-crisis__facts div {
    display:flex;
    flex-direction:column;
}

.chapter7-crisis__facts strong {
    color:var(--color-primary);
    font-size:clamp(2.4rem, 4vw, 4rem);
    line-height:.9;
}

.chapter7-crisis__facts span:not(.chapter7-crisis__arrow) {
    margin-top:.45rem;
    font-size:.65rem;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.chapter7-crisis__arrow {
    color:rgba(90, 85, 79, .45);
    font-size:1.6rem;
}

.chapter7-centenary {
    color:var(--color-white);
    background:var(--color-primary);
}

.chapter7-centenary__100 {
    position:absolute;
    top:clamp(2rem, 5vw, 5rem);
    right:-.04em;
    z-index:-1;
    color:transparent;
    -webkit-text-stroke:1px rgba(255, 255, 255, .17);
    font-size:clamp(14rem, 34vw, 34rem);
    font-weight:700;
    line-height:.72;
    letter-spacing:-.1em;
    pointer-events:none;
}

.chapter7-centenary .chapter7-story__kicker,
.chapter7-centenary h2 {
    color:var(--color-white);
}

.chapter7-centenary__inner {
    position:relative;
    z-index:2;
}

.chapter7-centenary__layout {
    display:grid;
    grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter7-centenary__paper {
    transform:rotate(-1deg);
}

.chapter7-centenary__documents {
    display:grid;
    min-width:0;
    gap:clamp(1rem, 2vw, 1.5rem);
}

.chapter7-centenary__programs {
    display:flex;
    width:100%;
    justify-self:center;
    align-items:center;
    justify-content:center;
    padding-top:.5rem;
}

.chapter7-centenary__programs .chapter7-centenary__paper {
    flex:0 0 35%;
    min-width:0;
    transition:transform .35s ease, box-shadow .35s ease;
}

.chapter7-centenary__programs .chapter7-centenary__paper + .chapter7-centenary__paper {
    margin-left:-13%;
}

.chapter7-centenary__programs .chapter7-centenary__paper:first-child {
    z-index:1;
    transform:translateY(.5rem) rotate(2.4deg);
}

.chapter7-centenary__programs .chapter7-centenary__paper:nth-child(2) {
    z-index:2;
    transform:translateY(-.25rem) rotate(-2deg);
}

.chapter7-centenary__programs .chapter7-centenary__paper:nth-child(3) {
    z-index:3;
    transform:translateY(.35rem) rotate(1.5deg);
}

.chapter7-centenary__programs .chapter7-centenary__paper:last-child {
    z-index:4;
    transform:translateY(-.4rem) rotate(-1.5deg);
}

.chapter7-centenary__programs .chapter7-centenary__paper:hover,
.chapter7-centenary__programs .chapter7-centenary__paper:focus-within {
    z-index:10;
    box-shadow:0 32px 75px rgba(0, 0, 0, .32);
    transform:translateY(-.75rem) rotate(0) scale(1.08);
}

.chapter7-centenary__programs img {
    display:block;
    width:100%;
    aspect-ratio:4 / 3;
    object-fit:contain;
}

.chapter7-centenary__award {
    display:flex;
    gap:1rem;
    align-items:center;
    margin-top:2.25rem;
    padding:1.1rem 1.25rem;
    color:var(--color-text);
    background:rgba(255, 255, 255, .94);
    border-left:3px solid #a96635;
    box-shadow:0 16px 40px rgba(0, 0, 0, .18);
}

.chapter7-centenary__medal {
    display:grid;
    flex:0 0 3.25rem;
    width:3.25rem;
    aspect-ratio:1;
    place-items:center;
    color:#f8e3ca;
    background:linear-gradient(135deg, #d19a66, #77401f);
    border:2px solid rgba(255, 255, 255, .55);
    border-radius:50%;
    box-shadow:0 0 0 3px rgba(128, 73, 37, .24);
    font-family:serif;
    font-size:1.45rem;
    font-weight:700;
}

.chapter7-centenary__award div {
    display:flex;
    flex-direction:column;
    gap:.2rem;
}

.chapter7-centenary__award strong {
    color:var(--color-primary);
    font-size:.9rem;
}

.chapter7-centenary__award div span {
    font-size:.68rem;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.chapter7-centenary__gallery {
    margin-top:clamp(4.5rem, 8vw, 8rem);
    padding-top:clamp(2.5rem, 5vw, 4.5rem);
    border-top:1px solid rgba(255, 255, 255, .28);
}

.chapter7-centenary__gallery-heading {
    margin-bottom:2rem;
}

.chapter7-centenary__gallery-heading span {
    display:block;
    margin-bottom:.45rem;
    color:rgba(255, 255, 255, .72);
    font-size:.65rem;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
}

.chapter7-centenary__gallery-heading h3 {
    margin:0;
    color:var(--color-white);
    font-size:clamp(2rem, 3.6vw, 3.5rem);
    line-height:1;
    letter-spacing:-.04em;
}

.chapter7-centenary__slider {
    overflow:hidden;
}

.chapter7-centenary__slide {
    padding:clamp(.25rem, 1vw, .75rem);
}

.chapter7-centenary__slide > a {
    height:auto;
    padding:0;
    background:transparent;
    box-shadow:none;
}

.chapter7-centenary__slide img {
    width:100%;
    height:clamp(22rem, 54vw, 42rem);
    object-fit:contain;
    background:transparent;
}

.chapter7-centenary__slide small {
    display:block;
    padding:.8rem .7rem 0;
    color:rgba(255, 255, 255, .85);
    font-size:.72rem;
    line-height:1.4;
}

.chapter7-centenary__gallery .slider-navigation {
    margin-top:1.5rem;
}

.chapter7-centenary__gallery .slider-prev,
.chapter7-centenary__gallery .slider-next {
    color:var(--color-primary) !important;
    background:var(--color-white) !important;
}

.chapter7-expansion {
    background:var(--color-white);
}

.chapter7-expansion::before {
    content:'';
    position:absolute;
    top:0;
    right:0;
    z-index:-1;
    width:38%;
    height:100%;
    background:var(--color-primary-light);
}

.chapter7-expansion__layout {
    display:grid;
    grid-template-columns:minmax(0, 6.5fr) minmax(20rem, 5.5fr);
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter7-expansion__heading {
    display:block;
    max-width:42rem;
    margin-bottom:2.5rem;
}

.chapter7-expansion__paper {
    width:min(100%, 34rem);
    justify-self:end;
    transform:rotate(1.25deg);
}

.chapter7-expansion__markets {
    display:flex;
    flex-wrap:wrap;
    gap:.55rem;
    margin-top:2.25rem;
}

.chapter7-expansion__markets span {
    padding:.55rem .8rem;
    color:var(--color-primary);
    background:var(--color-primary-light);
    border:1px solid rgba(230, 50, 30, .16);
    font-size:.63rem;
    font-weight:700;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.chapter7-growth {
    background:
            linear-gradient(rgba(90, 85, 79, .045) 1px, transparent 1px),
            linear-gradient(90deg, rgba(90, 85, 79, .045) 1px, transparent 1px),
            var(--color-light);
    background-size:52px 52px, 52px 52px, auto;
}

.chapter7-growth__layout {
    display:grid;
    grid-template-columns:minmax(0, 7fr) minmax(19rem, 5fr);
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter7-growth .chapter7-story__copy h2,
.chapter7-modernization .chapter7-story__copy h2,
.chapter7-quality .chapter7-story__copy h2,
.chapter7-handover .chapter7-story__copy h2 {
    margin-bottom:2rem;
}

.chapter7-growth__paper {
    width:min(100%, 34rem);
    justify-self:end;
    transform:rotate(1deg);
}

.chapter7-research {
    color:var(--color-white);
    background:#202426;
}

.chapter7-research::after {
    content:'';
    position:absolute;
    top:-18rem;
    right:-15rem;
    z-index:-1;
    width:45rem;
    aspect-ratio:1;
    border:1px solid rgba(255, 255, 255, .08);
    border-radius:50%;
    box-shadow:0 0 0 7rem rgba(255, 255, 255, .018), 0 0 0 14rem rgba(255, 255, 255, .012);
}

.chapter7-research__intro,
.chapter7-outlook__intro {
    display:grid;
    grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);
    gap:clamp(3rem, 7vw, 8rem);
}

.chapter7-research .chapter7-story__heading,
.chapter7-outlook .chapter7-story__heading {
    margin:0;
}

.chapter7-research .chapter7-story__kicker,
.chapter7-research h2 {
    color:var(--color-white);
}

.chapter7-research__copy,
.chapter7-outlook__copy {
    display:grid;
    gap:1.35rem;
    align-content:start;
}

.chapter7-research__copy p,
.chapter7-outlook__copy p {
    margin:0;
    line-height:1.75;
}

.chapter7-research__gallery {
    margin-top:clamp(4rem, 8vw, 7rem);
    padding-top:clamp(2.5rem, 5vw, 4rem);
    border-top:1px solid rgba(255, 255, 255, .18);
}

.chapter7-research__slider {
    overflow:hidden;
}

.chapter7-research__slide {
    padding:clamp(.2rem, .8vw, .65rem);
}

.chapter7-research__slide > a {
    display:flex;
    overflow:hidden;
    height:clamp(22rem, 52vw, 43rem);
    align-items:center;
    justify-content:center;
    background:#f5f5f3;
    box-shadow:0 26px 65px rgba(0, 0, 0, .28);
}

.chapter7-research__slide img {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}

.chapter7-research__gallery .slider-navigation {
    margin-top:1.5rem;
}

.chapter7-research__gallery .slider-prev,
.chapter7-research__gallery .slider-next {
    color:#202426 !important;
    background:var(--color-white) !important;
}

.chapter7-modernization {
    background:var(--color-white);
}

.chapter7-modernization__layout {
    display:grid;
    grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter7-modernization__gallery {
    display:grid;
    gap:clamp(1.25rem, 2.5vw, 2rem);
}

.chapter7-modernization__gallery figure {
    margin:0;
    padding:clamp(.4rem, .7vw, .65rem);
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .13);
    box-shadow:0 22px 55px rgba(55, 50, 45, .15);
}

.chapter7-modernization__gallery figure:first-child {
    width:88%;
    transform:rotate(-1deg);
}

.chapter7-modernization__gallery figure:last-child {
    width:88%;
    justify-self:end;
    transform:rotate(1deg);
}

.chapter7-modernization__gallery a,
.chapter7-modernization__gallery img {
    display:block;
    width:100%;
}

.chapter7-modernization__gallery img {
    aspect-ratio:16 / 9;
    object-fit:contain;
    background:#f4f4f2;
}

.chapter7-pandemic {
    min-height:clamp(46rem, 68vw, 62rem);
    display:flex;
    align-items:center;
    color:var(--color-white);
    background:#15191b;
}

.chapter7-pandemic__image,
.chapter7-pandemic__image::after {
    position:absolute;
    inset:0;
}

.chapter7-pandemic__image::after {
    content:'';
    background:linear-gradient(90deg, rgba(14, 17, 18, .96) 0%, rgba(14, 17, 18, .78) 48%, rgba(14, 17, 18, .25) 100%);
}

.chapter7-pandemic__image img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.chapter7-pandemic__inner {
    position:relative;
    z-index:2;
}

.chapter7-pandemic__card {
    max-width:42rem;
    padding:clamp(2.25rem, 5vw, 4.5rem);
    background:rgba(25, 29, 30, .82);
    border-left:3px solid var(--color-primary);
    box-shadow:0 30px 80px rgba(0, 0, 0, .28);
    backdrop-filter:blur(8px);
}

.chapter7-pandemic .chapter7-story__kicker,
.chapter7-pandemic h2 {
    color:var(--color-white);
}

.chapter7-pandemic h2 {
    margin-bottom:2rem;
}

.chapter7-pandemic__card > p {
    margin:0;
    font-size:clamp(1rem, 1.15vw, 1.1rem);
    line-height:1.75;
}

.chapter7-pandemic__zoom {
    display:grid;
    grid-template-columns:1fr 8rem;
    gap:1rem;
    align-items:center;
    margin-top:2rem;
    padding:.65rem;
    color:var(--color-white);
    background:rgba(255, 255, 255, .1);
    border:1px solid rgba(255, 255, 255, .18);
}

.chapter7-pandemic__zoom > span {
    padding-left:.6rem;
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.chapter7-pandemic__zoom img {
    display:block;
    width:8rem;
    height:4.5rem;
    object-fit:cover;
}

.chapter7-quality {
    background:var(--color-light);
}

.chapter7-quality__layout {
    display:grid;
    grid-template-columns:minmax(0, 7fr) minmax(0, 5fr);
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter7-quality__visual {
    margin:0;
    padding:clamp(.5rem, .9vw, .85rem);
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    box-shadow:0 25px 65px rgba(55, 50, 45, .16);
    transform:rotate(-.8deg);
}

.chapter7-quality__visual a,
.chapter7-quality__visual img {
    display:block;
    width:100%;
}

.chapter7-quality__visual img {
    aspect-ratio:16 / 9;
    object-fit:contain;
}

.chapter7-handover {
    color:var(--color-white);
    background:var(--color-primary);
}

.chapter7-handover::before {
    content:'';
    position:absolute;
    top:0;
    left:42%;
    z-index:-1;
    width:1px;
    height:100%;
    background:rgba(255, 255, 255, .16);
    transform:rotate(14deg);
}

.chapter7-handover__layout {
    display:grid;
    grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);
    gap:clamp(3rem, 8vw, 9rem);
    align-items:start;
}

.chapter7-handover .chapter7-story__kicker,
.chapter7-handover h2 {
    color:var(--color-white);
}

.chapter7-handover__route {
    display:grid;
    grid-column:1 / -1;
    grid-template-columns:minmax(0, 1fr) minmax(4rem, .65fr) minmax(0, 1fr);
    gap:1.5rem;
    align-items:center;
    padding:clamp(2rem, 4vw, 3.5rem);
    background:rgba(255, 255, 255, .1);
    border:1px solid rgba(255, 255, 255, .22);
}

.chapter7-handover__paper {
    margin:0;
    padding:clamp(.45rem, .8vw, .75rem);
    background:var(--color-white);
    box-shadow:0 28px 70px rgba(81, 13, 8, .32);
    transform:rotate(.65deg);
}

.chapter7-handover__paper a,
.chapter7-handover__paper img {
    display:block;
    width:100%;
}

.chapter7-handover__paper a {
    overflow:hidden;
}

.chapter7-handover__paper img {
    height:auto;
}

.chapter7-handover__route div {
    display:flex;
    flex-direction:column;
    gap:.45rem;
}

.chapter7-handover__route span:not(.chapter7-handover__line) {
    color:rgba(255, 255, 255, .65);
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.chapter7-handover__route strong {
    font-size:clamp(1.45rem, 2.7vw, 2.4rem);
    line-height:1.05;
}

.chapter7-handover__line {
    position:relative;
    display:block;
    width:75%;
    height:1px;
    background:rgba(255, 255, 255, .5);
}

.chapter7-handover__line::after {
    content:'→';
    position:absolute;
    top:50%;
    right:-17%;
    padding-left:.7rem;
    color:var(--color-white);
    font-size:1.25rem;
    transform:translateY(-54%);
}

.chapter7-outlook {
    background:var(--color-primary-light);
}

.chapter7-outlook__gallery {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:clamp(1rem, 2.4vw, 2rem);
    margin-top:clamp(4rem, 8vw, 7rem);
}

.chapter7-outlook__card {
    display:flex;
    min-width:0;
    margin:0;
    flex-direction:column;
    background:var(--color-white);
    box-shadow:0 22px 55px rgba(119, 27, 19, .12);
}

.chapter7-outlook__card a {
    display:block;
    overflow:hidden;
    background:#f1f1ef;
}

.chapter7-outlook__card img {
    display:block;
    width:100%;
    aspect-ratio:16 / 10;
    object-fit:contain;
    transition:transform .5s ease;
}

.chapter7-outlook__card:hover img {
    transform:scale(1.025);
}

.chapter7-outlook__card figcaption {
    padding:1.25rem 1.35rem;
    color:var(--color-primary);
    font-size:.7rem;
    font-weight:700;
    letter-spacing:.09em;
    line-height:1.4;
    text-transform:uppercase;
}

.chapter7-location {
    background:
            linear-gradient(rgba(90, 85, 79, .04) 1px, transparent 1px),
            linear-gradient(90deg, rgba(90, 85, 79, .04) 1px, transparent 1px),
            var(--color-light);
    background-size:52px 52px, 52px 52px, auto;
}

.chapter7-location__layout {
    display:grid;
    grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);
    gap:clamp(3rem, 7vw, 8rem);
}

.chapter7-location .chapter7-story__heading {
    margin:0;
}

.chapter7-location__copy {
    display:grid;
    gap:1.35rem;
    align-content:start;
}

.chapter7-location__copy p {
    margin:0;
    line-height:1.75;
}

.chapter7-location__article {
    width:100%;
    margin-top:clamp(2rem, 4vw, 3.5rem);
}

.chapter7-location__copy .chapter7-location__article {
    display:flex;
    flex-direction:column;
}

.chapter7-location__copy .chapter7-location__article figcaption {
    position:static;
    flex:0 0 auto;
    width:100%;
    min-width:0;
    margin:0;
}

.chapter7-location__copy .chapter7-location__article figcaption strong {
    min-width:0;
    overflow-wrap:anywhere;
}

.chapter7-location__exkurs {
    position:relative;
    display:block;
    width:100%;
    height:auto;
    margin-top:.9rem;
    padding:1.2rem 1.25rem 1.2rem 4.75rem;
    color:var(--color-text);
    background:var(--color-white);
    border:1px solid rgba(90, 85, 79, .14);
    border-radius:0;
    box-shadow:0 14px 35px rgba(55, 50, 45, .1);
    font:inherit;
    text-align:left;
}

.chapter7-location__exkurs::before {
    display:none;
}

.chapter7-location__exkurs::after {
    inset:50% auto auto 1.25rem;
    width:2.5rem;
    height:2.5rem;
    background:var(--color-primary);
    border-radius:50%;
    transform:translateY(-50%);
}

.chapter7-location__exkurs:hover {
    transform:translateY(-2px);
}

.chapter7-location__exkurs span,
.chapter7-location__exkurs strong {
    display:block;
}

.chapter7-location__exkurs span {
    margin-bottom:.2rem;
    color:var(--color-primary);
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.chapter7-location__exkurs strong {
    color:var(--color-text);
    line-height:1.35;
}

.chapter7-logo-history {
    --logo-loop-duration:30s;
    --logo-delay-scale:.75;
    position:relative;
    padding:clamp(1.4rem, 3vw, 2rem);
    border:1px solid rgba(90, 85, 79, .18);
    background:linear-gradient(160deg, rgba(255, 255, 255, .96), rgba(243, 241, 237, .96));
    box-shadow:0 24px 55px rgba(45, 41, 36, .1);
}

.chapter7-logo-history__heading {
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    gap:.5rem 1rem;
    margin-bottom:clamp(1rem, 2.8vw, 1.65rem);
}

.chapter7-logo-history__heading span {
    color:var(--color-primary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.chapter7-logo-history__heading strong {
    color:var(--color-text);
    font-size:clamp(1rem, 2vw, 1.25rem);
    letter-spacing:.01em;
}

.chapter7-logo-history__stage {
    position:relative;
    overflow:hidden;
    min-height:clamp(14rem, 30vw, 20rem);
}

.chapter7-logo-history__item {
    position:absolute;
    inset:0;
    display:grid;
    align-content:center;
    justify-items:center;
    gap:1rem;
    margin:0;
    opacity:0;
    transform:translateY(14px) scale(.98);
    animation:chapter7LogoHistorySwap var(--logo-loop-duration) ease-in-out calc(var(--logo-delay, 0s) * var(--logo-delay-scale)) infinite both;
}

.chapter7-logo-history__item img {
    display:block;
    width:min(100%, 34rem);
    max-height:clamp(9rem, 22vw, 14rem);
    object-fit:contain;
    filter:drop-shadow(0 14px 28px rgba(30, 28, 25, .16));
}

.chapter7-logo-history__item figcaption {
    color:var(--color-text);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.chapter7-logo-history__timeline {
    position:relative;
    width:100%;
    height:3px;
    margin-top:clamp(1rem, 2.6vw, 1.5rem);
    background:rgba(90, 85, 79, .18);
}

.chapter7-logo-history__timeline span {
    position:absolute;
    inset:0 auto 0 0;
    width:0;
    background:var(--color-primary);
    animation:chapter7LogoHistoryProgress var(--logo-loop-duration) linear infinite;
}

.chapter7-logo-exkurs {
    display:grid;
    gap:1.25rem;
    margin-top:2rem;
}

.chapter7-logo-exkurs__item {
    display:flex;
    flex-direction:column;
    gap:1rem;
    margin:0;
    padding:clamp(1rem, 3vw, 1.5rem);
    background:linear-gradient(160deg, #fff, #f5f3ef);
    border:1px solid rgba(90, 85, 79, .16);
    box-shadow:0 12px 30px rgba(45, 41, 36, .08);
}

.chapter7-logo-exkurs__item > a {
    display:flex;
    min-height:10rem;
    align-items:center;
    justify-content:center;
}

.chapter7-logo-exkurs__item img {
    display:block;
    width:100%;
    max-height:12rem;
    object-fit:contain;
}

.chapter7-logo-exkurs__item figcaption {
    padding-top:.8rem;
    color:var(--color-text);
    border-top:1px solid rgba(90, 85, 79, .14);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.08em;
    text-align:center;
    text-transform:uppercase;
}

@keyframes chapter7LogoHistorySwap {
    0% {
        opacity:0;
        transform:translateY(12px) scale(.98);
    }

    2.5%, 7.5% {
        opacity:1;
        transform:translateY(0) scale(1);
    }

    10%, 100% {
        opacity:0;
        transform:translateY(-10px) scale(.985);
    }
}

@keyframes chapter7LogoHistoryProgress {
    from { width:0; }
    to { width:100%; }
}

.chapter7-anniversary {
    min-height:clamp(43rem, 66vw, 60rem);
    display:flex;
    align-items:center;
    color:var(--color-white);
    background:#1d2022;
    border-bottom:1px solid white;
}

.chapter7-anniversary::after {
    content:'';
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(90deg, rgba(230, 50, 30, .22), transparent 60%);
}

.chapter7-anniversary__number {
    position:absolute;
    top:50%;
    right:-.04em;
    color:transparent;
    -webkit-text-stroke:1px rgba(255, 255, 255, .16);
    font-size:clamp(16rem, 39vw, 42rem);
    font-weight:700;
    line-height:.7;
    letter-spacing:-.1em;
    transform:translateY(-50%);
    pointer-events:none;
}

.chapter7-anniversary__inner {
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0, 7fr) minmax(16rem, 5fr);
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.chapter7-anniversary__copy {
    max-width:48rem;
}

.chapter7-anniversary .chapter7-story__kicker,
.chapter7-anniversary h2 {
    color:var(--color-white);
}

.chapter7-anniversary h2 {
    margin-bottom:2.5rem;
}

.chapter7-anniversary__copy p {
    margin:0;
    line-height:1.75;
}

.chapter7-anniversary__copy p + p {
    margin-top:1.5rem;
}

.chapter7-anniversary__keyvisual {
    width:min(100%, 30rem);
    justify-self:end;
    filter:drop-shadow(0 28px 45px rgba(0, 0, 0, .2));
}

.chapter7-anniversary__keyvisual img,
.chapter7-anniversary__keyvisual svg {
    display:block;
    overflow:visible;
    width:100%;
    height:auto;
}

.chapter7-anniversary__keyvisual svg path {
    --keyvisual-delay:0s;
    --keyvisual-x:-20px;
    --keyvisual-y:12px;
    --keyvisual-rotation:-3deg;
    opacity:0;
    transform:translate(var(--keyvisual-x), var(--keyvisual-y)) rotate(var(--keyvisual-rotation)) scale(.96);
    transform-box:fill-box;
    transform-origin:center;
    will-change:transform, opacity, filter;
}

.chapter7-anniversary__keyvisual svg path:nth-child(even) {
    --keyvisual-x:20px;
    --keyvisual-y:-12px;
    --keyvisual-rotation:3deg;
}

.chapter7-anniversary__keyvisual.is-in-view svg path {
    animation:chapter7KeyvisualRevealLoop 5.6s cubic-bezier(.22, 1, .36, 1) var(--keyvisual-delay) infinite both;
}

.chapter7-anniversary__keyvisual svg path:nth-child(1)  { --keyvisual-delay:0s; }
.chapter7-anniversary__keyvisual svg path:nth-child(2)  { --keyvisual-delay:.08s; }
.chapter7-anniversary__keyvisual svg path:nth-child(3)  { --keyvisual-delay:.16s; }
.chapter7-anniversary__keyvisual svg path:nth-child(4)  { --keyvisual-delay:.24s; }
.chapter7-anniversary__keyvisual svg path:nth-child(5)  { --keyvisual-delay:.32s; }
.chapter7-anniversary__keyvisual svg path:nth-child(6)  { --keyvisual-delay:1.4s; }
.chapter7-anniversary__keyvisual svg path:nth-child(7)  { --keyvisual-delay:.48s; }
.chapter7-anniversary__keyvisual svg path:nth-child(8)  { --keyvisual-delay:.56s; }
.chapter7-anniversary__keyvisual svg path:nth-child(9)  { --keyvisual-delay:.64s; }
.chapter7-anniversary__keyvisual svg path:nth-child(10) { --keyvisual-delay:.72s; }
.chapter7-anniversary__keyvisual svg path:nth-child(11) { --keyvisual-delay:.8s; }
.chapter7-anniversary__keyvisual svg path:nth-child(12) { --keyvisual-delay:.88s; }

@keyframes chapter7KeyvisualRevealLoop {
    0%, 10% {
        opacity:0;
        filter:blur(12px);
        transform:translate(var(--keyvisual-x), var(--keyvisual-y)) rotate(var(--keyvisual-rotation)) scale(.96);
    }

    26% {
        opacity:1;
        filter:blur(0);
        transform:translate(0, 0) rotate(0deg) scale(1.03);
    }

    34%, 74% {
        opacity:1;
        filter:blur(0);
        transform:translate(0, 0) rotate(0deg) scale(1);
    }

    92%, 100% {
        opacity:0;
        filter:blur(10px);
        transform:translate(0, 0) rotate(0deg) scale(.985);
    }
}

@media (prefers-reduced-motion:reduce) {
    .chapter7-anniversary__keyvisual svg path,
    .chapter7-anniversary__keyvisual.is-in-view svg path {
        opacity:1;
        filter:none;
        animation:none;
        transform:none;
    }

    .chapter7-logo-history__stage {
        min-height:auto;
    }

    .chapter7-logo-history__item {
        position:static;
        display:none;
        animation:none;
        opacity:1;
        transform:none;
    }

    .chapter7-logo-history__item:first-child {
        display:grid;
    }

    .chapter7-logo-history__timeline span {
        animation:none;
        width:100%;
    }
}

@media (max-width:900px) {
    .chapter7-crisis__layout,
    .chapter7-centenary__layout,
    .chapter7-expansion__layout,
    .chapter7-growth__layout,
    .chapter7-research__intro,
    .chapter7-modernization__layout,
    .chapter7-quality__layout,
    .chapter7-handover__layout,
    .chapter7-outlook__intro,
    .chapter7-location__layout {
        grid-template-columns:1fr;
    }

    .chapter7-story__copy {
        max-width:46rem;
    }

    .chapter7-paper {
        width:100%;
        max-width:50rem;
        justify-self:start;
    }

    .chapter7-expansion::before {
        top:auto;
        bottom:0;
        width:100%;
        height:38%;
    }

    .chapter7-expansion__paper {
        width:min(82%, 34rem);
        justify-self:center;
    }

    .chapter7-growth__paper {
        width:min(100%, 38rem);
        justify-self:center;
    }

    .chapter7-research__intro,
    .chapter7-outlook__intro {
        max-width:50rem;
    }

    .chapter7-modernization__gallery {
        width:min(100%, 48rem);
        justify-self:center;
    }

    .chapter7-quality__visual {
        grid-row:2;
        width:min(100%, 48rem);
        justify-self:center;
    }

    .chapter7-outlook__gallery {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .chapter7-outlook__card:last-child {
        grid-column:1 / -1;
        width:calc(50% - clamp(.5rem, 1.2vw, 1rem));
        justify-self:center;
    }

    .chapter7-anniversary__inner {
        grid-template-columns:1fr;
    }

    .chapter7-anniversary__keyvisual {
        width:min(70%, 27rem);
        justify-self:end;
    }
}

@media (max-width:600px) {
    .chapter7-story {
        padding:4.75rem 0;
    }

    .chapter7-story__heading,
    .chapter7-expansion__heading {
        max-width:100%;
    }

    .chapter7-story h2 {
        font-size:clamp(2.15rem, 10vw, 2.65rem);
        letter-spacing:-.035em;
    }

    .chapter7-crisis__paper,
    .chapter7-centenary__paper,
    .chapter7-expansion__paper,
    .chapter7-growth__paper {
        width:100%;
        transform:none;
    }

    .chapter7-crisis__facts {
        gap:.85rem;
    }

    .chapter7-crisis__facts strong {
        font-size:2.6rem;
    }

    .chapter7-centenary__100 {
        top:15rem;
        font-size:15rem;
    }

    .chapter7-centenary__award {
        align-items:flex-start;
    }

    .chapter7-centenary__programs {
        display:grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:1rem;
    }

    .chapter7-centenary__programs .chapter7-centenary__paper {
        margin-left:0 !important;
    }

    .chapter7-centenary__slide {
        padding:0;
    }

    .chapter7-centenary__slide img {
        height:clamp(19rem, 105vw, 35rem);
    }

    .chapter7-expansion::before {
        height:34%;
    }

    .chapter7-research__slide {
        padding:0;
    }

    .chapter7-research__slide > a {
        height:clamp(17rem, 82vw, 29rem);
    }

    .chapter7-modernization__gallery figure:first-child,
    .chapter7-modernization__gallery figure:last-child {
        width:100%;
        transform:none;
    }

    .chapter7-pandemic {
        min-height:auto;
    }

    .chapter7-pandemic__image::after {
        background:rgba(14, 17, 18, .72);
    }

    .chapter7-pandemic__card {
        padding:2rem 1.5rem;
        backdrop-filter:none;
    }

    .chapter7-pandemic__zoom {
        grid-template-columns:1fr 6.5rem;
    }

    .chapter7-pandemic__zoom img {
        width:6.5rem;
        height:4rem;
    }

    .chapter7-quality__visual {
        transform:none;
    }

    .chapter7-handover::before {
        display:none;
    }

    .chapter7-handover__route {
        grid-template-columns:1fr;
    }

    .chapter7-handover__paper {
        transform:none;
    }

    .chapter7-outlook__gallery {
        grid-template-columns:1fr;
    }

    .chapter7-outlook__card:last-child {
        grid-column:auto;
        width:100%;
    }

    .chapter7-anniversary__number {
        top:22%;
        font-size:16rem;
    }

    .chapter7-anniversary__keyvisual {
        width:min(82%, 23rem);
        justify-self:center;
    }
}

/* --------------- JAPAN / INTERNATIONALISIERUNG ---------------------------------------*/

.japan {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    padding:clamp(5rem, 9vw, 9rem) 0;
    background:var(--color-primary);
    color:var(--color-white);
}

.japan::after {
    content:'';
    position:absolute;
    top:50%;
    right:clamp(-14rem, -10vw, -7rem);
    z-index:-2;
    width:clamp(30rem, 54vw, 58rem);
    aspect-ratio:1;
    border:1px solid rgba(255, 255, 255, .18);
    border-radius:50%;
    box-shadow:
            0 0 0 clamp(3rem, 7vw, 8rem) rgba(255, 255, 255, .035),
            0 0 0 clamp(7rem, 14vw, 15rem) rgba(255, 255, 255, .025);
    transform:translateY(-50%);
    pointer-events:none;
}

.japan__layout {
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    gap:clamp(3rem, 7vw, 8rem);
    align-items:center;
}

.japan__copy {
    grid-column:1 / span 5;
    position:relative;
    z-index:3;
    max-width:37rem;
}

.japan__kicker {
    display:block;
    margin-bottom:1rem;
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.16em;
    text-transform:uppercase;
    opacity:.72;
}

.japan__copy h3 {
    margin:0 0 1.5rem;
    color:var(--color-white);
    line-height:.94;
}

.japan__copy p {
    max-width:34rem;
    margin:0;
    font-size:clamp(1rem, 1.25vw, 1.15rem);
    line-height:1.65;
}

.japan__route {
    display:grid;
    grid-template-columns:auto minmax(3rem, 1fr) auto;
    gap:1rem;
    align-items:center;
    max-width:29rem;
    margin-top:2.5rem;
    font-size:0.8rem;
    font-weight:500;
}

.japan__route-line {
    position:relative;
    height:1px;
    background:rgba(255, 255, 255, .55);
}

.japan__route-line::before,
.japan__route-line::after {
    content:'';
    position:absolute;
    top:50%;
    width:.55rem;
    height:.55rem;
    border:2px solid var(--color-white);
    border-radius:50%;
    background:var(--color-primary);
    transform:translateY(-50%);
}

.japan__route-line::before {
    left:0;
}

.japan__route-line::after {
    right:0;
    background:var(--color-white);
}

.japan__archive {
    grid-column:7 / span 6;
    position:relative;
    min-height:clamp(34rem, 50vw, 47rem);
}

.japan__year {
    position:absolute;
    top:-.2em;
    left:-.25em;
    color:rgba(255, 255, 255, .14);
    font-size:clamp(5rem, 10vw, 10rem);
    font-weight:700;
    line-height:1;
    letter-spacing:-.06em;
}

.japan__document {
    position:absolute;
    margin:0;
    padding:clamp(.45rem, .8vw, .75rem);
    background:#fffdf8;
    border:1px solid rgba(64, 42, 23, .2);
    border-radius:.15rem;
    box-shadow:0 28px 70px rgba(73, 11, 5, .32);
    transition:transform .45s ease, box-shadow .45s ease;
}

.japan__document a {
    display:block;
    overflow:hidden;
}

.japan__document img {
    width:100%;
    height:auto;
    filter:sepia(.06) contrast(1.02);
    transition:transform .7s ease;
}

.japan__document:hover {
    z-index:4;
    box-shadow:0 36px 80px rgba(73, 11, 5, .4);
}

.japan__document:hover img {
    transform:scale(1.015);
}

.japan__document--back {
    top:1%;
    right:0;
    z-index:1;
    width:49%;
    transform:rotate(5deg);
}

.japan__document--back:hover {
    transform:translateY(-.5rem) rotate(3deg);
}

.japan__document--front {
    bottom:0;
    left:3%;
    z-index:2;
    width:54%;
    transform:rotate(-3deg);
}

.japan__document--front:hover {
    transform:translateY(-.5rem) rotate(-1.5deg);
}

.japan__document figcaption {
    display:flex;
    flex-direction:column;
    gap:.2rem;
    padding:.8rem .25rem .2rem;
    color:var(--color-text);
}

.japan__document figcaption span {
    color:var(--color-primary);
    font-size:.65rem;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.japan__document figcaption strong {
    font-size:.72rem;
    line-height:1.35;
}

.japan__seal {
    position:absolute;
    right:31%;
    bottom:13%;
    z-index:5;
    display:flex;
    width:7.5rem;
    aspect-ratio:1;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:2px solid var(--color-white);
    border-radius:50%;
    background:var(--color-primary);
    box-shadow:0 12px 32px rgba(73, 11, 5, .28);
    color:var(--color-white);
    line-height:1.1;
    text-align:center;
    text-transform:uppercase;
    transform:rotate(8deg);
}

.japan__seal::before,
.japan__seal::after {
    content:'· · ·';
    position:absolute;
    left:50%;
    font-size:.65rem;
    letter-spacing:.25em;
    transform:translateX(-50%);
}

.japan__seal::before {
    top:.65rem;
}

.japan__seal::after {
    bottom:.65rem;
}

.japan__seal span {
    font-size:.55rem;
    letter-spacing:.15em;
}

.japan__seal strong {
    margin-top:.3rem;
    font-size:1rem;
    letter-spacing:.08em;
}

@media (max-width:900px) {
    .japan__layout {
        grid-template-columns:repeat(6, minmax(0, 1fr));
    }

    .japan__copy,
    .japan__archive {
        grid-column:1 / span 6;
    }

    .japan__copy {
        max-width:43rem;
    }

    .japan__archive {
        width:100%;
        max-width:48rem;
        min-height:clamp(33rem, 92vw, 46rem);
        margin-inline:auto;
    }
}

@media (max-width:600px) {
    .japan {
        padding:4.5rem 0 5rem;
    }

    .japan__copy h2 {
        font-size:clamp(2.75rem, 15vw, 4.25rem);
    }

    .japan__route {
        gap:.7rem;
        margin-top:2rem;
    }

    .japan__archive {
        min-height:135vw;
    }

    .japan__document--front {
        left:0;
        width:62%;
    }

    .japan__document--back {
        width:57%;
    }

    .japan__seal {
        right:24%;
        bottom:10%;
        width:6.25rem;
    }
}

/* --------------- STORY DUO ---------------------------------------*/

/*
 * Wiederverwendbares Bild-Text-Modul mit zwei Archivbildern.
 * Mit .story-duo--image-left werden Bild- und Textseite gespiegelt.
 */

.story-duo {
    position:relative;
    isolation:isolate;
    overflow:hidden;
}

.story-duo::before {
    content:attr(data-year);
    position:absolute;
    top:clamp(1rem, 3vw, 3rem);
    right:clamp(1rem, 4vw, 5rem);
    z-index:-1;
    color:transparent;
    -webkit-text-stroke:1px rgba(230, 50, 30, .13);
    font-size:clamp(7rem, 18vw, 18rem);
    font-weight:700;
    line-height:.8;
    pointer-events:none;
}

.story-duo__layout {
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    align-items:center;
}

.story-duo__copy {
    grid-column:1 / span 4;
    position:relative;
    z-index:2;
    padding:clamp(1.5rem, 3vw, 2.75rem);
    background:rgba(255, 255, 255, .86);
    border:1px solid rgba(90, 85, 79, .12);
    border-radius:.25rem;
    box-shadow:0 24px 60px rgba(90, 85, 79, .12);
    backdrop-filter:blur(6px);
}

.story-duo__kicker {
    display:block;
    margin-bottom:1rem;
    color:var(--color-primary);
    font-size:.72rem;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.story-duo__copy h3 {
    margin-top:0;
    color:var(--color-primary);
    line-height:1.08;
}

.story-duo__copy p {
    margin-bottom:0;
}

.story-duo__milestone {
    display:flex;
    align-items:center;
    gap:1rem;
    margin-top:2rem;
    padding-top:1.25rem;
    border-top:1px solid rgba(90, 85, 79, .16);
}

.story-duo__milestone strong {
    color:var(--color-primary);
    font-size:clamp(2rem, 3vw, 3rem);
    line-height:1;
}

.story-duo__milestone span {
    color:var(--color-text);
    font-size:.68rem;
    font-weight:700;
    letter-spacing:.08em;
    line-height:1.35;
    text-transform:uppercase;
}

.story-duo__media {
    grid-column:6 / span 7;
    position:relative;
    min-height:clamp(32rem, 48vw, 44rem);
}

.story-duo__figure {
    position:absolute;
    align-self:start;
    margin:0;
    padding:.7rem;
    background:#fffdf8;
    border:1px solid rgba(90, 85, 79, .15);
    border-radius:.2rem;
    box-shadow:0 22px 55px rgba(90, 85, 79, .22);
    transition:transform .45s ease, box-shadow .45s ease;
}

.story-duo__figure:hover {
    z-index:3;
    box-shadow:0 30px 65px rgba(90, 85, 79, .28);
}

.story-duo__figure a {
    display:block;
    overflow:hidden;
    background:var(--color-grey-light);
}

.story-duo__figure img {
    width:100%;
    transition:transform .7s ease;
}

.story-duo__figure:hover img {
    transform:scale(1.025);
}

.story-duo__figure--main {
    top:0;
    right:0;
    width:82%;
    transform:rotate(1deg);
}

.story-duo__figure--main:hover {
    transform:translateY(-.4rem) rotate(0);
}

.story-duo__figure--main img {
    aspect-ratio:1.44 / 1;
    object-fit:cover;
}

.story-duo__figure--secondary {
    bottom:0;
    left:0;
    width:65%;
    transform:rotate(-2.5deg);
}

.story-duo__figure--secondary:hover {
    transform:translateY(-.4rem) rotate(-1deg);
}

.story-duo__figure figcaption {
    display:flex;
    flex-direction:column;
    gap:.15rem;
    min-height:3.6rem;
    padding:.75rem .25rem .15rem;
    border-top:1px solid rgba(90, 85, 79, .14);
}

.story-duo__figure figcaption span {
    color:var(--color-primary);
    font-size:.8rem;
    font-weight:400;
}

.story-duo__figure figcaption strong {
    color:var(--color-text);
    font-size:.72rem;
    line-height:1.3;
}

.story-duo__figure .exkurs-button {
    top:auto;
    right:1.5rem;
    bottom:4.4rem;
    left:auto;
    border:0;
}

.story-duo--image-left .story-duo__copy {
    grid-column:8 / span 5;
    grid-row:1;
}

.story-duo--image-left .story-duo__media {
    grid-column:1 / span 6;
    grid-row:1;
}

.story-duo--image-left::before {
    right:auto;
    left:clamp(1rem, 4vw, 5rem);
}

@media(max-width:1210px) {
    .story-duo__copy {
        grid-column: 1 / span 5;
    }
}

@media (max-width:900px) {
    .story-duo__layout {
        grid-template-columns:repeat(6, minmax(0, 1fr));
    }

    .story-duo__copy,
    .story-duo--image-left .story-duo__copy {
        grid-column:1 / span 6;
        grid-row:auto;
        max-width:44rem;
    }

    .story-duo__media,
    .story-duo--image-left .story-duo__media {
        grid-column:1 / span 6;
        grid-row:auto;
        width:100%;
        max-width:55rem;
        min-height:clamp(31rem, 75vw, 44rem);
        margin-inline:auto;
    }
}

@media (max-width:600px) {
    .story-duo__layout {
        display:block;
    }

    .story-duo__copy {
        margin-bottom:3rem;
        padding:1.5rem;
    }

    .story-duo__media,
    .story-duo--image-left .story-duo__media {
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:1rem;
        min-height:0;
    }

    .story-duo__figure,
    .story-duo__figure--main,
    .story-duo__figure--secondary,
    .chapter6-continuity__portrait.story-duo__figure--tertiary {
        position:relative;
        inset:auto;
        width:auto !important;
        transform:none;
    }

    .story-duo__figure:hover,
    .story-duo__figure--main:hover,
    .story-duo__figure--secondary:hover,
    .chapter6-continuity__portrait.story-duo__figure--tertiary:hover {
        transform:translateY(-.25rem);
    }

    .chapter6-continuity__portrait.story-duo__figure--main {
        grid-column:1 / -1;
    }

    .story-duo__figure figcaption {
        min-height:4.7rem;
    }

    .story-duo__figure .exkurs-button {
        right:1rem;
        bottom:5.3rem;
    }
}

/* =========================================
   GLOBAL GRID SYSTEM
========================================= */

.grid {
    display:grid;
    grid-template-columns:repeat(12, minmax(0, 1fr));
    gap:clamp(20px, 3vw, 60px);
    position: relative;
}

.grid-line:before {
    content:'';
    position:absolute;
    top:50%;
    width:100%;
    height:4px;
    background:var(--color-grey-light);
}

.align-items-center {
    align-items: center;
}

.indent-left-10 {
    width:90%;
    margin-left:10%;
}

.indent-left-5 {
    width:95%;
    margin-left:5%;
}

.image-left-over {
    width:150%;
    margin-left:-50%;
}


/* Spalten */

.col-1  { grid-column:span 1; }
.col-2  { grid-column:span 2; }
.col-3  { grid-column:span 3; }
.col-4  { grid-column:span 4; }
.col-5  { grid-column:span 5; }
.col-6  { grid-column:span 6; }
.col-7  { grid-column:span 7; }
.col-8  { grid-column:span 8; }
.col-9  { grid-column:span 9; }
.col-10 { grid-column:span 10; }
.col-11 { grid-column:span 11; }
.col-12 { grid-column:span 12; }


/* Startposition */

.col-start-1  { grid-column-start:1; }
.col-start-2  { grid-column-start:2; }
.col-start-3  { grid-column-start:3; }
.col-start-4  { grid-column-start:4; }
.col-start-5  { grid-column-start:5; }
.col-start-6  { grid-column-start:6; }
.col-start-7  { grid-column-start:7; }
.col-start-8  { grid-column-start:8; }
.col-start-9  { grid-column-start:9; }
.col-start-10 { grid-column-start:10; }
.col-start-11 { grid-column-start:11; }
.col-start-12 { grid-column-start:12; }

@media(max-width:900px) {

    .grid {
        grid-template-columns:repeat(6,1fr);
    }


    .col-1,
    .col-2,
    .col-3,
    .col-4,
    .col-5,
    .col-6,
    .col-7,
    .col-8,
    .col-9,
    .col-10,
    .col-11,
    .col-12 {
        grid-column:span 6;
    }

}

@media(max-width:600px) {

    .grid {
        grid-template-columns:1fr;
        gap:25px;
    }


    [class*="col-"] {
        grid-column:1;
    }

}

/* --------------- JARALLAX ---------------------------------------*/

.jarallax-wrapper {
    min-height:40rem;
    overflow:hidden;
    position: relative;
}

/* --------------- HIGHLIGHT NUMBER ---------------------------------------*/

.highlight-number-wrapper .number {
    position: absolute;
    color:var(--color-white);
    font-size: 27.5rem;
    left: 20%;
    top: -6%;
    font-weight:200;
    z-index:2;
}

.highlight-number-extra {
    position:absolute;
    top:-5%;
    right:30%;
    width:300px;
    z-index:4;
}

.highlight-number-wrapper .grid {
    padding-top:15rem;
}

.highlight-number-content {
    position: relative;
    z-index:3;
}

.highlight-number-content h3 {
    font-size:3rem;
}

.vertrag-hund-wrapper .highlight-number-extra {
    top:45%;
}

.vertrag-hund-wrapper.highlight-number-wrapper .number {
    top:20%;
}

@media(max-width:1210px) {
    .highlight-number-wrapper .number {
        font-size: 22.5rem;
    }
    .highlight-number-content h3 {
        font-size:2rem;
    }
}

@media (max-width:900px) {
    .highlight-number-wrapper .number {
        font-size: 30vw;
        top: 13%;
    }
}

/* --------------- FULL IMAGE BG ---------------------------------------*/


.full-image-bg .grid {
    position:relative;
}

.full-image-bg .absolute-text-right-bottom {
    position:absolute;
    margin-bottom:30%;
    bottom:0;
    right:15%;
}

.full-image-bg .absolute-text-left-top {
    position:absolute;
    margin-top:5%;
    top:0;
    left:15%;
}

@media(max-width:900px) {
    .full-image-bg .absolute-text-right-bottom {
        position:relative;
        right:0;
        margin-top:2.5rem;
        margin-bottom:0;
    }
}

/* --------------- SPLIDE ---------------------------------------*/

.splide-auto .splide__slide img {
    max-height:200px;
    margin-right:2rem;
    object-fit: contain;
}

.splide-auto-big .splide__slide img {
    max-height:325px;
}

@media(max-width:600px) {
    .splide-auto .splide__slide img {
        max-height:75px;
        margin-right:1rem;
    }

    .splide-auto-big .splide__slide img {
        max-height:100px;
    }
}

/* --------------- OUTLINE TEXT  ---------------------------------------*/

.outline-text {
    color: transparent;
    -webkit-text-stroke: 1px var(--color-dark);
    font-size: 15rem;
    opacity:0.15;
    font-weight:700;
}

.outline-text.werkbuch {
    position: absolute;
    top: 7.5%;
    left:10%;
}

/* --------------- FOOTER ---------------------------------------*/

.footer-keyvisual {
    max-width:600px;
    padding-right:10%;
}

.footer-keyvisual img {
    width:100%;
}

.footer-content {
    margin-top:2rem;
    font-size:0.8rem;

}

.footer-content a {
    color:var(--color-white);
    position: relative;
    padding-right:20px;
}

.footer-content a:after {
    content:'';
    position:absolute;;
    right:6px;
    top:50%;
    transform: translate(0,-50%);
    width:5px;
    height:5px;
    border-radius: 50%;
    background:var(--color-white);
}

.footer-content a:last-child:after {
    display:none;
}

.footer-nav li {
    list-style: none;
}

.footer-nav li a {
    color:var(--color-white);
    font-weight:600;
    margin-bottom:1rem;
    display:block;
    position: relative;
    width:max-content;
    transition: var(--transition);
}

.footer-nav li a:after {
    content:'';
    position:absolute;
    bottom:-2px;
    right:0;
    width:100%;
    height:2px;
    background:var(--color-white);
    transition: var(--transition);
}

.footer-nav li a:hover:after {
    width:50px;
}

footer-nav li a:hover:after {
    width:0;
}

.footer-nav li span {
    color:var(--color-white);
    font-weight:200;
    margin-bottom:0;
}

.footer-home-link {
    position:fixed;
    right:calc(clamp(1rem, 2vw, 2rem) + env(safe-area-inset-right));
    bottom:calc(clamp(1rem, 2vw, 2rem) + env(safe-area-inset-bottom));
    z-index:990;
    display:inline-flex;
    gap:.6rem;
    align-items:center;
    justify-content:center;
    min-height:3.25rem;
    padding:.75rem 1rem;
    color:var(--color-white);
    background:var(--color-primary);
    border:1px solid rgba(255, 255, 255, .5);
    border-radius:999px;
    box-shadow:0 12px 32px rgba(0, 2, 7, .24);
    font-size:.78rem;
    font-weight:700;
    line-height:1;
    letter-spacing:.04em;
    text-transform:uppercase;
    transition:transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.footer-home-link svg {
    width:1.2rem;
    height:1.2rem;
    fill:none;
    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.footer-home-link:hover {
    color:var(--color-white);
    background:var(--color-primary-dark);
    box-shadow:0 16px 38px rgba(0, 2, 7, .3);
    transform:translateY(-2px);
}

.footer-home-link:focus-visible {
    outline:3px solid var(--color-white);
    outline-offset:3px;
}

body[data-chapter="0"] .footer-home-link {
    display:none;
}

@media(max-width:900px) {
    .footer-nav {
        padding:0;
    }
}

@media(max-width:600px) {
    .footer-home-link {
        width:3.25rem;
        padding:0;
    }

    .footer-home-link span {
        position:absolute;
        width:1px;
        height:1px;
        overflow:hidden;
        clip-path:inset(50%);
        white-space:nowrap;
    }
}