@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;600;700;900&display=swap');

body {
    font-family: 'Space Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Outlined Background Text Layer */
.bg-outline-text {
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(255, 255, 255, 0.45);
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
}

/* Golden Radial Wave Ripple Overlay */
.bg-radial-ripple-gold {
    background: radial-gradient(circle at center, rgba(212, 175, 55, 0.35) 0%, rgba(0, 0, 0, 0.6) 50%, transparent 100%);
    transform: scale(1.5);
    transition: transform 0.7s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.7s ease-in-out;
}

.ripple-active {
    opacity: 1 !important;
    transform: scale(0.8);
}

/* Movie Style Background Gold Vignette */
.bg-gold-vignette {
    background: radial-gradient(circle at center, transparent 30%, rgba(212, 175, 55, 0.12) 80%, rgba(0, 0, 0, 0.5) 100%);
}

/* --- CLICK TO EXPAND GALLERY GRID --- */

.gallery-panel {
    background-size: cover;
    background-position: center;
}

.gallery-panel.gallery-active {
    flex: 3 !important;
    border-color: #D4AF37 !important;
}

@media (max-width: 1023px) {
    .gallery-panel.gallery-active {
        flex: 2.2 !important;
    }
}

.gallery-panel.gallery-active .gallery-description {
    max-height: 120px;
    opacity: 1;
}

/* Vertical text orientation on desktop when contracted */
@media (min-width: 1024px) {
    .gallery-panel:not(.gallery-active) .gallery-title {
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        margin-top: 0.5rem;
        margin-bottom: 0 !important;
    }
    .gallery-panel.gallery-active .gallery-title {
        writing-mode: horizontal-tb;
        transform: none;
    }
}

/* --- CREATIVE PROCESS TAB ACTIVE STATE --- */

.active-process-tab {
    border-color: #D4AF37 !important;
    background-color: rgba(212, 175, 55, 0.08);
}

.active-process-tab span:first-child {
    color: #D4AF37 !important;
}

.active-process-tab span:last-child {
    opacity: 1 !important;
}

/* --- SCROLL REVEAL & FLOATING ANIMATIONS --- */

.reveal-on-scroll {
    opacity: 0;
    transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.reveal-on-scroll[data-reveal="up"] {
    transform: translateY(32px);
}

.reveal-on-scroll[data-reveal="left"] {
    transform: translateX(-40px);
}

.reveal-on-scroll.is-revealed {
    opacity: 1;
    transform: translate(0, 0);
}

@keyframes floatSlow {
    0%, 100% { transform: translateY(0px) rotate(-6deg); }
    50% { transform: translateY(-12px) rotate(-4deg); }
}

@keyframes floatReverse {
    0%, 100% { transform: translateY(0px) rotate(6deg); }
    50% { transform: translateY(12px) rotate(4deg); }
}

.animate-float-slow {
    animation: floatSlow 6s ease-in-out infinite;
}

.animate-float-reverse {
    animation: floatReverse 7s ease-in-out infinite;
}