.scene{perspective:1200px;cursor:pointer;outline:none;flex-shrink:0;width:450px;height:321px}.scene:hover .flip,.scene:focus-within .flip{transform:rotateY(180deg)}.flip{width:100%;height:100%;transform-style:preserve-3d;will-change:transform;backface-visibility:hidden;border:1px solid #f97316;border-radius:1rem;transition:transform .8s cubic-bezier(.23,1,.32,1);position:relative;box-shadow:0 20px 40px #0000004d}.flip.flipped{transform:rotateY(180deg)}.face{backface-visibility:hidden;will-change:transform,opacity;border-radius:1rem;flex-direction:column;display:flex;position:absolute;inset:0;overflow:hidden}.front{background:#fff;border:1px solid #ffffff0f;padding:0;transform:rotateY(0)}.front .front-image{will-change:transform;background-position:50%;background-repeat:no-repeat;background-size:contain;border-radius:1rem;width:100%;height:100%;transition:transform .8s cubic-bezier(.34,1.2,.64,1);transform:scale(1)}.flip.flipped .front .front-image{transform:scale(.22)rotate(0)}.front .front-label{color:#f97316;letter-spacing:.3px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none;z-index:3;background:#ffffffbf;border:1px solid #ea580c;border-radius:40px;padding:.3rem 1.4rem;font-size:.85rem;font-weight:600;position:absolute;bottom:1.2rem;left:1.5rem;box-shadow:0 2px 12px #0000000a}.back{background:#fff;border:1px solid #ea580c;flex-direction:row;justify-content:center;align-items:stretch;gap:0;height:100%;padding:0;display:flex;position:relative;transform:rotateY(180deg);box-shadow:inset 0 0 0 1px #00000005}.back .back-left{background:#fff;border-radius:0 0 0 1.8rem;flex:0 0 50%;justify-content:center;align-items:center;width:50%;height:100%;padding:.6rem;display:flex}.back .back-left .circle-image{aspect-ratio:1;will-change:transform;background-position:top;background-repeat:no-repeat;background-size:cover;border:2px solid #fff;border-radius:100%;flex-shrink:0;width:100%;max-width:200px;transition:transform .9s cubic-bezier(.34,1.2,.64,1);transform:scale(.92);box-shadow:0 6px 16px #0000000a}.flip.flipped .back .back-left .circle-image{border:1px solid #ff4500;transition:transform .9s cubic-bezier(.34,1.2,.64,1);transform:scale(1.08)}.back .back-right{background:#fff;border-radius:0 1.8rem 1.8rem 0;flex-direction:column;flex:0 0 50%;justify-content:center;gap:.9rem;width:50%;height:100%;padding:1.4rem 1.4rem 1.4rem 1rem;display:flex}.back .back-right .info-item{opacity:0;border-bottom:1px solid #00000008;flex-direction:column;align-items:flex-start;width:100%;padding-bottom:.3rem;animation:.9s cubic-bezier(.23,1,.32,1) forwards slideUp;display:flex;transform:translateY(16px)}.back .back-right .info-item:first-child{animation-delay:.1s}.back .back-right .info-item:nth-child(2){animation-delay:1.1s}.back .back-right .info-item:nth-child(3){animation-delay:2.1s}.back .back-right .info-item:nth-child(4){animation-delay:3.1s}.flip.flipped .back .back-right .info-item{animation:.9s cubic-bezier(.23,1,.32,1) forwards slideUp}.flip.flipped .back .back-right .info-item:first-child{animation-delay:.1s}.flip.flipped .back .back-right .info-item:nth-child(2){animation-delay:1.1s}.flip.flipped .back .back-right .info-item:nth-child(3){animation-delay:2.1s}.flip.flipped .back .back-right .info-item:nth-child(4){animation-delay:3.1s}.back .back-right .info-label{text-transform:uppercase;letter-spacing:.8px;color:#6f82a0;margin-bottom:.1rem;font-size:.6rem;font-weight:700}.back .back-right .info-value{color:#ea580c;word-break:break-word;font-size:1rem;font-weight:500;line-height:1.3}.back .back-right .info-value.name{color:#f97316;letter-spacing:-.2px;font-size:1.3rem;font-weight:700}.back .back-right .info-value.designation{color:#ea580c;font-size:1rem;font-weight:400}@keyframes slideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@media (max-width:640px){.scene{width:300px;height:220px}.back-left .circle-image{max-width:90px}.back-right{gap:.6rem;padding:.9rem .9rem .9rem .6rem}.back-right .info-label{font-size:.5rem}.back-right .info-value{font-size:.8rem}.back-right .info-value.name{font-size:1.1rem}.back-right .info-value.designation{font-size:.75rem}.front .front-label{padding:.2rem 1.2rem;font-size:.7rem;bottom:1rem;left:1.2rem}}@media (max-width:400px){.scene{width:260px;height:200px}.back-left .circle-image{max-width:70px}.back-right{gap:.5rem;padding:.6rem .6rem .6rem .4rem}.back-right .info-label{font-size:.45rem}.back-right .info-value{font-size:.7rem}.back-right .info-value.name{font-size:.95rem}.back-right .info-value.designation{font-size:.65rem}.front .front-label{padding:.15rem 1rem;font-size:.6rem;bottom:.8rem;left:1rem}}
