/* MATIJAVELLI — Premium-Effektschicht (additiv auf index.html)
   Kamerafahrten, Whip-in-Headline, Reveal-Tiefe, Löwen-Übergang, Filmkorn. */
:root{--pm-ease:cubic-bezier(.16,.84,.44,1)}

body::before{content:'';position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.035;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}
@media(prefers-reduced-motion:reduce){body::before{display:none}}

/* ===== Hero: einmalige Kamerafahrt auf vorhandenem Bild ===== */
.hero-v2-img{animation:pm-kamera 1400ms var(--pm-ease) 80ms both}
@keyframes pm-kamera{from{transform:scale(1.001)}to{transform:scale(1.06)}}
@media(max-width:760px){.hero-v2-img{animation-duration:1200ms;animation-name:pm-kamera-mobile}}
@keyframes pm-kamera-mobile{from{transform:scale(1.001)}to{transform:scale(1.03)}}

/* ===== Hero-Headline: Masked Directional Split-Text Whip-In ===== */
.hero-whip{overflow:visible}
.whip-line{display:block;overflow:hidden}
.whip-inner{display:inline-block;will-change:transform,filter}
.whip-line-1 .whip-inner{transform:translateX(-105%);filter:blur(6px);animation:pm-whip-l 720ms cubic-bezier(.16,1,.3,1) 180ms both}
.whip-line-2 .whip-inner{transform:translateX(105%);filter:blur(6px);animation:pm-whip-r 760ms cubic-bezier(.16,1,.3,1) 330ms both}
@keyframes pm-whip-l{0%{transform:translateX(-105%);filter:blur(6px)}72%{transform:translateX(8px);filter:blur(0)}100%{transform:translateX(0);filter:blur(0)}}
@keyframes pm-whip-r{0%{transform:translateX(105%);filter:blur(6px)}72%{transform:translateX(-8px);filter:blur(0)}100%{transform:translateX(0);filter:blur(0)}}
@media(max-width:760px){
  .whip-line-1 .whip-inner{animation:pm-whip-l-m 560ms cubic-bezier(.16,1,.3,1) 150ms both}
  .whip-line-2 .whip-inner{animation:pm-whip-r-m 600ms cubic-bezier(.16,1,.3,1) 260ms both}
  @keyframes pm-whip-l-m{from{transform:translateX(-45%);filter:blur(4px)}to{transform:translateX(0);filter:blur(0)}}
  @keyframes pm-whip-r-m{from{transform:translateX(45%);filter:blur(4px)}to{transform:translateX(0);filter:blur(0)}}
}
.sub-whip{overflow:hidden}
.sub-whip .whip-inner{display:inline-block;transform:translateX(-40px);opacity:0;animation:pm-sub-whip 620ms cubic-bezier(.16,1,.3,1) 980ms both}
@keyframes pm-sub-whip{to{transform:translateX(0);opacity:1}}

/* ===== Vorhandene Reveal-Bilder: sanfte Tiefe beim Einblenden (nutzt bestehende .visible-Klasse) ===== */
.cn-perf-frame img,.cn-autor-figure img,.cn-about-photo img{transition:none}
.cn-perf-figure.fade-in .cn-perf-frame img{transform:scale(1)}
.cn-autor-figure.fade-in img{transform:scale(1.045);transition:transform .8s var(--pm-ease)}
.cn-autor-figure.fade-in.visible img{transform:scale(1)}
.cn-perf-frame{overflow:hidden}
.cn-perf-frame::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 42%,rgba(244,241,236,.35) 50%,transparent 58%);transform:translateX(-140%);opacity:0}
.cn-perf-figure.fade-in.visible .cn-perf-frame::after{animation:cn-perf-sweep 1.4s ease-out .3s both}
@keyframes cn-perf-sweep{0%{transform:translateX(-140%);opacity:0}15%{opacity:1}60%{opacity:1}100%{transform:translateX(140%);opacity:0}}
.cn-perf-figure.fade-in.visible .cn-perf-frame img{animation:cn-perf-kenburns 6s cubic-bezier(.25,.46,.45,.94) .2s both}
@keyframes cn-perf-kenburns{0%{transform:scale(1)}100%{transform:scale(1.09)}}
.cn-about-photo.fade-in img{transform:scale(1.045)}
.cn-about-photo.fade-in.visible img{transform:scale(1)}

