/* WILDFINS HOME */

.home-hero{
    position:relative;
    background:#D8D8D4;
}

.home-hero-media{
    display:block;
    width:100%;
    height:110%;
}

.home-hero img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}


/* ==========================================================
   INTRO
   ========================================================== */

.home-intro{
    padding-top:70px;
    padding-bottom:90px;
}

/* Gleiche Breite wie der Bildbereich darunter */
.home-intro-inner{
    display:flex;
    justify-content:flex-start;
}

.home-intro-copy > p:not(.eyebrow):not(.lead) {

    max-width: none;

    font-size: 1.43rem;

    line-height: 1.65;

}

/* 1) WILDFINS – doppelte Größe */
.home-intro .eyebrow{
    font-size:1.44rem;
}

.home-intro h1{
    max-width:none;
    margin-bottom:28px;
}

/* 3) Seit 1992 ... – ca. 20 % größer */
.home-intro .lead{
    max-width:none;
    font-size:1.72rem;
    line-height:1.45;
}

/* 4) Fließtext – ca. 30 % größer */
.home-intro-copy > p:not(.eyebrow):not(.lead){
    max-width:none;
    font-size:1.43rem;
}


/* ==========================================================
   CHALLENGES / QUESTS
   ========================================================== */

.home-experiences{
    padding-bottom:120px;
}

.home-experience-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:32px;
}

.home-experience{
    min-width:0;
}

.home-experience-link{
    display:block;
}

.home-experience-image{
    width:100%;
    margin-bottom:34px;
    background:#D8D8D4;
}

.home-experience-image > .image-placeholder{
    width:100%;
    height:100%;
}

.home-experience-content{
    max-width:620px;
}

.home-experience-content h2{
    margin-bottom:18px;
}

.home-experience-content p:not(.eyebrow){
    font-size:1.43rem;
    line-height:1.65;
    color:var(--color-text-soft);
}

.home-experience-more{
    display:inline-block;
    margin-top:10px;
    font-family:var(--font-sans);
    font-size:.72rem;
    font-weight:var(--fw-semibold);
    letter-spacing:.12em;
    text-transform:uppercase;
    color:var(--color-primary);
}
.quest-concept p,
.quest-discovery p,
.quest-expedition p,
.quest-frequency p {
    margin: 0 0 18px;
}

.quest-concept p:last-child,
.quest-discovery p:last-child,
.quest-expedition p:last-child,
.quest-frequency p:last-child {
    margin-bottom: 0;
}


/* ==========================================================
   CLOSING
   ========================================================== */

.home-closing{
    padding-top:80px;
    padding-bottom:135px;
}

/* 20 % breiter */
.home-closing-inner{
    max-width:1080px;
    margin-inline:auto;
}
.home-closing .eyebrow{
    font-size:1.44rem;
}
.home-closing h2{
    max-width:1080px;


    font-size:clamp(1.15rem,1.8vw,1.50rem);

    line-height:1.50;
    text-align:center;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media(max-width:900px){

    .home-experience-grid{
        grid-template-columns:1fr;
    }

    .home-experience-content{
        max-width:760px;
    }

}


@media(max-width:700px){
	.home-intro-inner,
    .home-experience-grid{
        width:92vw;
        margin-inline:auto;
    }

    .home-intro{
        padding-top:40px;
        padding-bottom:72px;
    }

    .home-intro .eyebrow{
        font-size:1.44rem;
    }

    .home-intro .lead{
        font-size:1.18rem;
    }

    .home-intro-copy > p:not(.eyebrow):not(.lead){
        font-size:1.43rem;
    }

    .home-experiences{
        padding-bottom:88px;
    }

    .home-experience-image{
        margin-bottom:26px;
    }

    .home-closing{
        padding-top:80px;
        padding-bottom:100px;
    }

    .home-closing-inner,
    .home-closing h2{
        max-width:92vw;
    }

    .home-closing h2{
        font-size:1.10rem;
    }

}


/* ==========================================================
   EXPERIENCE LABELS
   ========================================================== */

.home-experience-content .eyebrow{
    font-size:1.43rem;
}


/* ==========================================================
   EXPERIENCE LINK
   ========================================================== */

.home-experience-more{
    font-size:1.2rem;
}

/* ==========================================================
   CHALLENGES / QUESTS
   Gemeinsame Seitenstruktur
   ========================================================== */


/* ==========================================================
   HERO
   ========================================================== */

.challenge-hero{

    width:100%;

}


.challenge-hero-placeholder{

    width:100%;

    min-height:560px;

    background:var(--color-primary);

    display:flex;

    align-items:center;

    justify-content:center;

    color:rgba(255,255,255,.55);

    font-family:var(--font-sans);

    font-size:.70rem;

    letter-spacing:.12em;

    text-transform:uppercase;

}



/* ==========================================================
   COMMON SECTION CONTAINER
   ========================================================== */

.challenge-section-inner,
    .challenge-intro-inner{
        width:calc(100% - 88px);
        max-width:none;
        margin-inline:auto;
    }



/* ==========================================================
   INTRO
   ========================================================== */

.challenge-intro{

    padding:70px 0 0;

}


.challenge-intro-inner{

    max-width:var(--content-wide);

}


.challenge-intro h1{

    margin:18px 0 34px;

    font-family:var(--font-serif);

    font-size:clamp(2.6rem,4vw,4.4rem);

    font-weight:var(--fw-normal);

    line-height:1.05;

    color:var(--color-primary);

}


.challenge-intro-text{

    max-width:1100px;

}


.challenge-intro-text p{

    max-width:none;

    margin:0 0 18px;

}


.challenge-intro-claim{

    width:min(var(--content-wide),96vw);

    margin:72px auto 0;

    padding:0 0 72px;

    text-align:center;

    font-family:var(--font-serif);

    font-size:1.35rem;

    line-height:1.4;

    color:var(--color-primary);

    border-bottom:1px solid rgba(48,72,59,.16);

}



/* ==========================================================
   CHALLENGE IMAGE STRIP
   ========================================================== */

.challenge-image-strip {

    width: 100%;

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 6px;

    margin: 76px 0 88px;

}


.challenge-strip-image {

    width: 100%;

    aspect-ratio: 5 / 3;

    overflow: hidden;

}


/* ==========================================================
   BILD / PLACEHOLDER
   ========================================================== */

.challenge-strip-image .image-placeholder {

    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

}


/* Echte Bilder */

.challenge-strip-image img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

}

