.cube-container {
            perspective: 1000px;
            width: 300px;
            height: 300px;
            margin: 0 auto 5rem;
        }.cube {
            width: 100%;
            height: 100%;
            position: relative;
            transform-style: preserve-3d;
            animation: rotate 20s infinite linear;
        }.cube-face {
            position: absolute;
            width: 100%;
            height: 100%;
            border: 2px solid rgba(255, 107, 53, 0.5);
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 1.2rem;
            text-align: center;
            padding: 2rem;
            background: rgba(10, 10, 10, 0.7);
            backdrop-filter: blur(5px);
            box-shadow: inset 0 0 30px rgba(255, 107, 53, 0.2);
        }.cube-face:nth-child(1) { transform: rotateY(0deg) translateZ(150px); }.cube-face:nth-child(2) { transform: rotateY(90deg) translateZ(150px); }.cube-face:nth-child(3) { transform: rotateY(180deg) translateZ(150px); }.cube-face:nth-child(4) { transform: rotateY(-90deg) translateZ(150px); }.cube-face:nth-child(5) { transform: rotateX(90deg) translateZ(150px); }.cube-face:nth-child(6) { transform: rotateX(-90deg) translateZ(150px); }.cube-face:nth-child(2) .txt {
    transform: rotateZ(180deg);
}.cube-face:nth-child() .txt {
    transform: rotateZ(180deg);
}@media (max-width: 480px) {

            .hero h1 {
                font-size: 2rem;
            }

            .orb-container {
                gap: 1rem;
            }

            .orb {
                width: 80px;
                height: 80px;
                font-size: 0.8rem;
            }

            .section-title {
                font-size: 2rem;
            }

            .cube-container {
                width: 200px;
                height: 200px;
            }

            .cube-face {
                font-size: 1rem;
                padding: 1rem;
            }

            .nav-toggle {
                width: 50px;
                height: 50px;
            }

.nav-line {
    width: 25px;
    height: 2.5px;
    margin: 2px 0;
}

        }@keyframes cubePresentFaces {
            /* Open by Design — hold */
            0%, 13% {
                transform: rotateX(0deg) rotateY(0deg);
            }
            /* Turn to Efficiency First */
            16.666%, 29.666% {
                transform: rotateX(0deg) rotateY(-90deg);
            }
            /* Turn to Privacy Built-In */
            33.333%, 46.333% {
                transform: rotateX(0deg) rotateY(-180deg);
            }
            /* Turn to Sustainable */
            50%, 63% {
                transform: rotateX(0deg) rotateY(-270deg);
            }
            /* Turn upward face toward screen */
            66.666%, 79.666% {
                transform: rotateX(-90deg) rotateY(-360deg);
            }
            /* Turn downward face toward screen */
            83.333%, 96.333% {
                transform: rotateX(90deg) rotateY(-360deg);
            }
            /* Return smoothly to the first face */
            100% {
                transform: rotateX(0deg) rotateY(-360deg);
            }
        }.cube {
            animation: cubePresentFaces 24s cubic-bezier(.65, 0, .35, 1) infinite;
            transform-origin: 50% 50%;
            will-change: transform;
        }.cube-face {
            backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
        }.cube-face .txt,
        .cube-face:nth-child(2) .txt,
        .cube-face:nth-child(3) .txt,
        .cube-face:nth-child(4) .txt,
        .cube-face:nth-child(5) .txt,
        .cube-face:nth-child(6) .txt {
            transform: none;
        }.cube-container:hover .cube,
        .cube-container:focus-within .cube {
            animation-play-state: paused;
        }@media (prefers-reduced-motion: reduce) {
            .cube {
                animation: none !important;
                transform: rotateX(0deg) rotateY(0deg) !important;
                will-change: auto;
            }
        }@keyframes cubePresentFacesFast {
            0%, 11% {
                transform: rotateX(0deg) rotateY(0deg);
            }
            16.666%, 27.666% {
                transform: rotateX(0deg) rotateY(-90deg);
            }
            33.333%, 44.333% {
                transform: rotateX(0deg) rotateY(-180deg);
            }
            50%, 61% {
                transform: rotateX(0deg) rotateY(-270deg);
            }
            66.666%, 77.666% {
                transform: rotateX(-90deg) rotateY(-360deg);
            }
            83.333%, 94.333% {
                transform: rotateX(90deg) rotateY(-360deg);
            }
            100% {
                transform: rotateX(0deg) rotateY(-360deg);
            }
        }.cube {
            animation: cubePresentFacesFast 12s cubic-bezier(.72, 0, .28, 1) infinite;
        }.cube-container {
    filter: drop-shadow(0 24px 34px rgba(0,0,0,.48));
}.cube-face {
    background: linear-gradient(145deg,#171717 0%,#0d0d0d 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255,107,53,.58);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.025),
        inset 0 0 34px rgba(255,107,53,.07);
}.cube-face .txt {
    color: rgba(248,249,250,.94);
    text-shadow: 0 2px 10px rgba(0,0,0,.65);
}.cube-face .txt i {
    color: var(--phoenix-orange);
    margin-right: .35rem;
}
