/* WKC: restrained dimensional photography and tactile interactions. */
.hero{overflow:hidden}
.hero h1{text-shadow:0 2px 1px #100b0b40,0 12px 36px #100b0b38}
.portfolio-tile,.case-image,.founder-image img{box-shadow:0 14px 30px -20px #15131365}
@media(prefers-reduced-motion:no-preference){
 .button{transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
 .button:focus-visible{transform:translateY(-3px);box-shadow:0 8px 0 -4px #780c20,0 15px 25px -12px #0005}
 .button:active{transform:translateY(1px)}
}
@media(hover:hover) and (pointer:fine) and (min-width:900px) and (prefers-reduced-motion:no-preference){
 .hero-media{inset:-24px;transform:translate3d(var(--hero-x,0px),var(--hero-y,0px),0) scale(1.035);transition:transform .65s ease-out}
 .hero-inner{transform:perspective(1400px) rotateY(var(--hero-rotate,0deg));transition:transform .65s ease-out}
 .depth-card{position:relative;transform:perspective(1200px) rotateX(var(--depth-x,0deg)) rotateY(var(--depth-y,0deg)) translateY(var(--depth-lift,0px));transition:transform .35s ease-out,box-shadow .35s ease-out}
 .depth-card.is-depth-active{z-index:3;box-shadow:0 26px 45px -18px #15131355}
 .depth-card::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:4;background:radial-gradient(circle at var(--shine-x,50%) var(--shine-y,50%),#ffffff24,transparent 55%);opacity:0;transition:opacity .3s}
 .depth-card.is-depth-active::before{opacity:1}
 .button:hover{transform:translateY(-3px);box-shadow:0 8px 0 -4px #780c20,0 15px 25px -12px #0005}
 .button:active{transform:translateY(1px);box-shadow:none}
}