/* ==========================================================
   DIE DREI BAUSTEINE
   ========================================================== */

.challenge-building-blocks{

    padding:30px 0 100px;

}


.challenge-building-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:48px;

    margin-top:54px;

}


.challenge-building-item h2{

    margin:0 0 18px;

    font-family:var(--font-serif);

    font-size:1.85rem;

    font-weight:var(--fw-normal);

    line-height:1.15;

    color:var(--color-primary);

}


.challenge-building-item p{

    margin:0;

    max-width:360px;

    font-size:1.2rem;

    line-height:1.65;

}

/* ==========================================================
   CHALLENGES – BUILDING BLOCK IMAGES
   ========================================================== */

.challenge-building-image {
    width: 100%;
    aspect-ratio: 4 / 3;
    margin: 24px 0 26px;
    overflow: hidden;
}

.challenge-building-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.challenge-building-image .image-placeholder {
    width: 100%;
    height: 100%;

    background: #d8d8d4;

    display: flex;
    align-items: center;
    justify-content: center;

    font-family: var(--font-sans);
    font-size: 0.85rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;

    color: var(--color-primary);
}

/* ==========================================================
   PERSÖNLICHE BETREUUNG
   ========================================================== */

.challenge-support{

    padding:70px 0 90px;

}


.challenge-support h2{

    margin:18px 0 28px;

    font-family:var(--font-serif);

    font-size:clamp(2rem,3vw,3rem);

    font-weight:var(--fw-normal);

    line-height:1.1;

    color:var(--color-primary);

}


.challenge-support p{

    max-width:1100px;

    margin:0 0 16px;

}



/* ==========================================================
   ALLES AUF DEUTSCH
   ========================================================== */

.challenge-language{

    padding:0 0 80px;

}


.challenge-language p{

    max-width:1100px;

    margin:18px 0 0;

}



/* ==========================================================
   ZUR RICHTIGEN ZEIT
   ========================================================== */

.challenge-timing{

    padding:20px 0 100px;

}


.challenge-timing h2{

    margin:0 0 22px;

    font-family:var(--font-serif);

    font-size:clamp(1.8rem,2.6vw,2.8rem);

    font-weight:var(--fw-normal);

    line-height:1.15;

    color:var(--color-primary);

}


.challenge-timing p{

    max-width:1100px;

    margin:0 0 14px;

}



/* ==========================================================
   CHALLENGE LIST
   ========================================================== */

.challenge-list{

    padding:0 0 120px;

}


.challenge-list-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;

    margin-top:42px;

}


.challenge-card{

    min-width:0;

}


.challenge-card-link{

    display:block;

    color:inherit;

}


.challenge-card-image{

    width:100%;

    aspect-ratio:3 / 2;

    overflow:hidden;

}


