.rebrand-wrapper {
    position: relative;
    display: inline-block;
    cursor: pointer;
    perspective: 1200px;
}

/* --- Wrapper Peel Effect --- */
.rebrand-wrapper::before,
.rebrand-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    width: 51%;
    height: 100%;
    background: 
        linear-gradient(170deg, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0.1) 15%, transparent 30%),
        linear-gradient(20deg, rgba(255, 255, 255, 0.3) 5%, transparent 25%),
        radial-gradient(circle at 20% 80%, rgba(255,255,255,0.15) 0%, transparent 20%);
    backdrop-filter: blur(1.5px) brightness(1.2) contrast(0.9);
    -webkit-backdrop-filter: blur(1.5px) brightness(1.2) contrast(0.9);
    z-index: 2;
    transition: transform 0.7s cubic-bezier(0.68, -0.55, 0.265, 1.55), box-shadow 0.7s ease;
}

.rebrand-wrapper::before {
    left: 0;
    transform-origin: left center;
    clip-path: polygon(0% 0%, 100% 0%, 98% 20%, 100% 35%, 97% 55%, 100% 70%, 98% 85%, 100% 100%, 0% 100%);
}

.rebrand-wrapper::after {
    right: 0;
    transform-origin: right center;
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%, 2% 85%, 0% 70%, 3% 55%, 0% 35%, 2% 20%);
    transition-delay: 0.05s;
}

/* Trigger peel on hover OR touch */
.rebrand-wrapper:hover::before,
.rebrand-wrapper.touch-active::before {
    transform: rotateY(80deg) translateX(-45%) translateZ(80px);
    box-shadow: -10px 5px 20px rgba(0,0,0,0.2);
}

.rebrand-wrapper:hover::after,
.rebrand-wrapper.touch-active::after {
    transform: rotateY(-80deg) translateX(45%) translateZ(80px);
    box-shadow: 10px 5px 20px rgba(0,0,0,0.2);
}


/* --- Stabilized Text Transition --- */

/* Old text ("Voidlax") */
.rebrand-wrapper .rebrand-old {
    position: relative;
    z-index: 1;
    color: #909090;
    text-shadow: 
        1px 1px 0 #111, 
        0 0 10px rgba(0,0,0,0.5),
        1px 1px 2px rgba(0,0,0,0.7);
    opacity: 1;
    transition: opacity 0.4s ease;
}

/* Trigger fade-out on hover OR touch */
.rebrand-wrapper:hover .rebrand-old,
.rebrand-wrapper.touch-active .rebrand-old {
    opacity: 0;
}

/* New text ("5ylens") */
.rebrand-wrapper .rebrand-new {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.2s ease;
}

/* Trigger fade-in on hover OR touch */
.rebrand-wrapper:hover .rebrand-new,
.rebrand-wrapper.touch-active .rebrand-new {
    opacity: 1;
    transition: opacity 0.4s ease 0.3s;
}