/* Isaac3D page — hero emoji + panel demo stage (extends shared style.css) */

.hero-logo-emoji {
    font-size: 72px;
    line-height: 1;
    margin-bottom: 14px;
    filter: drop-shadow(0 0 22px rgba(255, 0, 200, 0.55));
    animation: logoBob 4s ease-in-out infinite;
}

.phys-stage {
    position: relative;
    width: min(460px, 92vw);
    margin: 2.2rem auto 0.6rem;
    border-radius: var(--radius-lg);
    border: 2px solid rgba(255, 0, 200, 0.3);
    background: #0d0d14;
    overflow: hidden;
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.4),
        0 0 60px rgba(255, 0, 200, 0.18),
        0 0 100px rgba(123, 47, 247, 0.1);
    animation: breatheGlow 4s ease-in-out infinite;
}

.phys-video,
.phys-stage img {
    display: block;
    width: 100%;
    height: auto;
}

/* little falling dots in the frame corners, just for flavour */
.phys-drops { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.drop {
    position: absolute;
    top: -10px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ff00c8, #7b2ff7);
    opacity: 0.55;
    animation: dropFall 3.6s cubic-bezier(0.55, 0, 1, 0.45) infinite;
}
.drop.d1 { left: 4%;  animation-delay: 0s;   }
.drop.d2 { left: 8%;  animation-delay: 1.3s; width: 4px; height: 4px; }
.drop.d3 { left: 93%; animation-delay: 0.6s; }
.drop.d4 { left: 96%; animation-delay: 2.1s; width: 4px; height: 4px; }
.drop.d5 { left: 2%;  animation-delay: 2.8s; width: 5px; height: 5px; }

@keyframes dropFall {
    0%   { transform: translateY(0); opacity: 0; }
    10%  { opacity: 0.6; }
    100% { transform: translateY(105vh); opacity: 0; }
}

.phys-caption {
    color: var(--text-secondary);
    font-size: 0.72rem;
    letter-spacing: 1px;
    margin: 0 0 2rem;
}
.phys-caption a { color: var(--tt-pink); }

@media (max-width: 640px) {
    .phys-stage { margin-top: 1.6rem; }
}