/*
© 2025 AltiBedrift – Levert av Haut Forvalting AS.
*/

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
    .text-shadow-sharp { text-shadow: 0 0 1px rgba(0,0,0,0.05); }
    .text-sharp-8k { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: geometricPrecision; text-shadow: 0 1px 2px rgba(0,0,0,0.1); }
    
    /* GLOBAL CTA LUXURY CLASS (Champagne 3D Etched) */
    .cta-lux {
        @apply inline-flex items-center justify-center gap-4 px-8 py-4 md:px-10 md:py-5
               text-sm md:text-base font-serif font-bold uppercase tracking-widest
               rounded-sm
               bg-gradient-to-r from-[#F9F1D8] via-[#D4AF37] to-[#B49020]
               bg-[length:200%_auto]
               text-[#020617]
               shadow-[0_10px_25px_rgba(212,175,55,0.25)]
               transition-all duration-500 ease-out
               relative overflow-hidden z-10 border border-white/50 cursor-pointer;
        text-shadow: 0 1px 0 rgba(255,255,255,0.4);
        box-shadow: 
            inset 0 1px 0 rgba(255,255,255,0.8),
            inset 0 0 5px rgba(255,255,255,0.3),
            0 4px 15px rgba(0,0,0,0.4);
    }

    .cta-lux:hover {
        @apply shadow-[0_20px_35px_rgba(212,175,55,0.4)] -translate-y-1 bg-right;
        box-shadow: 
            inset 0 1px 0 rgba(255,255,255,1),
            0 15px 30px -5px rgba(184, 134, 11, 0.5),
            0 0 20px rgba(212, 175, 55, 0.5);
    }

    .cta-arrow {
        @apply transition-transform duration-300 ease-out inline-block text-lg leading-none pb-0.5;
    }

    .cta-lux:hover .cta-arrow {
        @apply translate-x-2;
    }
    
    /* Legacy support */
    .btn-champagne { @apply cta-lux; }
    .btn-primary-sm { @apply inline-block px-6 py-3 border border-navy/20 text-navy font-bold text-xs uppercase tracking-widest hover:bg-navy hover:text-white transition-all rounded-sm; }

    .glass-card { @apply bg-white/80 backdrop-blur-xl border border-white shadow-xl transition-all duration-500 hover:bg-white; }
    .glass-panel-etched { @apply bg-white/10 backdrop-blur-md border border-white/20 shadow-lg; }
    
    .glass-form-elite {
        @apply bg-[#020617]/90 backdrop-blur-2xl relative overflow-hidden rounded-sm z-[50];
        border-top: 1px solid rgba(255,255,255,0.15);
        border-left: 1px solid rgba(255,255,255,0.1);
        border-right: 1px solid rgba(0,0,0,0.8);
        border-bottom: 1px solid rgba(0,0,0,0.8);
        box-shadow: 
            inset 0 0 20px rgba(0,0,0,0.5),
            0 25px 50px -12px rgba(0, 0, 0, 0.7);
    }
    
    .prose-luxury p { @apply border-l-[3px] border-bronze pl-6 my-6 leading-loose text-navy font-medium text-lg relative; }
    .image-overlay-gradient { background: linear-gradient(to top, rgba(8,12,23,0.95) 0%, rgba(8,12,23,0.3) 60%, transparent 100%); }
    
    .input-line {
        @apply w-full bg-transparent border-b border-white/20 text-white pb-2 outline-none focus:border-gold transition-all duration-300 relative z-10 font-light tracking-wide;
        background-color: transparent !important; 
    }
    
    .floating-label {
        @apply absolute left-0 top-4 text-white/40 text-sm transition-all cursor-text pointer-events-none font-serif italic;
    }

    .input-line:focus ~ .floating-label,
    .input-line:not(:placeholder-shown) ~ .floating-label {
        @apply -top-2 text-gold text-xs not-italic font-sans font-bold tracking-widest uppercase;
    }
    
    /* Autofill Override */
    input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
        -webkit-box-shadow: 0 0 0 30px #020617 inset !important; -webkit-text-fill-color: white !important; transition: background-color 5000s ease-in-out 0s;
    }
    
    .text-glow-dark { text-shadow: 0 2px 4px rgba(0,0,0,0.8); }
    
    .card-3d { 
        @apply relative bg-white border-t-[6px] border-bronze shadow-2xl transition-all duration-700;
        transform-style: preserve-3d;
        transform: perspective(1000px) rotateX(0deg) translateY(0);
    }
    .card-3d:hover {
        transform: perspective(1000px) rotateX(2deg) translateY(-10px);
        box-shadow: 0 30px 60px -12px rgba(118, 102, 69, 0.25);
    }
    
    /* Mobile Menu */
    #mobile-menu-toggle { z-index: 101 !important; }
    #mobile-menu-overlay { z-index: 100 !important; }
    #mobile-menu-toggle.open .menu-bar-1 { transform: rotate(45deg) translate(5px, 5px); }
    #mobile-menu-toggle.open .menu-bar-2 { transform: rotate(-45deg) translate(4px, -5px); width: 100%; }
    .mobile-link { transition-delay: calc(var(--delay) * 100ms); }
}

html {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
}

body {
    background-color: #f5f5f0;
}

::selection {
    background: #D4AF37; /* Gold */
    color: #0B1120; /* Navy */
}

::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: #0B1120;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom, #766645, #D4AF37);
    border-radius: 3px;
}