.challenge-card-image .image-placeholder{

    width:100%;
    height:100%;

    display:flex;

    align-items:center;
    justify-content:center;

    background:var(--color-placeholder, #d8d8d5);

    color:var(--color-primary);

    font-family:var(--font-sans);

    font-size:.70rem;

    letter-spacing:.10em;

    text-transform:uppercase;

}
.challenge-card-image-link .challenge-card-image {
    transition: transform .45s ease;
}

.challenge-card-image-link:hover .challenge-card-image {
    transform: scale(1.025);
}

.challenge-card-content{

    padding-top:22px;

}


.challenge-card-content h2{

    margin:12px 0 14px;

    font-family:var(--font-serif);

    font-size:1.75rem;

    font-weight:var(--fw-normal);

    line-height:1.15;

    color:var(--color-primary);

}


.challenge-card-content span{

    font-family:var(--font-sans);

    font-size:.78rem;

    font-weight:var(--fw-medium);

    letter-spacing:.12em;

    text-transform:uppercase;

    color:var(--color-primary);

}



/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:900px){

    .challenge-hero-placeholder{

        min-height:420px;

    }


    .challenge-building-grid{

        grid-template-columns:1fr;

        gap:42px;

    }


    .challenge-list-grid{

        grid-template-columns:1fr 1fr;

    }

}

@media (max-width: 700px) {

    .challenge-image-strip {

        grid-template-columns: repeat(2, 1fr);

        gap: 6px;

        margin: 52px 0 64px;

    }


    .challenge-strip-image {

        aspect-ratio: 5 / 3;

    }

}

@media (max-width:700px){

    .challenge-hero-placeholder{

        min-height:320px;

    }


    .challenge-intro{

        padding-top:64px;

    }


    .challenge-intro-claim{

        margin-top:52px;

        padding-bottom:52px;

    }


    .challenge-building-blocks{

        padding-bottom:70px;

    }


    .challenge-list-grid{

        grid-template-columns:1fr;

        gap:52px;

    }

}
/* ==========================================================
   CHALLENGES / QUESTS
   Typografie wie HOME
   ========================================================== */

.challenge-intro-text p,
.challenge-building-item p,
.challenge-support p,
.challenge-language p,
.challenge-timing p{

    font-size:1.4rem;
    line-height:1.7;

}


.challenge-card-content span{

    font-size:1.2rem;
    line-height:1.4;

}

/* ==========================================================
   CHALLENGES / QUESTS
   FLIESSTEXT
   ========================================================== */

.challenge-building-item p{

    font-size:1.4rem;

    line-height:1.7;

}


.challenge-support > .challenge-section-inner > p:not(.eyebrow){

    font-size:1.2rem;

    line-height:1.7;

}
/* ==========================================================
   QUESTS
   Abschnittsabstände
   ========================================================== */

.quests-page .section{
    padding-top:70px;
    padding-bottom:70px;
}
/* ==========================================================
   QUESTS – EINHEITLICHE TEXTBREITE
   ========================================================== */

.quests-page .challenge-section-inner {
    width: min(var(--content-wide), 96vw);
    margin-inline: auto;
}

.quests-page .challenge-feature-text {
    width: 100%;
    max-width: 1100px !important;
}

.quests-page .challenge-feature-text p {
    max-width: none !important;
}
/* ==========================================================
   QUESTS – KONZEPT TEXTBREITE
   ========================================================== */

.quest-concept .container-wide {
    width: min(var(--content-wide), 96vw);
    max-width: 1100px;
    margin-inline: auto;
}

.quest-concept .container-wide > p:not(.eyebrow) {
    max-width: none;
}
/* ==========================================================
   QUESTS – CLAIM OHNE TRENNLINIE
   ========================================================== */

.quest-intro .challenge-intro-claim{
    border-bottom:none;
}
/* ==========================================================
   QUESTS – BREITE DER FLIESSTEXTE
   ========================================================== */

.quest-concept p:not(.eyebrow),
.quest-discovery .challenge-feature-text p,
.quest-expedition .challenge-feature-text p,
.quest-frequency .challenge-feature-text p{

    max-width:1100px;

}


/* Textcontainer der Quest-Abschnitte */

.quest-discovery .challenge-feature-text,
.quest-expedition .challenge-feature-text,
.quest-frequency .challenge-feature-text{

    max-width:1100px;

}
/* ==========================================================
   QUESTS – MOBILE DARSTELLUNG
   ========================================================== */

@media (max-width:700px){

    /* Einheitlicher seitlicher Rand */

    .quests-page .challenge-intro-inner,
    .quests-page .challenge-section-inner,
    .quests-page .container-wide{

        width:calc(100% - 48px);
        max-width:none;
        margin-inline:auto;

    }


    /* Fließtext darf auf Mobile die verfügbare Breite nutzen */

    .quests-page .challenge-intro-text,
    .quests-page .challenge-feature-text{

        width:100%;
        max-width:none;

    }


    .quests-page .challenge-intro-text p,
    .quests-page .challenge-feature-text p,
    .quests-page .quest-concept p:not(.eyebrow){

        max-width:none;

    }


    /* Überschriften / Eyebrows auf Mobile etwas zurücknehmen */

    .quests-page .eyebrow{

        font-size:1.05rem;
        line-height:1.4;
        letter-spacing:.18em;

    }

}