/* ===== Autorenbild: vollständiges Motiv statt hartem Beschnitt (responsive Bildzuschnitt-Korrektur) ===== */
.cn-autor-figure img{object-fit:contain;background:#0b0c0d}
@media(max-width:900px){.cn-autor-figure img{object-fit:cover;object-position:50% 30%}}

/* ===== Kapitelnummern: dezente typografische Animation beim Einblenden ===== */
.cn-offer-grid.fade-in .cn-offer-no{opacity:0;transform:translateY(6px)}
.cn-offer-grid.fade-in.visible .cn-offer-no{opacity:1;transform:translateY(0);transition:opacity .5s ease,transform .5s var(--pm-ease)}
.cn-offer-grid.visible a:nth-child(1) .cn-offer-no{transition-delay:0s}
.cn-offer-grid.visible a:nth-child(2) .cn-offer-no{transition-delay:.08s}
.cn-offer-grid.visible a:nth-child(3) .cn-offer-no{transition-delay:.16s}

/* ===== Angebotskarten: hochwertiger Hover-/Fokuszustand ===== */
.cn-offer-card{transition:background .2s ease,transform .2s ease,box-shadow .2s ease}
.cn-offer-card:hover,.cn-offer-card:focus-visible{transform:translateY(-3px);box-shadow:0 14px 28px rgba(11,12,13,.12)}
.cn-offer-card.featured:hover,.cn-offer-card.featured:focus-visible{box-shadow:0 14px 32px rgba(0,0,0,.4)}

/* ===== Buttons: Linienbewegung (kein neues Markup nötig) ===== */
.cn-btn-dark{position:relative;transition:color .2s ease;animation:cn-btn-glow 3.2s ease-in-out infinite}
@keyframes cn-btn-glow{0%,100%{text-shadow:none}50%{text-shadow:0 0 12px rgba(244,241,236,.75)}}
@media(prefers-reduced-motion:reduce){.cn-btn-dark{animation:none}}
.cn-btn-dark::after{content:'';position:absolute;left:0;bottom:-2px;width:0;height:1px;background:currentColor;transition:width .2s var(--pm-ease)}
.cn-btn-dark:hover::after,.cn-btn-dark:focus-visible::after{width:100%}

@media(min-width:761px){.cn-perf-frame img,.cn-autor-figure img,.cn-about-photo img{will-change:transform}}

/* ===================================================================
   DREI WELTEN — einzige neue strukturelle Ergänzung (freigegeben)
   =================================================================== */
.pm-worlds{background:#0b0c0d;padding:clamp(56px,8vw,96px) clamp(20px,5vw,80px);border-top:1px solid rgba(244,241,236,.08)}
.pm-worlds-inner{max-width:1140px;margin:0 auto}
.pm-worlds-head{font-family:'DM Mono',monospace;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(244,241,236,.4);margin:0 0 28px}
.pm-world-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(244,241,236,.12);border:1px solid rgba(244,241,236,.12)}
@media(max-width:820px){.pm-world-grid{grid-template-columns:1fr}}
.pm-world-card{display:block;background:#0b0c0d;text-decoration:none;color:#f4f1ec;position:relative}
.pm-world-media{position:relative;overflow:hidden;aspect-ratio:4/5}
.pm-world-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--pm-ease)}
.pm-world-card:hover .pm-world-media img,.pm-world-card:focus-visible .pm-world-media img{transform:scale(1.055)}
.pm-world-body{padding:22px}
.pm-world-num{font-family:'Anton',sans-serif;font-size:1.3rem;color:#c9a36b;opacity:.65;display:block;margin-bottom:6px}
.pm-world-card b{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:1.05rem;display:block;margin-bottom:6px;letter-spacing:.01em}
.pm-world-desc{color:rgba(244,241,236,.62);font-size:.88rem;line-height:1.5;display:block;margin-bottom:10px}
.pm-world-arrow{display:inline-block;color:#3aa6a0;transition:transform .2s ease}
.pm-world-card:hover .pm-world-arrow,.pm-world-card:focus-visible .pm-world-arrow{transform:translateX(5px)}
.pm-world-card:focus-visible{outline:2px solid #3aa6a0;outline-offset:-2px}

/* ===== Reduced Motion: keine Kamerafahrt/Maske/Tiefe, nur kurze Überblendungen ===== */
@media(prefers-reduced-motion:reduce){
  .hero-v2-img{animation:none!important;transform:none!important}
  .whip-inner{animation:pm-whip-fade 400ms ease both!important;transform:none!important;filter:none!important}
  @keyframes pm-whip-fade{from{opacity:0}to{opacity:1}}
  .sub-whip .whip-inner{animation:pm-whip-fade 400ms ease both!important;transform:none!important}
  .cn-perf-frame img,.cn-autor-figure img,.cn-about-photo img{transition:opacity .2s ease!important;transform:none!important;animation:none!important}
  .cn-perf-frame::after{display:none!important}
  .cn-offer-grid.fade-in .cn-offer-no{opacity:1!important;transform:none!important;transition:none!important}
  .cn-offer-card:hover,.cn-offer-card:focus-visible{transform:none}
  .pm-world-media img{transition:none!important;transform:none!important}
  .pm-world-arrow{transition:none!important}
}

/* Hero Zeile 1: Schreibmaschine */
.tw-ch{display:inline-block;white-space:pre;opacity:0;animation:pm-tw 140ms cubic-bezier(.2,.9,.3,1.2) both}
@keyframes pm-tw{0%{opacity:0;transform:translateY(-.18em) scale(1.35)}60%{opacity:1}100%{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.tw-ch{animation:none;opacity:1}}
.tw-wait .tw-ch{animation:none;opacity:0}
@media(prefers-reduced-motion:reduce){.tw-wait .tw-ch{opacity:1}}
.zoom-whip .zw-inner{display:inline-block;transform-origin:left center;opacity:0;transform:scale(.6)}
.zoom-whip.zw-go .zw-inner{animation:pm-zw 900ms cubic-bezier(.2,.9,.25,1) both}
@keyframes pm-zw{0%{opacity:0;transform:scale(.6);filter:blur(6px)}35%{opacity:1;transform:scale(1.18);filter:blur(0)}60%{transform:scale(.94)}80%{transform:scale(1.04)}100%{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.zoom-whip .zw-inner{opacity:1;transform:none;animation:none!important}}