:root {
    --brandColor1: #5875ff;
    --brandColor2: #A685DF;
    --brandColor3: #c300ff;

    --pageBackground: #0b0b0f;
    --contentMaxWidth: 1500px;
    --contentPadding: 40px;

    --drawStrokeWidth: 3;
    --drawDurationMs: 2200; /* Draw Dauer */
    --drawEasing: cubic-bezier(.2, .8, .2, 1);

    --drawGlowEnabled: 1; /* 1=an, 0=aus */
    --drawGlowRadiusPx: 18; /* Glow Radius */
    --drawGlowOpacity: 0.45; /* Glow Opacity */

    --whiteFadeDurationMs: 2800; /* AUFATMEN langsamer */
    --whiteFadeEasing: cubic-bezier(.2, .8, .2, 1);

    --svgStartOpacity: 1; /* 1 = direkt sichtbar */
    --svgStartFadeMs: 0;

    .banner-heading-wrapper {
        width: 100%;
    }
}
.wrap{
    width:min(var(--contentMaxWidth), 90vw);
    padding:var(--contentPadding);
}
svg[data-brand-anim="breathe-gradient"] path{
    opacity:0;
}

#brandSvg{
    width:100%;
    height:auto;
    display:block;
    max-height:75vh;
}

@media (prefers-reduced-motion: reduce){
    :root{
        --drawDurationMs:0;
        --whiteFadeDurationMs:0;
        --svgStartFadeMs:0;
    }
}
.banner-heading-block{
    position:relative;
    width:100%;
    height:100vh;
    min-height:32rem;
    overflow:hidden;
}

.banner-bg{
    position:absolute;
    inset:0;
    background-image:url("../img/hero_background.png");
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    z-index:1;
}

.banner-icon{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    width: clamp(250px, 40vw, 700px);
    height: clamp(250px, 40vw, 640px);
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
    opacity:0.4;
    z-index:0;
    pointer-events:none;
}


.banner-text{
    position:absolute;
    left:0;
    right:0;
    bottom:16rem;
    text-align:center;
    white-space:nowrap;
    line-height:1.05;
    margin:0;
    padding:0 1rem;
    transform:none;
    z-index:3;
    font-size:6.5rem;
    font-weight:600;
    letter-spacing:0.08em;
    color:#fff;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:geometricPrecision;
}

@media (max-width:768px){
    .banner-icon{
        background-size:20%;
    }
    .banner-text{
        font-size:2.6rem;
        letter-spacing:0.06em;
        bottom:20rem;
    }
}

@media (max-width:480px){
    .banner-icon{
        bottom: 26rem;
    }
    .banner-text{
        font-size:1.9rem;
        letter-spacing:0.04em;
        bottom: 30rem;
    }
}



.footer-bottom-new{
    display:grid;
    grid-template-columns: 1fr auto 1fr;
    gap:4rem;
    align-items:start;
}

.footer-title{
    font-size:1.6rem;
    font-weight:600;
    margin-bottom:1.2rem;
}

.footer-links-2col{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:3rem;
}

.footer-links-col{
    display:flex;
    flex-direction:column;
    gap:1rem;
}

.footer-social{
    display:flex;
    justify-content:center;
    align-items:center;
    padding-top:4.2rem;
}

.footer-social-row{
    display:flex;
    gap:1rem;
}

.footer-social-btn{
    width:38px;
    height:38px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.10);
}

.footer-social-btn img{
    width:16px;
    height:16px;
    display:block;
}

.footer-bottom-bar{
    margin-top:4rem;
    padding-top:1.8rem;
    border-top:3px solid rgba(255,255,255,.10);
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:2rem;
}

.footer-copy{
    opacity:.7;
    font-size:.95rem;
}

.footer-legal{
    align-items:center;
    gap:.9rem;
    opacity:.7;
    font-size:.95rem;
}

.footer-legal-link{
    color:inherit;
    text-decoration:none;
}

.footer-dot{
    opacity:.5;
}

@media (max-width: 992px){
    .footer-bottom-new{
        grid-template-columns:1fr;
        gap:2.5rem;
    }
    .footer-social{
        justify-content:flex-start;
        padding-top:0;
    }
    .footer-bottom-bar{
        flex-direction:column;
        align-items:flex-start;
    }
}

@media (max-width: 480px){
    .footer-links-2col{
        grid-template-columns:1fr;
        gap:1.6rem;
    }
}



.footer-hero{
    position:relative;
    width:100%;
    height:70vh;
    min-height:32rem;
    overflow:visible;
    background:#000;
}

.footer-hero-image{
    position:absolute;
    inset:0;
    width:auto;
    height:100%;
    right: 0;
    object-fit:cover;
    object-position:center;
    z-index:1;
}

.footer-hero-logo{
    position:absolute;
    inset:0;
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:2;
    pointer-events:none;
}


.bg-blur-block-footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2vh;
    height: 40vh;
    z-index: 5;
    pointer-events: none;


}


.footer-hero-word{
    width:min(1100px, 80vw);
    height:auto;
    display:block;
}

@media (max-width:768px){
    .footer-hero{
        height:55vh;
        min-height:26rem;
    }
    .footer-hero-logo{
        bottom:2.6rem;
    }
    .footer-hero-word{
        width:88vw;
    }
}
.download-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:2.4rem;
    justify-items:center;
    align-items:center;
}

.download-card{
    width:100%;
    max-width:340px;
    justify-content:center;
    text-decoration:none;
}

.download-icon{
    display:flex;
    align-items:center;
    justify-content:center;
}

.download-icon img{
    width:20px;
    height:20px;
    display:block;
}

.download-text{
    font-size:1rem;
    font-weight:500;
    white-space:nowrap;
}

@media (max-width:768px){
    .download-grid{
        grid-template-columns:1fr;
        gap:1.6rem;
    }
    .download-card{
        max-width:100%;
    }
}


@keyframes slideUpFade {
    from {
        opacity: 0;
        transform: translateY(100px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-slide-up {
    opacity: 0;
    animation: slideUpFade 1s ease-out forwards;
    animation-delay: 2s;
}

html, body {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

code, pre, .w-richtext code, .w-richtext pre {
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace !important;
}