/* Feinschliff und Animationen – ergänzt das bestehende Design, ersetzt nichts.
   Alles Bewegte nur ohne „reduzierte Bewegung“; ohne JavaScript bleibt alles sichtbar. */

/* ---------- Header: fixiert, gläsern beim Scrollen, Lesefortschritt ---------- */
.site-header{position:sticky;top:0;transition:background-color .35s,box-shadow .35s,border-color .35s}
.site-header .nav-shell{transition:height .35s cubic-bezier(.2,.7,.2,1)}
.site-header.is-scrolled{background:#f6f3ebd9;-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 10px 30px #142e2912;border-color:transparent}
.site-header.is-scrolled .nav-shell{height:70px}
.read-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--gold),var(--goldlight));transform-origin:0 50%;transform:scaleX(var(--p,0));pointer-events:none}
@media(max-width:800px){.site-header.is-scrolled .nav-shell{height:64px}.site-header.is-scrolled .mobile-nav{top:64px}}

/* Navigation: Unterstrich wächst von links */
.desktop-nav a:not(.portal-nav){position:relative}
.desktop-nav a:not(.portal-nav):after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:0 50%;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.desktop-nav a:hover:after,.desktop-nav a:focus-visible:after{transform:scaleX(1)}

/* ---------- Buttons & Pfeile ---------- */
.button{position:relative;overflow:hidden;isolation:isolate}
.button-gold:after{content:'';position:absolute;inset:-2px auto -2px -60%;width:45%;background:linear-gradient(100deg,transparent,#ffffff8c,transparent);transform:skewX(-18deg);z-index:-1;transition:left .7s cubic-bezier(.2,.7,.2,1)}
.button-gold:hover:after{left:120%}
.button span[aria-hidden],.text-link span[aria-hidden],.nav-contact span[aria-hidden],.card-link span[aria-hidden],.email-link span[aria-hidden]{display:inline-block;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.button:hover span[aria-hidden],.text-link:hover span[aria-hidden],.nav-contact:hover span[aria-hidden],.card-link:hover span[aria-hidden],.email-link:hover span[aria-hidden]{transform:translate(3px,-3px)}

/* ---------- Kleine Politur ---------- */
.service-card{transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s,border-color .45s}
.service-card:hover{border-color:#b8a57f}
.service-card:hover .card-top span:last-child{transform:translate(3px,-3px)}
.card-top span:last-child{transition:transform .35s}
.faq-list summary{transition:color .2s}
.faq-list summary:hover{color:#8a6a45}
.faq-list details p{animation:none}
.partner-plate{transition:border-color .3s,background-color .3s}
.partner:hover .partner-plate{background:#f1ede2;border-color:#bfae8a}

@media (prefers-reduced-motion:no-preference){

  /* ---------- Hero: Auftritt beim Laden ---------- */
  .anim-hero .hero-copy>*{opacity:0;transform:translateY(26px);animation:rise .95s cubic-bezier(.2,.7,.2,1) forwards}
  .anim-hero .hero-copy>:nth-child(1){animation-delay:.1s}
  .anim-hero .hero-copy>:nth-child(2){animation-delay:.22s}
  .anim-hero .hero-copy>:nth-child(3){animation-delay:.42s}
  .anim-hero .hero-copy>:nth-child(4){animation-delay:.54s}
  .anim-hero .hero-copy>:nth-child(5){animation-delay:.66s}
  .anim-hero .hero-copy>:nth-child(6){animation-delay:.78s}
  .anim-hero .hero h1 em{opacity:0;transform:translateY(.25em);animation:rise 1.05s .38s cubic-bezier(.2,.7,.2,1) forwards}
  .anim-hero .eyebrow-line{transform:scaleX(0);transform-origin:0 50%;animation:grow .9s .3s cubic-bezier(.2,.7,.2,1) forwards}
  .anim-hero .hero-media{animation:fade .5s .1s both;background:#10231f}
  .anim-hero .hero-media img{clip-path:inset(100% 0 0 0);scale:1.14;animation:unveil 1.5s .2s cubic-bezier(.7,0,.2,1) forwards,settle 2.6s .2s cubic-bezier(.2,.7,.2,1) forwards}
  .anim-hero .media-caption{opacity:0;transform:translateY(18px);animation:rise .9s 1.15s cubic-bezier(.2,.7,.2,1) forwards}
  .anim-hero .hero-bottom{opacity:0;animation:fade .8s 1.1s forwards}

  /* „Entdecken“-Pfeil wippt ruhig */
  .hero-bottom a span{display:inline-block;animation:bob 2.4s 2s ease-in-out infinite}

  /* ---------- Beim Scrollen ---------- */
  /* Leistungskarten: die Linienhäuser wachsen von unten */
  .card-art i{transform-origin:50% 100%;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
  .card-art i:nth-child(2){transition-delay:.08s}.card-art i:nth-child(3){transition-delay:.16s}.card-art i:nth-child(4){transition-delay:.24s}.card-art i:nth-child(5){transition-delay:.32s}
  .service-card.motion-pending .card-art i{transform:scaleY(.08)}

  /* Trennlinien zeichnen sich */
  .anim-ready .principles-list article,.anim-ready .journey-steps article{position:relative}
  .anim-ready .principles-list article:not(:first-child){border-top-color:transparent}
  .anim-ready .principles-list article:not(:first-child):before{content:'';position:absolute;left:0;right:0;top:-1px;height:1px;background:#ffffff3b;transform:scaleX(0);transform-origin:0 50%;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
  .anim-ready .principles-list.in-view article:before{transform:scaleX(1)}
  .anim-ready .principles-list article:nth-child(3):before{transition-delay:.2s}
  .anim-ready .journey-steps{border-top-color:transparent;position:relative}
  .anim-ready .journey-steps:before{content:'';position:absolute;left:0;right:0;top:-1px;height:1px;background:#9d7145;transform:scaleX(0);transform-origin:0 50%;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
  .anim-ready .journey-steps.in-view:before{transform:scaleX(1)}
  .anim-ready .journey-steps article>span{opacity:0;transform:translateY(8px);transition:opacity .6s,transform .6s}
  .anim-ready .journey-steps.in-view article>span{opacity:1;transform:none}
  .anim-ready .journey-steps.in-view article:nth-child(2)>span{transition-delay:.35s}
  .anim-ready .journey-steps.in-view article:nth-child(3)>span{transition-delay:.7s}

  /* Überschriften: der kursive Teil folgt leicht versetzt */
  .anim-ready .section-space h2 em{transition:opacity .9s .25s,transform .9s .25s cubic-bezier(.2,.7,.2,1)}
  .anim-ready .motion-pending h2 em,.anim-ready .motion-pending em{opacity:0;transform:translateY(.3em)}

  /* Fruitly-Karte: schwebt ruhig und neigt sich zur Maus */
  .fruitly-card{animation:float 7s ease-in-out infinite;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
  .fruitly-arc{animation:spin 60s linear infinite}
  .fruitly-arc-two{animation-duration:90s;animation-direction:reverse}

  /* Partner: Logo-Kacheln erscheinen nacheinander */
  .anim-ready .partner-list .partner-plate{opacity:0;transform:scale(.94);transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1)}
  .anim-ready .partner-list.in-view .partner-plate{opacity:1;transform:none}
  .anim-ready .partner-list.in-view .partner:nth-child(2) .partner-plate{transition-delay:.18s}

  /* Selbstcheck: jede neue Frage blendet weich ein */
  .q-swap{animation:rise .45s cubic-bezier(.2,.7,.2,1)}

  /* Wasserzeichen „ACURIA“ zieht beim Scrollen leicht mit */
  .principles-watermark{transform:translateX(var(--wm,0px));will-change:transform}
}

@keyframes rise{to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes grow{to{transform:scaleX(1)}}
@keyframes unveil{to{clip-path:inset(0 0 0 0)}}
@keyframes settle{to{scale:1}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -12px}}
@keyframes spin{to{rotate:360deg}}

@media print{.read-progress{display:none}.site-header{position:static}}