/* Custom styles for Premium Furniture Website */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Montserrat:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&display=swap');

:root {
    --primary: #003B46; /* Royal Emerald */
    --secondary: #C5A059; /* Soft Gold */
    --accent: #C5A059;
    --royal-bg: #F9F7F2;
    --text-main: #2D2926;
    --text-muted: #6B7280;
}

body {
    font-family: 'Inter', sans-serif;
    color: var(--text-main);
    background-color: var(--royal-bg);
}

h1, h2, h3, h4, .serif {
    font-family: 'Playfair Display', serif;
}

/* Glassmorphism */
.glass {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
}

.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }

/* Transitions */
.transition-soft {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Product Card Hover */
.product-card:hover .product-image {
    transform: scale(1.05);
}

.product-card:hover .quick-view {
    opacity: 1;
    transform: translateY(0);
}

.vertical-text {
    writing-mode: vertical-rl;
    text-orientation: mixed;
}

/* Luxury Light Sweep Animation */
.royal-light-sweep {
    position: relative;
    overflow: hidden;
}
.royal-light-sweep::before {
    content: '';
    position: absolute;
    top: -100%;
    left: -100%;
    width: 300%;
    height: 300%;
    background: radial-gradient(circle at center, rgba(197, 160, 89, 0.12) 0%, transparent 60%);
    animation: lightSweep 20s infinite ease-in-out;
    pointer-events: none;
}

@keyframes lightSweep {
    0% { transform: translate(-20%, -20%); }
    50% { transform: translate(10%, 10%); }
    100% { transform: translate(-20%, -20%); }
}

/* Samsung One UI Inspired Royal Animations */
:root {
    --spring-easing: cubic-bezier(0.34, 1.56, 0.64, 1);
    --fluid-easing: cubic-bezier(0.65, 0, 0.35, 1);
}

.royal-glass {
    background: rgba(0, 59, 70, 0.85);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(197, 160, 89, 0.1);
}

.one-ui-shadow {
    box-shadow: 0 12px 40px -12px rgba(0, 0, 0, 0.1);
}

.spring-hover {
    transition: transform 0.6s var(--spring-easing), box-shadow 0.6s var(--spring-easing);
}
.spring-hover:hover {
    transform: scale(1.02);
}
.spring-hover:active {
    transform: scale(0.98);
}

.stagger-reveal > * {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.8s var(--spring-easing);
}
.stagger-reveal.active > * {
    opacity: 1;
    transform: translateY(0);
}
.stagger-reveal.active > *:nth-child(1) { transition-delay: 0.1s; }
.stagger-reveal.active > *:nth-child(2) { transition-delay: 0.2s; }
.stagger-reveal.active > *:nth-child(3) { transition-delay: 0.3s; }
.stagger-reveal.active > *:nth-child(4) { transition-delay: 0.4s; }

/* Timeline Reveal */
.timeline-line-active {
    height: 100%;
}

.serif-italic {
    font-family: 'Playfair Display', serif;
    font-style: italic;
}

.letter-spacing-xl {
    letter-spacing: 0.5em;
}

/* Image Parallax Hint */
.parallax-hover {
    transition: transform 0.8s cubic-bezier(0.2, 1, 0.3, 1);
}
.parallax-hover:hover {
    transform: scale(1.02) translateY(-10px);
}

/* Imperial Standard Utilities */
.rounded-imperial { border-radius: 60px; }
.shadow-royal { box-shadow: 0 40px 100px -20px rgba(0, 59, 70, 0.15); }
.text-gold { color: var(--secondary); }

/* Editorial Reveal Animation */
.editorial-reveal {
    opacity: 0;
    transform: translateY(60px) scale(0.98);
    transition: all 1.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.editorial-reveal.active {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.scroll-reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.scroll-reveal.active {
    opacity: 1;
    transform: translateY(0);
}

.bg-texture {
    background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23003b46' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2v-4h4v-2h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2v-4h4v-2H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}