/* PONTOSPOOL: dimension and motion within the existing visual system. */
:root{--pp-depth-shadow:0 2px 5px #102b4508,0 16px 38px -22px #102b453d;--pp-depth-raised:0 3px 8px #102b450a,0 24px 44px -22px #102b4545;--pp-depth-ease:cubic-bezier(.2,.65,.3,1)}
.bento-upgrade .bento-card,.pt-step,.bv-karte,.hc-card,.pp-form{box-shadow:var(--pp-depth-shadow),inset 0 1px 0 #ffffff70;transition:box-shadow 220ms var(--pp-depth-ease),border-color 220ms ease}
.bento-upgrade .bento-card.slot-1,.bento-upgrade .bento-card.slot-6,.hc-card{box-shadow:0 18px 48px -28px #061b46a6,inset 0 1px 0 #ffffff24}
.bento-upgrade .bento-card.slot-1{border:1px solid #ffffff26}
.pb-tafel{box-shadow:var(--pp-depth-shadow),inset 0 1px 0 #ffffff38}
.pp-depth-frame{position:relative;overflow:hidden;isolation:isolate;border-radius:inherit;line-height:0;box-shadow:0 14px 32px -22px #102b4566}
.sv-foto>.pp-depth-frame{border-radius:var(--pp-radius-medium,16px)}
.pp-depth-frame:after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff30}
.pp-depth-frame>img{display:block;width:100%;transform:translate3d(0,var(--pp-photo-y,0px),0) scale(1.08);transform-origin:center;box-shadow:none}
.pp-btn-consult .pp-btn-arrow{transition:translate 180ms var(--pp-depth-ease),background-color 180ms ease}
.pp-btn-consult:focus-visible .pp-btn-arrow{translate:3px 0}
.home-faq details[open] p,#faq>details[open] p{animation:pp-detail-in 220ms var(--pp-depth-ease)}
@keyframes pp-detail-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* Existing reveal observer owns visibility; do not add a second animation system. */
.sr-init{transition-timing-function:var(--pp-depth-ease);transition-duration:420ms}
@media(hover:hover) and (pointer:fine){
 .bento-upgrade .bento-card:has(a):hover,.bv-karte:hover{box-shadow:var(--pp-depth-raised),inset 0 1px 0 #ffffff80;border-color:#8abfcf}
 .pp-btn-consult:hover .pp-btn-arrow{translate:3px 0}
 .card-foot a,.pb-jumpnav a{transition:color 180ms ease,text-decoration-color 180ms ease;text-decoration-color:transparent}
 .card-foot a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-color:currentColor}
}
@media(max-width:767px){.pp-depth-frame>img{transform:none}.bento-upgrade .bento-card,.pt-step,.bv-karte{box-shadow:0 8px 22px -16px #102b4538,inset 0 1px 0 #ffffff55}}
@media(prefers-reduced-motion:reduce){.pp-depth-frame>img{transform:none!important}.pp-btn-consult .pp-btn-arrow{translate:none!important;transition:none!important}.home-faq details[open] p,#faq>details[open] p{animation:none}.bento-upgrade .bento-card,.pt-step,.bv-karte,.hc-card,.pp-form{transition:none}}

/* Selected objects sit above the page; the surrounding typography stays still. */
@media(min-width:768px){
 .bento-upgrade .slot-1 .slot1-photo{position:relative;isolation:isolate;overflow:visible;perspective:900px;margin:4px 7px 30px}
 .bento-upgrade .slot-1 .slot1-photo:before{content:'';position:absolute;inset:0;border:1px solid #9bddec70;border-radius:14px;background:#284c64;transform:translate(-9px,8px) rotate(-3deg);z-index:-1;box-shadow:0 12px 24px #051a3638}
 .bento-upgrade .slot1-photo>.pp-depth-frame{transform:rotateY(calc(-4deg + var(--pp-scene-turn,0deg))) rotateX(3deg) rotateZ(calc(1deg + var(--pp-scene-roll,0deg)));box-shadow:8px 18px 25px -14px #020e2999,0 1px 0 #ffffff66 inset;transition:transform 400ms var(--pp-depth-ease)}
 .project-app-section .pa-phone,.project-app-section .pa-phone:hover{animation:none;transform:perspective(1100px) translateY(var(--pp-scene-y,0px)) rotateX(5deg) rotateY(calc(-10deg + var(--pp-scene-turn,0deg))) rotateZ(calc(-2deg + var(--pp-scene-roll,0deg)));box-shadow:12px 8px 0 -3px #254763,26px 32px 46px -22px #05152e80;transition:transform 400ms var(--pp-depth-ease),box-shadow 400ms ease}
 .kunden-app-section .ka-phone,.kunden-app-section .ka-phone:hover{animation:none;transform:perspective(1100px) translateY(var(--pp-scene-y,0px)) rotateX(5deg) rotateY(calc(10deg - var(--pp-scene-turn,0deg))) rotateZ(calc(2deg - var(--pp-scene-roll,0deg)));box-shadow:-10px 6px 0 -3px #213e59,-24px 32px 46px -22px #05152e80;transition:transform 400ms var(--pp-depth-ease)}
 .hs-video .hs-phone{transform:perspective(1100px) translateY(var(--pp-scene-y,0px)) rotateY(calc(-8deg + var(--pp-scene-turn,0deg))) rotateZ(calc(-2deg + var(--pp-scene-roll,0deg)));box-shadow:9px 6px 0 -3px #233e55,22px 30px 40px -22px #061d4680}
}
@media(min-width:768px) and (hover:hover) and (pointer:fine){
 .bento-upgrade .bento-card.pp-tilt:not(.sr-init){transform:perspective(1000px) rotateX(var(--pp-tilt-x,0deg)) rotateY(var(--pp-tilt-y,0deg)) translateY(var(--pp-tilt-lift,0px));transition:transform 240ms var(--pp-depth-ease),box-shadow 240ms ease}
 .bento-upgrade .bento-card.pp-tilt:hover{box-shadow:0 22px 42px -22px #0a274d66,inset 0 1px 0 #ffffffa6}
}
@media(prefers-reduced-motion:reduce){
 .bento-upgrade .bento-card.pp-tilt,.bento-upgrade .slot1-photo>.pp-depth-frame,.project-app-section .pa-phone,.project-app-section .pa-phone:hover,.kunden-app-section .ka-phone,.kunden-app-section .ka-phone:hover,.hs-video .hs-phone{transform:none!important;animation:none!important;transition:none!important}
}

/* The notification occupies a separate depth plane while its phone turns. */
@media(min-width:768px) and (prefers-reduced-motion:no-preference){
 .ka-toast{translate:0 calc(var(--pp-scene-y,0px) * -0.55);transition:translate 180ms ease-out;box-shadow:0 18px 35px -16px #0a274d66}
 .project-app-section .pa-phone,.project-app-section .pa-phone:hover,.kunden-app-section .ka-phone,.kunden-app-section .ka-phone:hover,.bento-upgrade .slot1-photo>.pp-depth-frame{transition:transform 120ms ease-out,box-shadow 220ms ease}
}
@media(prefers-reduced-motion:reduce){.ka-toast{translate:none!important}}

/* Text-only consultation buttons: balanced padding after removing decorative arrows. */
.pp-btn.pp-btn-consult{padding-right:24px;justify-content:center;text-align:center}
@media(max-width:767px){.pp-btn.pp-btn-consult{padding-left:18px;padding-right:18px;justify-content:center}}