/* TNT-HOME-EFFECTS-V1 · TierNotTeam Startseiten-Effekte */
:root{
    --tnt-effect-duration:.72s;
    --tnt-effect-distance:18px;
    --tnt-card-lift:-7px;
    --tnt-card-scale:1.012;
    --tnt-hero-scale:1.045;
}

body.page-home.tnt-intensity-subtle{
    --tnt-effect-duration:.62s;
    --tnt-effect-distance:12px;
    --tnt-card-lift:-4px;
    --tnt-card-scale:1.006;
    --tnt-hero-scale:1.025;
}
body.page-home.tnt-intensity-normal{
    --tnt-effect-duration:.74s;
    --tnt-effect-distance:20px;
    --tnt-card-lift:-7px;
    --tnt-card-scale:1.012;
    --tnt-hero-scale:1.045;
}
body.page-home.tnt-intensity-strong{
    --tnt-effect-duration:.9s;
    --tnt-effect-distance:30px;
    --tnt-card-lift:-10px;
    --tnt-card-scale:1.02;
    --tnt-hero-scale:1.075;
}

/* Unabhängiges Reveal-System. Ohne JS werden keine Elemente versteckt. */
.page-home.tnt-effects-scroll .tnt-reveal-up{
    opacity:0;
    transform:translate3d(0,var(--tnt-effect-distance),0);
    transition:
        opacity var(--tnt-effect-duration) cubic-bezier(.2,.65,.25,1) var(--tnt-delay,0ms),
        transform var(--tnt-effect-duration) cubic-bezier(.2,.65,.25,1) var(--tnt-delay,0ms);
    will-change:opacity,transform;
}
.page-home.tnt-effects-scroll .tnt-reveal-up.tnt-effect-visible{
    opacity:1;
    transform:translate3d(0,0,0);
}

/* Hero: ruhiger Ken-Burns-/Breathing-Effekt. */
.page-home.tnt-effects-hero .hero-visual{
    overflow:visible;
}
.page-home.tnt-effects-hero .hero-main-image{
    transform-origin:50% 48%;
    animation:tntHeroBreath 13s ease-in-out infinite alternate;
    will-change:transform;
}
@keyframes tntHeroBreath{
    from{transform:scale(1) translate3d(0,0,0)}
    to{transform:scale(var(--tnt-hero-scale)) translate3d(0,-.45%,0)}
}

/* Karten-Mikrointeraktion. */
.page-home.tnt-effects-cards .animal-card,
.page-home.tnt-effects-cards .mission-card,
.page-home.tnt-effects-cards .news-card,
.page-home.tnt-effects-cards .help-option,
.page-home.tnt-effects-cards .knowledge-card{
    transition:transform .32s ease,box-shadow .32s ease,filter .32s ease;
    transform:translateZ(0);
}
@media (hover:hover) and (pointer:fine){
    .page-home.tnt-effects-cards .animal-card:hover,
    .page-home.tnt-effects-cards .mission-card:hover,
    .page-home.tnt-effects-cards .news-card:hover,
    .page-home.tnt-effects-cards .help-option:hover{
        transform:translateY(var(--tnt-card-lift)) scale(var(--tnt-card-scale));
        box-shadow:0 18px 44px rgba(26,56,42,.16);
    }
    .page-home.tnt-effects-cards .animal-card:hover .animal-image-main,
    .page-home.tnt-effects-cards .news-card:hover img{
        transform:scale(1.025);
    }
}
.page-home.tnt-effects-cards .animal-image-main,
.page-home.tnt-effects-cards .news-card img{
    transition:transform .5s cubic-bezier(.2,.65,.25,1);
}

