@import url('colors.css');

body { background-color: var(--dark); color: #fff; overflow-x: hidden; }
.reveal { opacity: 0; transform: translateY(100px); transition: all 1.4s cubic-bezier(0.16, 1, 0.3, 1); }
.reveal.active { opacity: 1; transform: translateY(0); }

.text-outline { -webkit-text-stroke: 1px rgba(255,255,255,0.15); color: transparent; transition: all 0.6s ease; }
.text-outline:hover { -webkit-text-stroke: 1.5px var(--brand); color: var(--brand); }

.parallax-node { will-change: transform; transition: transform 0.1s linear; }
.glass-header { background: rgba(5, 5, 5, 0.7); backdrop-filter: blur(30px); border-bottom: 1px solid rgba(255,255,255,0.05); }

.review-card { flex: 0 0 350px; min-width: 350px; max-width: 350px; white-space: normal; background: var(--surface); border: 1px solid rgba(255,255,255,0.05); }
@media (min-width: 768px) { .review-card { flex: 0 0 550px; min-width: 550px; max-width: 550px; } }

.image-reveal-container { clip-path: inset(100% 0 0 0); transition: clip-path 1.5s cubic-bezier(0.77, 0, 0.175, 1); }
.image-reveal-container.active { clip-path: inset(0 0 0 0); }

.no-scroll { overflow: hidden; }
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-thumb { background: var(--brand); }

.bg-grid { background-image: radial-gradient(circle, rgba(255,45,85,0.06) 1px, transparent 1px); background-size: 80px 80px; }

.logo-main { transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1); transform-origin: left center; }
.logo-main:hover { transform: scale(1.4) rotate(-3deg); filter: drop-shadow(0 0 20px rgba(255,45,85,0.5)); }

.btn-magnetic { transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1); }
.btn-magnetic:hover { transform: translateY(-5px) scale(1.02); }

.social-icon { transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55); }
.social-icon:hover { color: var(--brand); transform: translateY(-8px) scale(1.2) rotate(8deg); }

.aumatex-logo-anim { animation: aumatex-pulse 3s infinite ease-in-out; }
@keyframes aumatex-pulse { 0%, 100% { filter: grayscale(1) opacity(0.5); } 50% { filter: grayscale(0) opacity(1); transform: scale(1.05); } }

#cookie-optional:checked + span {
    transform: translateX(1.5rem);
    background-color: var(--brand);
}