/* Manuell als dringend markierte Tiere. */
.animal-card-urgent{
    position:relative;
    isolation:isolate;
    box-shadow:0 0 0 2px rgba(190,58,49,.28),0 14px 36px rgba(130,44,37,.10);
}
.page-home .animal-card-urgent{
    animation:tntUrgentGlow 3.2s ease-in-out infinite;
}
@keyframes tntUrgentGlow{
    0%,100%{box-shadow:0 0 0 2px rgba(190,58,49,.24),0 14px 36px rgba(130,44,37,.09)}
    50%{box-shadow:0 0 0 4px rgba(190,58,49,.10),0 18px 42px rgba(130,44,37,.16)}
}
.animal-card-urgent .animal-image{position:relative}
.urgent-pill{
    position:absolute;
    left:14px;
    bottom:14px;
    z-index:5;
    display:inline-flex;
    align-items:center;
    gap:.35rem;
    padding:.42rem .68rem;
    border-radius:999px;
    background:#a9342e;
    color:#fff;
    font-size:.72rem;
    line-height:1;
    font-weight:850;
    letter-spacing:.06em;
    text-transform:uppercase;
    box-shadow:0 8px 20px rgba(80,20,16,.24);
}
.urgent-pill::before{content:'!';display:grid;place-items:center;width:1.15rem;height:1.15rem;border-radius:50%;background:#fff;color:#a9342e;font-size:.78rem}

/* Vermittlungsreise */
.tnt-journey-section{
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 10% 15%,rgba(244,186,93,.18),transparent 32%),
        radial-gradient(circle at 88% 85%,rgba(74,137,105,.15),transparent 34%),
        linear-gradient(180deg,#fff 0%,#f7f3ea 100%);
}
.tnt-journey-heading{max-width:760px;margin:0 auto 2.4rem;text-align:center}
.tnt-journey-heading h2{margin:.35rem 0 .7rem}
.tnt-journey-heading p{margin:0 auto;max-width:680px}
.tnt-journey-track{
    position:relative;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:1rem;
    padding:1.1rem 0 .5rem;
}
.tnt-journey-line{
    position:absolute;
    top:3.55rem;
    left:10%;
    right:10%;
    height:4px;
    overflow:hidden;
    border-radius:999px;
    background:rgba(40,82,61,.12);
}
.tnt-journey-line span{
    display:block;
    width:0;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,#d5963f,#5f9878,#d26458);
    transition:width 1.25s cubic-bezier(.2,.75,.2,1) .18s;
}
.tnt-journey-animated.is-active .tnt-journey-line span{width:100%}
.tnt-journey-step{
    position:relative;
    z-index:1;
    min-height:205px;
    padding:1.1rem 1rem 1.25rem;
    border:1px solid rgba(40,82,61,.11);
    border-radius:24px;
    background:rgba(255,255,255,.88);
    box-shadow:0 12px 30px rgba(38,61,49,.08);
    text-align:center;
}
.tnt-journey-step i{
    display:grid;
    place-items:center;
    width:4.9rem;
    height:4.9rem;
    margin:-.15rem auto .8rem;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 0 7px rgba(255,255,255,.88),0 10px 24px rgba(39,80,60,.13);
    font-size:2rem;
    font-style:normal;
}
.tnt-journey-step>span{display:block;margin-bottom:.28rem;color:#8d6b3d;font-size:.72rem;font-weight:850;letter-spacing:.12em}
.tnt-journey-step b{display:block;margin-bottom:.4rem;color:#244c39;font-size:1.08rem}
.tnt-journey-step small{display:block;line-height:1.55;color:#5c665f;font-size:.88rem}
.tnt-journey-animated .tnt-journey-step{
    opacity:.45;
    transform:translateY(14px) scale(.97);
    transition:opacity .5s ease,transform .55s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease;
}
.tnt-journey-animated .tnt-journey-step.is-active{
    opacity:1;
    transform:translateY(0) scale(1);
    box-shadow:0 18px 42px rgba(38,61,49,.13);
}

/* Saisonpartikel */
.tnt-season-particles{
    position:fixed;
    inset:0;
    z-index:12;
    pointer-events:none;
    overflow:hidden;
    contain:strict;
}
.tnt-season-particle{
    position:absolute;
    left:var(--left);
    top:-12vh;
    opacity:var(--opacity,.55);
    font-size:var(--size,1rem);
    filter:drop-shadow(0 2px 2px rgba(0,0,0,.08));
    animation:tntParticleFall var(--duration,13s) linear var(--delay,0s) infinite;
    will-change:transform;
}
@keyframes tntParticleFall{
    0%{transform:translate3d(0,-8vh,0) rotate(0deg)}
    50%{transform:translate3d(var(--drift,18px),52vh,0) rotate(160deg)}
    100%{transform:translate3d(var(--drift-end,-18px),116vh,0) rotate(340deg)}
}

/* Pfoten-Button nach oben */
.tnt-back-top{
    position:fixed;
    right:22px;
    bottom:22px;
    z-index:60;
    width:48px;
    height:48px;
    border:0;
    border-radius:50%;
    background:#28523d;
    color:#fff;
    box-shadow:0 12px 28px rgba(26,55,42,.25);
    font-size:1.35rem;
    cursor:pointer;
    opacity:0;
    visibility:hidden;
    transform:translateY(12px) scale(.9);
    transition:opacity .25s ease,transform .25s ease,visibility .25s ease,background .25s ease;
}
.tnt-back-top.is-visible{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.tnt-back-top:hover{background:#1e4331}
.tnt-back-top:focus-visible{outline:3px solid rgba(244,186,93,.9);outline-offset:3px}

/* Zähler: verhindert Layoutsprünge */
.hero-trust b[data-tnt-counter]{font-variant-numeric:tabular-nums;min-width:3ch;display:inline-block}

@media (max-width:820px){
    .tnt-journey-track{grid-template-columns:1fr;gap:.85rem;padding-left:1.25rem}
    .tnt-journey-line{top:2rem;bottom:2rem;left:3.55rem;right:auto;width:4px;height:auto}
    .tnt-journey-line span{width:100%;height:0;transition:height 1.25s cubic-bezier(.2,.75,.2,1) .18s}
    .tnt-journey-animated.is-active .tnt-journey-line span{width:100%;height:100%}
    .tnt-journey-step{min-height:0;text-align:left;padding:1rem 1rem 1rem 5.8rem}
    .tnt-journey-step i{position:absolute;left:.7rem;top:50%;width:4rem;height:4rem;margin:0;transform:translateY(-50%);font-size:1.65rem}
    .tnt-back-top{right:15px;bottom:15px}
}

@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto!important}
    .page-home.tnt-effects-scroll .tnt-reveal-up,
    .page-home.tnt-effects-scroll .tnt-reveal-up.tnt-effect-visible,
    .page-home.tnt-effects-hero .hero-main-image,
    .page-home .animal-card-urgent,
    .tnt-journey-animated .tnt-journey-step,
    .tnt-journey-line span,
    .tnt-back-top{
        animation:none!important;
        transition:none!important;
        transform:none!important;
        opacity:1!important;
    }
    .tnt-season-particles{display:none!important}
}