:root {
            /* Twilight Elegance Palett - Täiuslik harmoonia */
            --c-bg: #110F0D;           
            --c-charcoal: #1A1715;     
            --c-surface: #221D1A;      
            --c-cream: #FDFBF7;        
            --c-muted: #A89E95;        
            --c-amber: #E65C00;        
            --c-gold: #DCA773;         
            
            --f-serif: 'Cormorant Garamond', serif;
            --f-sans: 'Plus Jakarta Sans', sans-serif;
            --max-w: 1550px;
            
            /* Fluid Spacing & Typography - Täiuslikud proportsioonid igal ekraanil */
            --sp-section: clamp(8rem, 12vw, 16rem);
            --sp-element: clamp(2.5rem, 4vw, 5rem);
            --text-h1: clamp(4.5rem, 8vw, 7.5rem);
            --text-h2: clamp(3.2rem, 5vw, 5.5rem);
            --text-h3: clamp(1.8rem, 3vw, 2.6rem);
            --text-p: clamp(1.05rem, 1.2vw, 1.25rem);
            
            --transition: all 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
        }

        * { margin: 0; padding: 0; box-sizing: border-box; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
        
        html, body {
            background-color: var(--c-bg); color: var(--c-cream);
            font-family: var(--f-sans); font-weight: 300;
            overflow-x: hidden; scroll-behavior: smooth;
        }

        /* Kinemaatiline tekstuur atmosfääri loomiseks (Film Grain) */
        body_old::before {
            content: ""; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
            opacity: 0.035; z-index: 9999; pointer-events: none;
        }

        /* --- PRELOADER (Luksuslik sissejuhatus) --- */
        #preloader {
            position: fixed; top: 0; left: 0; width: 100%; height: 100%;
            background: var(--c-bg); z-index: 100000;
            display: flex; justify-content: center; align-items: center;
            transition: opacity 1s ease, visibility 1s ease;
        }
        #preloader img { height: 240px; animation: pulseLogo 2.5s infinite alternate ease-in-out; filter: drop-shadow(0 0 30px rgba(220,167,115,0.15)); }
        body.loaded #preloader { opacity: 0; visibility: hidden; }
        @keyframes pulseLogo { 0% { transform: scale(0.95); opacity: 0.6; } 100% { transform: scale(1.05); opacity: 1; } }

        /* Kuldne Custom Cursor */
        .cursor-aura {
            position: fixed; top: 0; left: 0; width: 45px; height: 45px;
            border-radius: 50%; border: 1px solid rgba(220, 167, 115, 0.6);
            transform: translate(-50%, -50%); pointer-events: none; z-index: 10000;
            transition: width 0.3s, height 0.3s, background 0.3s; mix-blend-mode: screen;
            backdrop-filter: blur(2px);
        }
        @media (max-width: 1024px) { .cursor-aura { display: none; } }

        ::-webkit-scrollbar { width: 4px; }
        ::-webkit-scrollbar-track { background: var(--c-bg); }
        ::-webkit-scrollbar-thumb { background: var(--c-gold); border-radius: 10px; }

        .container { width: 100%; max-width: var(--max-w); margin: 0 auto; padding: 0 clamp(2rem, 5vw, 4rem); position: relative; z-index: 10; }

        /* Järkjärguline elementide ilmumine */
        .reveal { opacity: 0; transform: translateY(50px); transition: all 1.2s cubic-bezier(0.16, 1, 0.3, 1); }
        .reveal.active { opacity: 1; transform: translateY(0); }
        .reveal-delay-1 { transition-delay: 0.1s; }
        .reveal-delay-2 { transition-delay: 0.2s; }
        .reveal-delay-3 { transition-delay: 0.3s; }

        /* Sädemed */
        .embers-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; overflow: hidden; }
        .ember-particle { position: absolute; background: radial-gradient(circle, rgba(230,92,0,0.8) 0%, rgba(19,17,16,0) 70%); border-radius: 50%; bottom: -20px; opacity: 0; animation: floatUp 12s infinite linear; }
        @keyframes floatUp { 0% { transform: translateY(0) scale(0.5); opacity: 0; } 20% { opacity: 0.5; } 80% { opacity: 0.2; } 100% { transform: translateY(-120vh) scale(1.6); opacity: 0; } }

        /* --- PÄIS JA NAVIGATSIOON --- */
        header.nav-monolith {
            position: fixed; top: 0; width: 100%; z-index: 1000; padding: clamp(1.5rem, 3vw, 3rem) 0; transition: var(--transition);
            background: linear-gradient(to bottom, rgba(17,15,13,0.95) 0%, rgba(17,15,13,0) 100%);
        }
        header.nav-monolith.scrolled {
            padding: clamp(0.8rem, 1.5vw, 1.2rem) 0; background: rgba(17, 15, 13, 0.98);
            border-bottom: 1px solid rgba(255, 255, 255, 0.05); backdrop-filter: blur(25px);
            box-shadow: 0 10px 30px rgba(0,0,0,0.5);
        }
        
        .nav-flex { display: flex; justify-content: space-between; align-items: center; }
        .logo-box img { height: clamp(65px, 6vw, 100px); width: auto; display: block; filter: brightness(1) drop-shadow(0px 4px 10px rgba(0,0,0,0.5)); transition: var(--transition); }
        header.nav-monolith.scrolled .logo-box img { height: clamp(50px, 4vw, 65px); }
        
        .nav-links { display: flex; gap: clamp(1.5rem, 2.5vw, 3.5rem); align-items: center; }
        
        /* Navigatsiooni linkide ja rippmenüü ühised stiilid */
        .nav-links > a, .nav-item-dropdown > a { 
            color: var(--c-cream); text-decoration: none; font-size: 0.75rem; font-weight: 600; 
            text-transform: uppercase; letter-spacing: 3px; opacity: 0.7; transition: var(--transition); 
            position: relative; padding: 0.5rem 0; display: flex; align-items: center; gap: 0.5rem;
        }
        .nav-links > a::after, .nav-item-dropdown > a::after { 
            content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; 
            background: var(--c-gold); transition: var(--transition); 
        }
        .nav-links > a:hover::after, .nav-links > a.active::after, .nav-item-dropdown:hover > a::after { width: 100%; }
        .nav-links > a:hover, .nav-links > a.active, .nav-item-dropdown:hover > a { opacity: 1; color: var(--c-gold); }
        
        /* Rippmenüü (Dropdown) - Kuulikindel ja luksuslik */
        .nav-item-dropdown { position: relative; }
        .dropdown-menu {
            position: absolute; top: 100%; left: -20px; min-width: 260px;
            background: rgba(26, 23, 21, 0.98); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
            border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; box-shadow: 0 30px 60px rgba(0,0,0,0.7);
            opacity: 0; visibility: hidden; transform: translateY(15px); transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
            padding: 1.5rem 0; display: flex; flex-direction: column; z-index: 100;
        }
        .nav-item-dropdown:hover .dropdown-menu { opacity: 1; visibility: visible; transform: translateY(10px); }
        
        .dropdown-menu a {
            padding: 0.8rem 2rem; color: var(--c-muted); text-decoration: none; font-size: 0.75rem;
            text-transform: uppercase; letter-spacing: 2px; font-weight: 500; transition: var(--transition);
            white-space: nowrap; display: block; position: relative;
        }
        .dropdown-menu a::before {
            content: ''; position: absolute; left: 1rem; top: 50%; transform: translateY(-50%);
            width: 4px; height: 4px; border-radius: 50%; background: var(--c-gold); opacity: 0; transition: var(--transition);
        }
        .dropdown-menu a:hover { color: var(--c-gold); background: rgba(255,255,255,0.03); padding-left: 2.5rem; }
        .dropdown-menu a:hover::before { opacity: 1; }

        .nav-actions { display: flex; align-items: center; gap: clamp(1.5rem, 2vw, 3rem); }
        .lang-select select { background: transparent; color: var(--c-cream); border: none; font-family: var(--f-sans); font-size: 0.8rem; letter-spacing: 2px; cursor: pointer; font-weight: 600; outline: none; transition: var(--transition); }
        .lang-select select:hover { color: var(--c-gold); }
        
        /* Magnetic Button Wrap */
        .magnetic-wrap { display: inline-block; padding: 1rem; margin: -1rem; }
        .btn-cta {
            background: var(--c-gold); color: var(--c-bg); border: 1px solid var(--c-gold);
            padding: clamp(0.9rem, 1.5vw, 1.2rem) clamp(2.2rem, 3vw, 3rem); border-radius: 50px;
            text-transform: uppercase; font-size: 0.75rem; letter-spacing: 2px; font-weight: 700;
            cursor: pointer; transition: background 0.4s, color 0.4s, box-shadow 0.4s; 
            box-shadow: 0 5px 20px rgba(220, 167, 115, 0.15); display: inline-block; text-decoration: none;
            will-change: transform;
        }
        .magnetic-wrap:hover .btn-cta { background: transparent; color: var(--c-gold); box-shadow: 0 15px 35px rgba(220, 167, 115, 0.3); }

        /* --- MOBIILIMENÜÜ (hamburger) - peidetud töölaual, ilmub ≤1200px (tahvel + mobiil) --- */
        .nav-burger { display: none; width: 46px; height: 46px; flex-direction: column; justify-content: center; align-items: center; gap: 6px; background: transparent; border: none; cursor: pointer; padding: 0; position: relative; z-index: 1200; }
        .nav-burger span { display: block; width: 27px; height: 2px; background: var(--c-cream); border-radius: 2px; transition: transform 0.4s cubic-bezier(0.16,1,0.3,1), opacity 0.3s; }
        body.menu-open .nav-burger span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
        body.menu-open .nav-burger span:nth-child(2) { opacity: 0; }
        body.menu-open .nav-burger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

        .mobile-menu {
            position: fixed; inset: 0; z-index: 1100;
            background: rgba(17,15,13,0.98); -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px);
            display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 0.4rem;
            padding: 6.5rem 1.4rem 2.5rem;
            overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
            opacity: 0; visibility: hidden; transform: translateY(-12px);
            transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.16,1,0.3,1), visibility 0.5s;
        }
        /* "Turvaline keskjoondus": kui linke on vähem kui ekraanikõrgus, tsentreeri;
           kui rohkem (nt telefon külili), muutub menüü keritavaks ja midagi ei lõigata ära. */
        .mobile-menu a:first-child { margin-top: auto; }
        .mobile-menu a:last-child { margin-bottom: auto; }
        body.menu-open { overflow: hidden; }
        body.menu-open .mobile-menu { opacity: 1; visibility: visible; transform: translateY(0); }
        .mobile-menu a {
            font-family: var(--f-serif); font-size: clamp(1.9rem, 8vw, 2.8rem); font-weight: 300;
            color: var(--c-cream); text-decoration: none; letter-spacing: 0.5px; padding: 0.55rem 1rem;
            opacity: 0; transform: translateY(18px);
        }
        body.menu-open .mobile-menu a { animation: menuItemIn 0.6s cubic-bezier(0.16,1,0.3,1) forwards; }
        .mobile-menu a:nth-child(1) { animation-delay: 0.10s; }
        .mobile-menu a:nth-child(2) { animation-delay: 0.16s; }
        .mobile-menu a:nth-child(3) { animation-delay: 0.22s; }
        .mobile-menu a:nth-child(4) { animation-delay: 0.28s; }
        .mobile-menu a:nth-child(5) { animation-delay: 0.34s; }
        .mobile-menu a:active, .mobile-menu a:hover { color: var(--c-gold); }
        @keyframes menuItemIn { to { opacity: 1; transform: translateY(0); } }
        @media (min-width: 1201px) { .mobile-menu { display: none; } }

        /* --- THE ULTIMATE 3D BENTO HERO --- */
        section.hero-bento {
            min-height: 100vh; position: relative; display: flex; align-items: center;
            background: radial-gradient(circle at center, #1E1A18 0%, #110F0D 100%);
            overflow: hidden; padding-top: 6rem;
        }

        .hero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; align-items: center; gap: var(--sp-element); width: 100%; z-index: 10; position: relative; }

        .hero-text { opacity: 0; transform: translateY(40px); animation: fadeUpText 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.5s forwards; max-width: 750px; }
        @keyframes fadeUpText { to { opacity: 1; transform: translateY(0); } }
        
        .hero-text h1 { font-family: var(--f-serif); font-size: var(--text-h1); line-height: 1.02; font-weight: 300; margin-bottom: 2rem; letter-spacing: -2px; text-shadow: 0 10px 30px rgba(0,0,0,0.5); }
        .hero-text h1 em { color: var(--c-gold); font-style: italic; font-weight: 400; }
        .hero-text p.sub-lead { font-size: var(--text-p); color: var(--c-muted); line-height: 1.85; font-weight: 300; margin-bottom: 3.5rem; max-width: 650px; }

        /* Kineetiline 3D Bento Box Raamistik koos Glare'iga */
        .bento-perspective-wrapper {
            perspective: 1500px; width: 100%; height: clamp(550px, 70vh, 750px);
            display: flex; justify-content: flex-end; align-items: center;
        }

        .bento-gallery {
            display: grid; grid-template-columns: 1fr 0.9fr; grid-template-rows: 1fr 1fr; gap: clamp(1rem, 1.5vw, 1.5rem);
            width: 100%; max-width: 680px; height: 100%; transform-style: preserve-3d;
            transition: transform 0.15s ease-out; will-change: transform; backface-visibility: hidden;
            animation: floatBento 15s ease-in-out infinite alternate;
        }

        /* Õrn 3D-hõljumine ILMA üles tõusmiseta (translateY eemaldatud teadlikult) */
        @keyframes floatBento { 0% { transform: rotateX(1.5deg) rotateY(-1.5deg); } 100% { transform: rotateX(-1.5deg) rotateY(1.5deg); } }

        .bento-card {
            position: relative; border-radius: 16px; overflow: hidden;
            border: 1px solid rgba(220,167,115,0.2); box-shadow: 0 40px 80px rgba(0,0,0,0.7);
            background: #110E0D; transform-style: preserve-3d; cursor: pointer;
        }

        /* Pildilava (slideshow konteiner) - hover-suum käib lava peal, et see ei segaks slaidi liikumist */
        .bento-stage {
            position: absolute; inset: 0; overflow: hidden; z-index: 1;
            transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .bento-card:hover .bento-stage { transform: scale(1.05); }

        /* Üksik slaidi-pilt. Suurem kui lava (overscan), et libisemisel ei tekiks tühje servi. */
        .bento-img {
            position: absolute; top: -10%; left: -10%; width: 120%; height: 120%;
            object-fit: cover; filter: brightness(0.85);
            opacity: 0; transform: translate3d(6%, 0, 0);
            transition: opacity 0.9s ease, transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), filter 0.8s ease;
            will-change: opacity, transform; backface-visibility: hidden;
            z-index: 1;
        }
        /* Aktiivne pilt: nähtav, paigas */
        .bento-img.is-active { opacity: 1; transform: translate3d(0, 0, 0); z-index: 2; }
        /* Lahkuv pilt: libiseb vasakule ja hajub (paremalt-vasakule liikumine) */
        .bento-img.is-leaving { opacity: 0; transform: translate3d(-6%, 0, 0); z-index: 1; }
        .bento-card:hover .bento-img.is-active { filter: brightness(1.08); }

        /* KLÕPS-EFEKT: kiire ja efektne zoom (asendab klõpsamisel õrna libisemise) */
        .bento-card.fx-zoom .bento-img {
            transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1), filter 0.5s ease;
            transform: scale(1.14);
        }
        .bento-card.fx-zoom .bento-img.is-active { transform: scale(1); }
        .bento-card.fx-zoom .bento-img.is-leaving { transform: scale(0.92); opacity: 0; }

        /* Kasutaja eelistab vähem liikumist: jäta pildivahetus alles, aga ainult õrn hajumine (ei libise, ei hõlju) */
        @media (prefers-reduced-motion: reduce) {
            .bento-gallery { animation: none !important; }
            .bento-img { transition: opacity 1s ease !important; transform: none !important; }
            .bento-img.is-leaving { transform: none !important; }
        }

        /* Dünaamiline valguspeegeldus (Glare) piltidel */
        .glare {
            position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 4; pointer-events: none;
            background: radial-gradient(circle at 50% 50%, rgba(255,255,255,0.25) 0%, rgba(255,255,255,0) 60%);
            opacity: 0; transition: opacity 0.3s; mix-blend-mode: overlay;
        }

        .bento-card:nth-child(1) { grid-column: 1; grid-row: 1 / span 2; } 
        .bento-card:nth-child(2) { grid-column: 2; grid-row: 1; } 
        .bento-card:nth-child(3) { grid-column: 2; grid-row: 2; } 

        .bento-tag {
            position: absolute; bottom: 1.5rem; left: 1.5rem; z-index: 5;
            background: rgba(17,15,13,0.7); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
            padding: 0.6rem 1.6rem; border-radius: 30px; font-size: 0.8rem; font-weight: 700;
            color: var(--c-cream); text-transform: uppercase; letter-spacing: 2px;
            border: 1px solid rgba(255,255,255,0.1); pointer-events: none;
            box-shadow: 0 10px 20px rgba(0,0,0,0.5); transition: var(--transition);
        }
        .bento-card:hover .bento-tag { background: var(--c-gold); color: var(--c-bg); border-color: var(--c-gold); }
        .bento-tag i { margin-right: 8px; transition: var(--transition); }
        .bento-card:hover .bento-tag i { color: var(--c-bg); }

        /* --- DUAL-TRACK LÕPUTU GALERII --- */
        section.dual-marquee {
            padding: var(--sp-section) 0; background: var(--c-charcoal);
            border-top: 1px solid rgba(255,255,255,0.02); border-bottom: 1px solid rgba(255,255,255,0.02);
            overflow: hidden; position: relative;
        }
        .marquee-header { text-align: center; margin-bottom: var(--sp-element); }
        .marquee-header h2 { font-family: var(--f-serif); font-size: var(--text-h2); font-weight: 300; letter-spacing: -1px; }

        .marquee-fade::before, .marquee-fade::after { content: ''; position: absolute; top: 0; width: 15vw; height: 100%; z-index: 5; pointer-events: none; }
        .marquee-fade::before { left: 0; background: linear-gradient(to right, var(--c-charcoal) 0%, transparent 100%); }
        .marquee-fade::after { right: 0; background: linear-gradient(to left, var(--c-charcoal) 0%, transparent 100%); }

        .marquee-row { display: flex; width: 200%; white-space: nowrap; margin-bottom: 2rem; }
        .marquee-row:last-child { margin-bottom: 0; }
        
        .marquee-content { display: flex; animation: scrollLeft 60s linear infinite; }
        .marquee-content.reverse { animation: scrollRight 65s linear infinite; }
        
        .marquee-row:hover .marquee-content { animation-play-state: paused; }

        .marquee-content img {
            height: clamp(200px, 20vw, 320px); width: auto; border-radius: 12px; margin: 0 1rem; object-fit: cover;
            box-shadow: 0 15px 35px rgba(0,0,0,0.4); border: 1px solid rgba(255,255,255,0.03);
            transition: var(--transition); cursor: crosshair; filter: grayscale(20%) brightness(0.9);
        }
        .marquee-content img:hover { transform: scale(1.03) translateY(-5px); filter: grayscale(0%) brightness(1.1); box-shadow: 0 20px 45px rgba(220,167,115,0.2); z-index: 10; position: relative; }

        @keyframes scrollLeft { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
        @keyframes scrollRight { 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } }

        /* --- MANIFESTO --- */
        section.manifesto { padding: var(--sp-section) 0; background: var(--c-bg); }
        .manifesto-layout { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--sp-element); align-items: center; }
        .manifesto-text h2 { font-family: var(--f-serif); font-size: var(--text-h2); line-height: 1.1; font-weight: 300; margin-bottom: 2.5rem; letter-spacing: -1px; }
        .manifesto-text p { font-size: var(--text-p); color: var(--c-muted); line-height: 1.85; font-weight: 300; }
        
        .manifesto-quote { background: var(--c-surface); padding: clamp(4rem, 6vw, 6rem); border-radius: 20px; position: relative; box-shadow: 0 30px 70px rgba(0,0,0,0.4); border: 1px solid rgba(255,255,255,0.02); border-right: 4px solid var(--c-gold); }
        .manifesto-quote::before { content: '“'; position: absolute; top: 0.5rem; left: 2rem; font-family: var(--f-serif); font-size: 14rem; color: rgba(220,167,115,0.04); line-height: 1; }
        .manifesto-quote h4 { font-family: var(--f-serif); font-size: var(--text-h3); font-weight: 400; line-height: 1.45; font-style: italic; margin-bottom: 2rem; position: relative; z-index: 2; }

        /* --- TEEKOND (Ideaalne päev) --- */
        section.journey { padding: var(--sp-section) 0; background: var(--c-surface); border-top: 1px solid rgba(255,255,255,0.02); }
        .journey-intro { text-align: center; max-width: 800px; margin: 0 auto var(--sp-element); }
        .journey-intro h2 { font-family: var(--f-serif); font-size: var(--text-h2); font-weight: 300; margin-bottom: 1.5rem; letter-spacing: -1px; }
        
        .journey-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(2rem, 4vw, 5rem); position: relative; }
        .journey-grid::before { content: ''; position: absolute; top: 45px; left: 10%; width: 80%; height: 1px; background: linear-gradient(to right, transparent, rgba(220,167,115,0.3), transparent); z-index: 1; }
        
        .journey-step { text-align: center; position: relative; z-index: 2; }
        .journey-icon { width: 90px; height: 90px; background: var(--c-bg); border: 1px solid var(--c-gold); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 2.2rem; color: var(--c-gold); margin: 0 auto 2.5rem; box-shadow: 0 0 40px rgba(220,167,115,0.15); transition: var(--transition); }
        .journey-step:hover .journey-icon { transform: scale(1.1); background: var(--c-gold); color: var(--c-bg); box-shadow: 0 10px 40px rgba(220,167,115,0.4); }
        .journey-step h3 { font-family: var(--f-serif); font-size: var(--text-h3); margin-bottom: 1rem; font-weight: 400; }
        .journey-step p { color: var(--c-muted); font-size: var(--text-p); line-height: 1.7; padding: 0 1rem; }

        /* --- INTERAKTIIVNE HUB MAATRIKS --- */
        section.matrix-hub { padding: var(--sp-section) 0; background: var(--c-bg); }
        .hub-intro { text-align: center; max-width: 800px; margin: 0 auto var(--sp-element); }
        .hub-intro h2 { font-family: var(--f-serif); font-size: var(--text-h2); font-weight: 300; letter-spacing: -1px; }

        .hub-nav { display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; margin-bottom: var(--sp-element); border-bottom: 1px solid rgba(255,255,255,0.03); padding-bottom: 1.5rem; }
        .hub-trigger {
            background: transparent; border: none; color: var(--c-muted); font-family: var(--f-sans); text-transform: uppercase;
            font-size: 0.85rem; font-weight: 600; letter-spacing: 2px; padding: 1.2rem 2.8rem; cursor: pointer; transition: var(--transition); border-radius: 50px;
        }
        .hub-trigger:hover, .hub-trigger.active { color: var(--c-bg); background: var(--c-gold); box-shadow: 0 10px 30px rgba(220,167,115,0.35); transform: translateY(-2px); }

        .hub-pane { display: none; }
        .hub-pane.active { display: block; animation: paneEntrance 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
        @keyframes paneEntrance { from { opacity: 0; transform: translateY(25px); } to { opacity: 1; transform: translateY(0); } }

        .hub-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: var(--sp-element); }
        .hub-card { background: var(--c-card); border-radius: 16px; overflow: hidden; border: 1px solid rgba(255,255,255,0.02); transition: var(--transition); box-shadow: 0 15px 35px rgba(0,0,0,0.2); position: relative; }
        .hub-card:hover { transform: translateY(-12px); border-color: rgba(220,167,115,0.4); box-shadow: 0 40px 80px rgba(0,0,0,0.8); }

        .card-img { height: 300px; background-size: cover; background-position: center; position: relative; }
        .card-badge { position: absolute; bottom: 1.5rem; right: 1.5rem; background: rgba(17,15,13,0.9); backdrop-filter: blur(8px); padding: 0.6rem 1.6rem; border-radius: 30px; font-size: 0.85rem; font-weight: 700; color: var(--c-gold); border-left: 2px solid var(--c-gold); box-shadow: 0 10px 20px rgba(0,0,0,0.3); }

        .card-content { padding: 3.5rem; }
        .card-content h3 { font-family: var(--f-serif); font-size: 2.2rem; font-weight: 500; margin-bottom: 1.5rem; letter-spacing: -0.5px; }
        .card-specs { list-style: none; }
        .card-specs li { font-size: 1rem; color: var(--c-muted); margin-bottom: 0.9rem; display: flex; align-items: flex-start; gap: 1rem; }
        .card-specs li i { color: var(--c-gold); font-size: 1.1rem; margin-top: 3px; }

        .gastronomy-plate { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--sp-element); align-items: center; background: var(--c-surface); padding: clamp(4rem, 6vw, 6rem); border-radius: 20px; border: 1px solid rgba(255,255,255,0.03); box-shadow: 0 30px 60px rgba(0,0,0,0.4); }
        .chips-wrap { margin-top: 2rem; }
        .chips-wrap span { display: inline-block; background: rgba(220,167,115,0.08); border: 1px solid rgba(220,167,115,0.2); padding: 0.6rem 1.8rem; border-radius: 30px; margin: 0.4rem; font-size: 0.95rem; color: var(--c-gold); font-weight: 600; transition: var(--transition); }
        .chips-wrap span:hover { background: var(--c-gold); color: var(--c-bg); }

        /* --- SENSORY PARALLAX (E-POOD - Klaasmorfism) --- */
        section.parallax-sensory {
            position: relative; padding: var(--sp-section) 0; width: 100vw; margin-left: calc(-50vw + 50%);
            background-attachment: fixed; background-position: center; background-size: cover;
        }
        
        .parallax-overlay { 
            position: absolute; top: 0; left: 0; width: 100%; height: 100%; 
            background: linear-gradient(to bottom, var(--c-bg) 0%, rgba(19,17,16,0.6) 50%, var(--c-bg) 100%); 
            z-index: 1; 
        }
        
        .parallax-content { position: relative; z-index: 2; width: 100%; max-width: var(--max-w); margin: 0 auto; padding: 0 3rem; text-align: center; }
        .parallax-content h2 { font-family: var(--f-serif); font-size: var(--text-h2); font-weight: 300; margin-bottom: 1.5rem; letter-spacing: -1px; }
        .parallax-content p { font-size: var(--text-p); color: #e6dfdb; max-width: 800px; margin: 0 auto var(--sp-element); line-height: 1.8; }

        .parallax-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(2rem, 3vw, 4rem); text-align: left; perspective: 2200px; }

        /* === E-POE FLIP-KAARDID ===================================================
           Kaart = 3D konteiner. Klaasdisain on külgedel (front/back).
           Pööramine: hover (lauaarvuti), .is-flipped (puudutus/klõps), :focus (klaviatuur) */
        .p-card { position: relative; min-height: clamp(490px, 38vw, 520px); background: none; border: none; padding: 0; box-shadow: none; outline: none; }

        .p-card-inner {
            position: relative; width: 100%; height: 100%; min-height: inherit;
            transform-style: preserve-3d;
            transition: transform 0.9s cubic-bezier(0.2, 0.85, 0.25, 1);
            will-change: transform;
        }
        @media (hover: hover) { .p-card:hover .p-card-inner { transform: rotateY(180deg); } }
        .p-card.is-flipped .p-card-inner { transform: rotateY(180deg); }
        .p-card:focus-within .p-card-inner { transform: rotateY(180deg); }
        .p-card:focus-visible { outline: 2px solid var(--c-gold); outline-offset: 6px; border-radius: 22px; }

        .p-card-front, .p-card-back {
            position: absolute; inset: 0; border-radius: 20px; overflow: hidden;
            padding: clamp(2rem, 2.6vw, 3rem);
            display: flex; flex-direction: column;
            background: rgba(17,15,13, 0.6);
            -webkit-backdrop-filter: blur(25px); backdrop-filter: blur(25px);
            border: 1px solid rgba(255,255,255,0.08);
            box-shadow: 0 40px 80px rgba(0,0,0,0.5);
            -webkit-backface-visibility: hidden; backface-visibility: hidden;
        }
        .p-card:hover .p-card-front, .p-card:hover .p-card-back,
        .p-card.is-flipped .p-card-front, .p-card.is-flipped .p-card-back { border-color: rgba(220,167,115,0.5); }

        /* --- ESIKÜLG --- */
        .p-card-front { justify-content: center; }
        .p-card-front i { font-size: 3.2rem; color: var(--c-gold); margin-bottom: 2rem; filter: drop-shadow(0 0 10px rgba(220,167,115,0.3)); }
        .p-card-front h3 { font-family: var(--f-serif); font-size: var(--text-h3); font-weight: 400; margin-bottom: 1rem; color: var(--c-cream); }
        .p-card-front p { font-size: 1.05rem; color: var(--c-muted); line-height: 1.7; }
        .p-flip-hint { margin-top: auto; padding-top: 2rem; font-size: 0.74rem; letter-spacing: 1.5px; text-transform: uppercase; color: var(--c-gold); opacity: 0.8; display: inline-flex; align-items: center; gap: 0.6rem; }
        .p-flip-hint i { font-size: 0.85rem; margin: 0; color: var(--c-gold); filter: none; animation: hintSpin 6s linear infinite; }
        @keyframes hintSpin { to { transform: rotate(360deg); } }

        /* --- TAGAKÜLG --- */
        .p-card-back { transform: rotateY(180deg); gap: 1.1rem; }
        .pb-head { display: flex; align-items: center; gap: 0.9rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(255,255,255,0.08); }
        .pb-head i { font-size: 1.3rem; color: var(--c-gold); }
        .pb-head h4 { font-family: var(--f-serif); font-size: 1.45rem; font-weight: 400; color: var(--c-cream); margin: 0; }

        .pb-cats { display: flex; flex-wrap: wrap; gap: 0.55rem; }
        .pb-chip {
            font-size: 0.76rem; letter-spacing: 0.5px; color: var(--c-cream); text-decoration: none;
            padding: 0.45rem 0.95rem; border-radius: 50px; border: 1px solid rgba(220,167,115,0.3);
            background: rgba(220,167,115,0.06); transition: var(--transition); white-space: nowrap;
        }
        .pb-chip:hover { background: var(--c-gold); color: var(--c-bg); border-color: var(--c-gold); }

        .pb-products { display: flex; flex-direction: column; gap: 0.7rem; }
        .pb-product {
            display: flex; align-items: center; gap: 1rem; text-decoration: none;
            padding: 0.6rem; border-radius: 12px; border: 1px solid rgba(255,255,255,0.06);
            background: rgba(255,255,255,0.02); transition: var(--transition);
        }
        .pb-product:hover { background: rgba(255,255,255,0.06); border-color: rgba(220,167,115,0.4); transform: translateX(4px); }
        .pb-thumb { width: 54px; height: 54px; flex: 0 0 54px; border-radius: 9px; background-size: cover; background-position: center; box-shadow: 0 6px 14px rgba(0,0,0,0.45); }
        .pb-info { display: flex; flex-direction: column; flex: 1; min-width: 0; }
        .pb-name { font-size: 0.92rem; color: var(--c-cream); line-height: 1.3; }
        .pb-price { font-size: 0.85rem; color: var(--c-gold); font-weight: 600; margin-top: 0.2rem; }
        .pb-go { color: var(--c-muted); font-size: 0.85rem; transition: var(--transition); flex: 0 0 auto; }
        .pb-product:hover .pb-go { color: var(--c-gold); }

        .pb-all { margin-top: auto; align-self: flex-start; font-size: 0.8rem; letter-spacing: 1px; text-transform: uppercase; font-weight: 600; color: var(--c-gold); text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem; transition: var(--transition); }
        .pb-all:hover { gap: 0.9rem; }

        /* Vähem liikumist: flip endiselt toimub, aga koheselt (ilma pika animatsioonita) */
        @media (prefers-reduced-motion: reduce) {
            .p-card-inner { transition: none !important; }
            .p-flip-hint i { animation: none !important; }
        }

        /* --- ARVUSTUSTE SALONG --- */
        section.reviews { padding: var(--sp-section) 0; background: var(--c-charcoal); border-top: 1px solid rgba(255,255,255,0.02); }
        .reviews-track { display: flex; gap: 3.5rem; overflow-x: auto; padding-bottom: 5rem; scroll-snap-type: x mandatory; cursor: grab; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; }
        .reviews-track.is-dragging { cursor: grabbing; scroll-behavior: auto; scroll-snap-type: none; }
        .reviews-track.is-dragging .review-card { pointer-events: none; user-select: none; }
        .reviews-track::-webkit-scrollbar { height: 4px; }
        .reviews-track::-webkit-scrollbar-thumb { background: rgba(220,167,115,0.5); border-radius: 10px; }
        .review-card { background: var(--c-bg); padding: clamp(4rem, 5vw, 5.5rem); min-width: 480px; max-width: 520px; border-radius: 20px; snap-align: start; box-shadow: 0 20px 50px rgba(0,0,0,0.2); border: 1px solid rgba(255,255,255,0.02); }
        .review-card p { font-family: var(--f-serif); font-size: 1.7rem; font-style: italic; line-height: 1.65; margin-bottom: 3rem; color: #fff; }
        .review-card h5 { font-family: var(--f-sans); font-size: 0.95rem; text-transform: uppercase; letter-spacing: 2px; color: var(--c-gold); font-weight: 600; }

        /* --- KKK --- */
        section.faq { padding: var(--sp-section) 0; background: var(--c-bg); }
        .faq-wrapper { max-width: 950px; margin: var(--sp-element) auto 0; }
        .faq-item { border-bottom: 1px solid rgba(255,255,255,0.05); padding: 2.8rem 0; }
        .faq-trigger { display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-family: var(--f-serif); font-size: 2.2rem; font-weight: 400; transition: var(--transition); }
        .faq-trigger:hover { color: var(--c-gold); }
        .faq-content { max-height: 0; overflow: hidden; transition: max-height 0.5s cubic-bezier(0.16, 1, 0.3, 1); color: var(--c-muted); font-size: 1.15rem; line-height: 1.85; padding-top: 0; }
        .faq-item.open .faq-content { max-height: 400px; padding-top: 1.8rem; }
        .faq-item i { transition: transform 0.5s; color: var(--c-gold); font-size: 1.5rem; }
        .faq-item.open i { transform: rotate(180deg); }

        /* --- MODAL (BRONEERING) --- */
        .modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(19,17,16, 0.98); backdrop-filter: blur(25px); z-index: 2000; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: var(--transition); }
        .modal-overlay.active { opacity: 1; pointer-events: auto; }
        .modal-box { background: var(--c-surface); width: 100%; max-width: 700px; padding: clamp(4rem, 5vw, 6rem); border-radius: 20px; border: 1px solid rgba(220,167,115, 0.2); position: relative; box-shadow: 0 50px 150px rgba(0,0,0,0.9); }
        .modal-close { position: absolute; top: 2.5rem; right: 2.5rem; font-size: 2.2rem; cursor: pointer; color: var(--c-muted); transition: var(--transition); }
        .modal-close:hover { color: var(--c-gold); transform: rotate(90deg); }
        .form-group { margin-bottom: 2.5rem; }
        .form-group label { display: block; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 0.8rem; color: var(--c-muted); font-weight: 600; }
        .form-group input, .form-group select, .form-group textarea { width: 100%; background: var(--c-bg); border: 1px solid rgba(255,255,255,0.06); padding: 1.4rem; border-radius: 8px; color: white; font-family: var(--f-sans); font-size: 1.05rem; outline: none; transition: var(--transition); }
        .form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--c-gold); box-shadow: 0 0 15px rgba(220,167,115,0.1); }

        /* --- FOOTER --- */
        footer { background: #0A0908; padding: var(--sp-section) 0 4rem; border-top: 1px solid rgba(255,255,255,0.02); }
        .footer-grid { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 6rem; margin-bottom: 7rem; }
        .footer-col h5 { text-transform: uppercase; letter-spacing: 3px; font-size: 0.85rem; margin-bottom: 2.5rem; color: var(--c-gold); }
        .footer-col a, .footer-col p { display: block; color: var(--c-muted); text-decoration: none; margin-bottom: 1.2rem; font-size: 1.05rem; transition: var(--transition); }
        .footer-col a:hover { color: var(--c-cream); transform: translateX(5px); }
        .footer-bottom { display: flex; justify-content: space-between; color: #5c554e; font-size: 0.95rem; padding-top: 4rem; border-top: 1px solid rgba(255,255,255,0.03); }

        /* === TAASKASUTATAV: KLÕPSA-KOPEERI E-POST =============================
           Kasuta: <a href="mailto:x@y.ee" class="copy-email" data-email="x@y.ee">x@y.ee</a>
           Desktop: klõps kopeerib + tooltip "Kopeeri"; Mobiil: toimib mailto-na. */
        .copy-email { position: relative; cursor: pointer; }
        .copy-email::after {
            content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 10px);
            transform: translateX(-50%) translateY(5px);
            background: var(--c-gold); color: var(--c-bg);
            padding: 0.4rem 0.8rem; border-radius: 6px;
            font-family: var(--f-sans); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.5px;
            white-space: nowrap; pointer-events: none; opacity: 0;
            transition: opacity 0.25s ease, transform 0.25s ease;
            box-shadow: 0 8px 20px rgba(0,0,0,0.45); z-index: 50;
        }
        .copy-email::before {
            content: ''; position: absolute; left: 50%; bottom: calc(100% + 4px);
            transform: translateX(-50%) translateY(5px);
            border: 6px solid transparent; border-top-color: var(--c-gold);
            opacity: 0; transition: opacity 0.25s ease, transform 0.25s ease; pointer-events: none; z-index: 50;
        }
        @media (hover: hover) {
            .copy-email:hover::after, .copy-email:hover::before { opacity: 1; transform: translateX(-50%) translateY(0); }
        }
        .copy-email.copied::after, .copy-email.copied::before { opacity: 1; transform: translateX(-50%) translateY(0); }
        .copy-email.copied::after { background: #4caf7d; color: #07130d; }
        .copy-email.copied::before { border-top-color: #4caf7d; }

        /* =====================================================================
           RESPONSIIVSUS — tahvel & mobiil. Töölaua baasstiile (≥1367px) ei muudeta.
           ===================================================================== */

        /* --- Sülearvuti / 13" madalama resolutsiooniga: õrnem skaala, et poleks hiiglaslik --- */
        @media (max-width: 1366px) {
            :root {
                --text-h1: clamp(3.6rem, 6.4vw, 5.6rem);
                --text-h2: clamp(2.6rem, 4.4vw, 3.9rem);
                --text-h3: clamp(1.7rem, 2.6vw, 2.3rem);
                --sp-section: clamp(6rem, 9vw, 10rem);
                --sp-element: clamp(2.4rem, 3.6vw, 4rem);
            }
        }

        /* --- Tahvelarvuti (landscape) ja allapoole: veerud kokku --- */
        @media (max-width: 1200px) {
            :root {
                --text-h1: clamp(3rem, 6.5vw, 4.6rem);
                --text-h2: clamp(2.3rem, 5vw, 3.3rem);
                --sp-section: clamp(5rem, 9vw, 8rem);
            }
            .hero-grid, .manifesto-layout, .footer-grid, .gastronomy-plate, .parallax-cards, .journey-grid { grid-template-columns: 1fr; gap: 4rem; }
            .bento-perspective-wrapper { height: auto; perspective: none; }
            .bento-gallery { grid-template-columns: 1fr; grid-template-rows: auto; height: auto; animation: none; transform: none !important; }
            .bento-card:nth-child(1), .bento-card:nth-child(2), .bento-card:nth-child(3) { grid-column: 1; grid-row: auto; height: 250px; transform: none !important; }
            .container { padding: 0 2rem; }
            /* Tahvlil ei mahu täismenüü ära: peida lingid JA näita hamburgerit.
               (Varem ilmus hamburger alles ≤900px - vahemikus 901–1200px polnud üldse menüüd.) */
            .nav-links { display: none; }
            .nav-burger { display: inline-flex; }
            section.parallax-sensory { background-attachment: scroll; }
            .journey-grid::before { display: none; }
            .review-card { min-width: 340px; padding: 3.5rem; }
            /* HUB ruudustik: väldi 380px min-laiust, mis tekitaks horisontaalse ülevoolu */
            .hub-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
            .p-card { min-height: clamp(440px, 60vw, 500px); }
        }

        /* --- Tahvel (portrait) & suur telefon: keelevalik peitu, swipe-tabid --- */
        @media (max-width: 900px) {
            :root {
                --text-h1: clamp(2.8rem, 9vw, 4rem);
                --text-h2: clamp(2.1rem, 7vw, 3rem);
                --text-h3: clamp(1.55rem, 5vw, 2rem);
                --text-p: clamp(1rem, 2.4vw, 1.15rem);
                --sp-section: clamp(4.5rem, 13vw, 7rem);
                --sp-element: clamp(2rem, 7vw, 3rem);
            }
            .lang-select { display: none; } /* keelevalik koliks mobiilimenüüsse - praegu peidus, et päis oleks puhas */
            /* HUB tabid: kerivad horisontaalselt ühel real (swipe) */
            .hub-nav { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; gap: 0.6rem; }
            .hub-nav::-webkit-scrollbar { display: none; }
            .hub-trigger { flex: 0 0 auto; padding: 0.9rem 1.8rem; scroll-snap-align: start; }
            .marquee-content img { height: clamp(150px, 34vw, 220px); }
            .card-content { padding: 2.4rem; }
            .card-img { height: 240px; }
        }

        /* --- Telefon --- */
        @media (max-width: 600px) {
            :root {
                --text-h1: clamp(2.5rem, 11vw, 3.3rem);
                --text-h2: clamp(1.9rem, 8vw, 2.5rem);
                --sp-section: clamp(4rem, 16vw, 6rem);
            }
            .container { padding: 0 1.4rem; }
            .bento-card:nth-child(1), .bento-card:nth-child(2), .bento-card:nth-child(3) { height: 220px; }
            .bento-gallery { height: auto; gap: 1rem; }
            /* Arvustused: üks kaart korraga, sujuv swipe-snap */
            .reviews-track { gap: 1.2rem; scroll-snap-type: x mandatory; }
            .review-card { min-width: 86vw; max-width: 86vw; padding: 2.6rem; scroll-snap-align: center; }
            .review-card p { font-size: 1.3rem; margin-bottom: 2rem; }
            .hub-grid { grid-template-columns: 1fr; }
            .p-card { min-height: 430px; }
            .modal-box { padding: 2.4rem 1.6rem; }
            .modal-box h2 { font-size: 2rem !important; margin-bottom: 2rem !important; }
            .footer-grid { gap: 3rem; }
            .footer-bottom { flex-direction: column; gap: 1rem; text-align: center; }
            .nav-actions .btn-cta { padding: 0.75rem 1.4rem; font-size: 0.65rem; letter-spacing: 1.5px; }
        }
        /* =====================================================================
           GRILLITALU MENÜÜRAAMAT (sisu loetakse intras'est, vt _menu.php)
           - .menu-board: "pabermenüü" tume luksusversioon, topeltraamiga
           - .menu-scroll: sisemine keritav ala (peen kuldne scrollbar + fade)
           - .menu-modal: sama menüü täisvaates
           ===================================================================== */
        .menu-board { max-width: 1080px; margin: 0 auto; position: relative; }
        .menu-board.is-inline { margin-bottom: 0; }

        .menu-board-frame {
            position: relative;
            background:
                radial-gradient(120% 90% at 50% 0%, rgba(220,167,115,0.08) 0%, rgba(220,167,115,0) 55%),
                var(--c-surface);
            border: 1px solid rgba(220,167,115,0.22);
            border-radius: 20px;
            padding: clamp(2.4rem, 4vw, 4rem) clamp(1.4rem, 3vw, 3.2rem) clamp(1.4rem, 2.5vw, 2.2rem);
            box-shadow: 0 40px 90px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.04);
            overflow: hidden;
        }
        /* Sisemine peen joon nagu klassikalisel pabermenüül */
        .menu-board-frame::before {
            content: ''; position: absolute; inset: 10px;
            border: 1px solid rgba(220,167,115,0.13); border-radius: 14px;
            pointer-events: none; z-index: 1;
        }

        .menu-head { text-align: center; margin-bottom: 2.2rem; position: relative; z-index: 2; }
        .menu-overline { display: block; font-size: 0.72rem; letter-spacing: 5px; text-transform: uppercase; color: var(--c-muted); font-weight: 600; margin-bottom: 0.9rem; }
        .menu-title { font-family: var(--f-serif); font-weight: 300; font-size: clamp(3rem, 5vw, 4.6rem); line-height: 1; color: var(--c-cream); letter-spacing: -1px; margin: 0; }
        .menu-rule { display: flex; align-items: center; justify-content: center; gap: 1.1rem; margin: 1.5rem auto 0; color: var(--c-gold); font-size: 0.85rem; }
        .menu-rule::before, .menu-rule::after { content: ''; height: 1px; width: min(140px, 26vw); }
        .menu-rule::before { background: linear-gradient(to right, transparent, rgba(220,167,115,0.55)); }
        .menu-rule::after  { background: linear-gradient(to left,  transparent, rgba(220,167,115,0.55)); }
        .menu-note { max-width: 660px; margin: 1.5rem auto 0; font-family: var(--f-serif); font-style: italic; font-size: 1.18rem; color: var(--c-muted); line-height: 1.7; }

        /* Kategooriad (chipid) */
        .menu-cats { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.55rem; margin-bottom: 1.4rem; position: relative; z-index: 2; }
        .menu-chip {
            font-family: var(--f-sans); font-size: 0.78rem; letter-spacing: 0.5px; font-weight: 600;
            color: var(--c-cream); background: rgba(220,167,115,0.06);
            border: 1px solid rgba(220,167,115,0.3); border-radius: 50px;
            padding: 0.5rem 1.15rem; cursor: pointer; transition: var(--transition); white-space: nowrap;
        }
        .menu-chip:hover { background: rgba(220,167,115,0.18); }
        .menu-chip.on { background: var(--c-gold); color: var(--c-bg); border-color: var(--c-gold); box-shadow: 0 8px 20px rgba(220,167,115,0.25); }

        /* Keritav menüüala */
        .menu-scroll {
            position: relative; overflow-y: auto; overscroll-behavior: contain;
            max-height: min(62vh, 660px);
            padding: 0.4rem 1.1rem 0.4rem 0.5rem;
            outline: none; z-index: 2;
            scrollbar-width: thin; scrollbar-color: rgba(220,167,115,0.55) transparent;
            -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 26px, #000 calc(100% - 30px), transparent 100%);
                    mask-image: linear-gradient(to bottom, transparent 0, #000 26px, #000 calc(100% - 30px), transparent 100%);
        }
        .menu-scroll::-webkit-scrollbar { width: 5px; }
        .menu-scroll::-webkit-scrollbar-track { background: transparent; }
        .menu-scroll::-webkit-scrollbar-thumb { background: rgba(220,167,115,0.45); border-radius: 10px; }

        .menu-sec { padding: 1.5rem 0 0.5rem; }
        .menu-sec:first-child { padding-top: 0.6rem; }
        .menu-sec-h { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.1rem; }
        .menu-sec-emoji { font-size: 1.25rem; line-height: 1; filter: saturate(0.9); }
        .menu-sec-h h4 { font-family: var(--f-serif); font-size: clamp(1.7rem, 2.4vw, 2.3rem); font-weight: 400; color: var(--c-gold); letter-spacing: 0.5px; margin: 0; }
        .menu-sec-line { flex: 1; height: 1px; background: linear-gradient(to right, rgba(220,167,115,0.35), transparent); }

        .menu-item { padding: 0.8rem 0.6rem; border-radius: 10px; transition: background 0.3s ease; }
        .menu-item:hover { background: rgba(255,255,255,0.025); }
        .menu-item-row { display: flex; align-items: baseline; gap: 0.9rem; }
        .menu-item-name { font-family: var(--f-serif); font-size: clamp(1.25rem, 1.6vw, 1.5rem); font-weight: 500; color: var(--c-cream); }
        .menu-item-lead { flex: 1; min-width: 2rem; border-bottom: 1px dotted rgba(168,158,149,0.35); transform: translateY(-4px); }
        .menu-item-price { font-size: 1rem; font-weight: 700; color: var(--c-gold); letter-spacing: 0.5px; white-space: nowrap; }
        .menu-item-desc { margin: 0.45rem 0 0; max-width: 56ch; color: var(--c-muted); font-size: 0.98rem; line-height: 1.65; }
        .menu-item-meta { display: inline-block; margin-top: 0.5rem; font-size: 0.7rem; letter-spacing: 2px; text-transform: uppercase; color: rgba(168,158,149,0.7); }

        .menu-colophon { text-align: center; padding: 2.4rem 0 1.2rem; color: var(--c-muted); }
        .menu-colophon i { color: var(--c-gold); font-size: 1.05rem; display: block; margin-bottom: 0.7rem; opacity: 0.8; }
        .menu-colophon p { font-family: var(--f-serif); font-style: italic; font-size: 1.05rem; margin: 0; }

        /* Nurga-nupp: ava täisvaates (ainult inline-vaates) */
        .menu-expand {
            position: absolute; top: 1.3rem; right: 1.3rem; z-index: 3;
            width: 44px; height: 44px; border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            border: 1px solid rgba(220,167,115,0.3); background: rgba(17,15,13,0.45);
            color: var(--c-gold); font-size: 0.9rem; cursor: pointer; transition: var(--transition);
        }
        .menu-expand:hover { background: var(--c-gold); color: var(--c-bg); transform: scale(1.08); }

        /* CTA menüü all */
        .menu-cta-wrap { text-align: center; margin: 3rem 0 4.5rem; }
        .menu-cta-btn { text-decoration: none; padding: 1.4rem 3.6rem; font-size: 0.8rem; }

        /* Nav'i "Menüü" viide - kuldne aktsent, et silma torgata */
        .nav-links > a.nav-menu-link { color: var(--c-gold); opacity: 0.9; }

        /* --- MENÜÜ MODAL (täisvaade) --- */
        .menu-modal { padding: clamp(0.8rem, 2.5vw, 2.5rem); }
        .menu-modal-box { position: relative; width: 100%; max-width: 1080px; }
        .menu-modal .menu-board-frame {
            display: flex; flex-direction: column;
            max-height: calc(100vh - 3rem);
            max-height: calc(100dvh - 3rem);
        }
        .menu-modal .menu-scroll { max-height: none; flex: 1 1 auto; min-height: 0; }
        .menu-modal .menu-head, .menu-modal .menu-cats { flex: 0 0 auto; } /* ära lase flex'il chipe/pealkirja kokku suruda */
        body.menu-modal-open { overflow: hidden; }

        .menu-modal-close {
            position: absolute; top: 1.3rem; right: 1.3rem; z-index: 6;
            width: 46px; height: 46px; border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            border: 1px solid rgba(220,167,115,0.3); background: rgba(17,15,13,0.55);
            color: var(--c-cream); font-size: 1.15rem; cursor: pointer; transition: var(--transition);
        }
        .menu-modal-close:hover { background: var(--c-gold); color: var(--c-bg); transform: rotate(90deg); }

        /* Mobiilimenüüs on nüüd 6 linki - viimase ilmumise viide */
        body.menu-open .mobile-menu a:nth-child(6) { animation-delay: 0.40s; }

        /* --- Menüüraamatu responsiivsus --- */
        @media (max-width: 900px) {
            /* Chipid ühel real, sõrmega keritavad (nagu hub-nav) */
            .menu-cats { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 0.4rem; scrollbar-width: none; }
            .menu-cats::-webkit-scrollbar { display: none; }
            .menu-scroll { max-height: 64vh; padding-right: 0.6rem; }
            .menu-item-desc { max-width: 100%; }
        }
        @media (max-width: 600px) {
            .menu-board-frame { padding: 2rem 1rem 1.2rem; border-radius: 16px; }
            .menu-board-frame::before { inset: 7px; border-radius: 11px; }
            .menu-expand { top: 0.9rem; right: 0.9rem; width: 40px; height: 40px; }
            .menu-item { padding: 0.7rem 0.3rem; }
            .menu-item-row { flex-wrap: wrap; gap: 0.5rem; }
            .menu-item-lead { display: none; } /* kitsal ekraanil punktiirjoon ära - hind kohe nime järel */
            .menu-item-price { margin-left: auto; }
            .menu-scroll { max-height: 66vh; }
            .menu-modal { padding: 0.6rem; }
            .menu-modal .menu-board-frame { max-height: calc(100vh - 1.2rem); max-height: calc(100dvh - 1.2rem); }
            .menu-modal-close { top: 0.9rem; right: 0.9rem; width: 42px; height: 42px; }
            .menu-cta-wrap { margin: 2.4rem 0 3.4rem; }
        }
        @media (prefers-reduced-motion: reduce) {
            .menu-scroll { scroll-behavior: auto; }
        }

        /* =====================================================================
           ALAMLEHTEDE ÜLDSTIILID (esimene kasutaja: /kontakt)
           Taaskasutatav muster: .subpage-hero + .crumbs + .page-rule +
           .subpage-section. Uus alamleht = sama skelett, uus sisu.
           ===================================================================== */
        .subpage-hero {
            padding: clamp(11rem, 22vh, 16rem) 0 clamp(3.5rem, 6vw, 6rem);
            text-align: center; position: relative;
            background: radial-gradient(circle at 50% 0%, #1E1A18 0%, var(--c-bg) 75%);
        }
        .crumbs {
            display: flex; align-items: center; justify-content: center; gap: 0.9rem;
            font-size: 0.7rem; letter-spacing: 3px; text-transform: uppercase; font-weight: 600;
            color: var(--c-muted); margin-bottom: 2.2rem;
        }
        .crumbs a { color: var(--c-muted); text-decoration: none; transition: var(--transition); }
        .crumbs a:hover { color: var(--c-gold); }
        .crumbs i { font-size: 0.55rem; color: rgba(220,167,115,0.6); }
        .crumbs span { color: var(--c-gold); }

        .subpage-overline { display: block; font-size: 0.72rem; letter-spacing: 5px; text-transform: uppercase; color: var(--c-muted); font-weight: 600; margin-bottom: 1.2rem; }
        .subpage-hero h1 { font-family: var(--f-serif); font-size: var(--text-h1); font-weight: 300; line-height: 1.05; letter-spacing: -2px; margin-bottom: 1.8rem; }
        .subpage-hero h1 em { color: var(--c-gold); font-style: italic; font-weight: 400; }
        .subpage-lead { max-width: 680px; margin: 0 auto; color: var(--c-muted); font-size: var(--text-p); line-height: 1.85; }

        .page-rule { display: flex; align-items: center; justify-content: center; gap: 1.1rem; margin: 2.6rem auto 0; color: var(--c-gold); font-size: 0.85rem; }
        .page-rule::before, .page-rule::after { content: ''; height: 1px; width: min(140px, 26vw); }
        .page-rule::before { background: linear-gradient(to right, transparent, rgba(220,167,115,0.55)); }
        .page-rule::after  { background: linear-gradient(to left,  transparent, rgba(220,167,115,0.55)); }

        .subpage-section { padding: clamp(2.5rem, 5vw, 5rem) 0; }

        /* =====================================================================
           KONTAKT - infokaardid, vorm, kaart, sotsiaal, CTA
           ===================================================================== */
        .contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: clamp(1.2rem, 2vw, 2rem); }
        .contact-card {
            background: var(--c-surface); border: 1px solid rgba(255,255,255,0.03);
            border-radius: 16px; padding: clamp(2.2rem, 3vw, 3rem) clamp(1.6rem, 2.2vw, 2.4rem);
            text-align: center; transition: var(--transition); position: relative;
            box-shadow: 0 15px 35px rgba(0,0,0,0.2);
        }
        .contact-card:hover { transform: translateY(-8px); border-color: rgba(220,167,115,0.35); box-shadow: 0 35px 70px rgba(0,0,0,0.6); }
        .contact-icon {
            width: 66px; height: 66px; margin: 0 auto 1.6rem; border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            background: var(--c-bg); border: 1px solid var(--c-gold); color: var(--c-gold);
            font-size: 1.4rem; box-shadow: 0 0 30px rgba(220,167,115,0.12); transition: var(--transition);
        }
        .contact-card:hover .contact-icon { background: var(--c-gold); color: var(--c-bg); box-shadow: 0 10px 30px rgba(220,167,115,0.35); }
        .contact-card h3 { font-size: 0.78rem; letter-spacing: 3px; text-transform: uppercase; color: var(--c-muted); font-weight: 600; margin-bottom: 1rem; }
        .contact-value { font-family: var(--f-serif); font-size: 1.45rem; line-height: 1.5; color: var(--c-cream); }
        .contact-value a { color: var(--c-cream); text-decoration: none; transition: var(--transition); }
        .contact-value a:hover { color: var(--c-gold); }
        .contact-iban { cursor: pointer; font-size: 1.15rem; letter-spacing: 0.5px; border-bottom: 1px dotted rgba(220,167,115,0.4); transition: var(--transition); }
        .contact-iban:hover { color: var(--c-gold); }
        .contact-actions { margin-top: 1.4rem; display: flex; justify-content: center; gap: 1.4rem; flex-wrap: wrap; }
        .contact-actions a {
            font-size: 0.75rem; letter-spacing: 1px; text-transform: uppercase; font-weight: 600;
            color: var(--c-gold); text-decoration: none; display: inline-flex; align-items: center; gap: 0.45rem;
            transition: var(--transition);
        }
        .contact-actions a:hover { gap: 0.7rem; }
        .contact-hint { font-size: 0.72rem; color: var(--c-muted); display: inline-flex; align-items: center; gap: 0.45rem; }

        /* Vorm + külgveerg */
        .contact-split { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(2rem, 3vw, 4rem); align-items: start; }
        .contact-form-card {
            background: var(--c-surface); border: 1px solid rgba(220,167,115,0.2); border-radius: 20px;
            padding: clamp(2.4rem, 4vw, 4.5rem); box-shadow: 0 40px 90px rgba(0,0,0,0.45);
            position: relative; overflow: hidden;
        }
        .contact-form-card::before {
            content: ''; position: absolute; inset: 10px; border: 1px solid rgba(220,167,115,0.1);
            border-radius: 14px; pointer-events: none;
        }
        .contact-form-card > * { position: relative; z-index: 2; }
        .contact-form-card h2 { font-family: var(--f-serif); font-size: clamp(2.4rem, 3.5vw, 3.4rem); font-weight: 300; margin-bottom: 0.8rem; }
        .contact-form-card h2 em { color: var(--c-gold); font-style: italic; }
        .contact-form-sub { color: var(--c-muted); font-size: 1.02rem; line-height: 1.7; margin-bottom: 2.6rem; }
        .form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.6rem; }
        .contact-form-card .form-group { margin-bottom: 1.8rem; }
        .contact-form-foot { display: flex; align-items: center; gap: 1.8rem; flex-wrap: wrap; margin-top: 0.6rem; }
        .contact-guard { font-size: 0.74rem; color: var(--c-muted); display: inline-flex; align-items: center; gap: 0.5rem; line-height: 1.5; }
        .contact-guard i { color: var(--c-gold); }

        /* Honeypot: inimsilmale ja puutele kättesaamatu */
        .hp-wrap { position: absolute !important; left: -9999px !important; top: -9999px !important; height: 1px; width: 1px; overflow: hidden; }

        /* Vormi tagasiside (flash) */
        .form-flash {
            display: flex; gap: 1rem; align-items: flex-start;
            border-radius: 12px; padding: 1.3rem 1.5rem; margin-bottom: 2.2rem;
            font-size: 0.98rem; line-height: 1.6; animation: paneEntrance 0.6s cubic-bezier(0.16,1,0.3,1);
        }
        .form-flash i { font-size: 1.25rem; margin-top: 2px; }
        .form-flash p { margin: 0; }
        .form-flash.is-success { background: rgba(76,175,125,0.08); border: 1px solid rgba(76,175,125,0.35); color: #A8D8BE; }
        .form-flash.is-success i { color: #4caf7d; }
        .form-flash.is-error { background: rgba(230,92,0,0.07); border: 1px solid rgba(230,92,0,0.35); color: #EDC5AA; }
        .form-flash.is-error i { color: var(--c-amber); }

        /* Kaart */
        .contact-side { display: flex; flex-direction: column; gap: clamp(1.4rem, 2vw, 2rem); }
        .map-card {
            border-radius: 20px; overflow: hidden; border: 1px solid rgba(220,167,115,0.2);
            background: var(--c-surface); box-shadow: 0 30px 70px rgba(0,0,0,0.45);
        }
        .map-card iframe {
            display: block; width: 100%; height: clamp(300px, 34vw, 420px); border: 0;
            filter: invert(0.92) hue-rotate(180deg) saturate(0.55) brightness(0.92) contrast(0.95);
            transition: filter 0.6s ease;
        }
        .map-card:hover iframe { filter: none; } /* hoveril päris värvides kaart */
        .map-card-foot {
            display: flex; justify-content: space-between; align-items: center; gap: 1rem;
            padding: 1.1rem 1.5rem; border-top: 1px solid rgba(220,167,115,0.15); flex-wrap: wrap;
        }
        .map-card-foot span { font-size: 0.9rem; color: var(--c-muted); display: inline-flex; align-items: center; gap: 0.5rem; }
        .map-card-foot span i { color: var(--c-gold); }
        .map-card-foot a { font-size: 0.76rem; letter-spacing: 1px; text-transform: uppercase; font-weight: 600; color: var(--c-gold); text-decoration: none; display: inline-flex; align-items: center; gap: 0.45rem; transition: var(--transition); }
        .map-card-foot a:hover { gap: 0.75rem; }

        /* Facebook / sotsiaalkaart */
        .social-card {
            display: flex; align-items: center; gap: 1.4rem; text-decoration: none;
            background: var(--c-surface); border: 1px solid rgba(255,255,255,0.03); border-radius: 16px;
            padding: 1.6rem 1.8rem; transition: var(--transition); box-shadow: 0 15px 35px rgba(0,0,0,0.2);
        }
        .social-card:hover { transform: translateY(-5px); border-color: rgba(220,167,115,0.35); box-shadow: 0 30px 60px rgba(0,0,0,0.55); }
        .social-fb {
            width: 52px; height: 52px; flex: 0 0 52px; border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            background: var(--c-bg); border: 1px solid var(--c-gold); color: var(--c-gold); font-size: 1.2rem;
            transition: var(--transition);
        }
        .social-card:hover .social-fb { background: var(--c-gold); color: var(--c-bg); }
        .social-txt { display: flex; flex-direction: column; gap: 0.25rem; flex: 1; }
        .social-txt strong { color: var(--c-cream); font-size: 1.05rem; font-weight: 600; }
        .social-txt span { color: var(--c-muted); font-size: 0.88rem; }
        .social-go { color: var(--c-muted); transition: var(--transition); }
        .social-card:hover .social-go { color: var(--c-gold); transform: translateX(4px); }

        /* "Hea teada" kaart */
        .visit-card {
            display: flex; gap: 1.1rem; align-items: flex-start;
            background: rgba(220,167,115,0.05); border: 1px solid rgba(220,167,115,0.18);
            border-radius: 16px; padding: 1.6rem 1.8rem;
        }
        .visit-card i { color: var(--c-gold); font-size: 1.15rem; margin-top: 3px; }
        .visit-card p { margin: 0; color: var(--c-muted); font-size: 0.95rem; line-height: 1.7; }
        .visit-card strong { color: var(--c-cream); font-weight: 600; }

        /* CTA riba */
        .contact-cta { padding-bottom: clamp(5rem, 8vw, 8rem); }
        .contact-cta-box {
            text-align: center; background: var(--c-surface); border-radius: 20px;
            border: 1px solid rgba(255,255,255,0.02); border-top: 3px solid var(--c-gold);
            padding: clamp(3.5rem, 6vw, 6rem) clamp(1.6rem, 4vw, 4rem);
            box-shadow: 0 30px 70px rgba(0,0,0,0.4);
        }
        .contact-cta-box h2 { font-family: var(--f-serif); font-size: var(--text-h2); font-weight: 300; letter-spacing: -1px; margin-bottom: 1.4rem; }
        .contact-cta-box h2 em { color: var(--c-gold); font-style: italic; }
        .contact-cta-box p { color: var(--c-muted); font-size: var(--text-p); max-width: 620px; margin: 0 auto 2.8rem; line-height: 1.8; }

        /* Mobiilimenüüs on nüüd 7 linki */
        body.menu-open .mobile-menu a:nth-child(7) { animation-delay: 0.46s; }

        /* --- Kontakti responsiivsus --- */
        @media (max-width: 1200px) {
            .contact-split { grid-template-columns: 1fr; }
        }
        @media (max-width: 900px) {
            .form-row-2 { grid-template-columns: 1fr; gap: 0; }
        }
        @media (max-width: 600px) {
            .contact-grid { grid-template-columns: 1fr; }
            .contact-form-card { padding: 2.2rem 1.4rem; }
            .contact-form-foot { flex-direction: column; align-items: stretch; text-align: center; }
            .contact-form-foot .magnetic-wrap { display: block; }
            .contact-form-foot .btn-cta { width: 100%; }
            .contact-guard { justify-content: center; }
            .map-card iframe { height: 300px; }
            .crumbs { gap: 0.6rem; }
        }

        /* =====================================================================
           JSON-SISULEHTEDE BLOKID (views/page.php) + galerii/lightbox
           ===================================================================== */
        .page-body { padding: clamp(3rem, 6vw, 6rem) 0 clamp(4rem, 8vw, 8rem); }
        .page-block { max-width: 940px; margin: 0 auto clamp(2.4rem, 4vw, 3.6rem); }
        .page-block:last-child { margin-bottom: 0; }
        .block-gallery, .block-video { max-width: 1120px; }

        .block-heading { text-align: center; }
        .block-overline { display:block; font-size:0.72rem; letter-spacing:4px; text-transform:uppercase; color:var(--c-muted); font-weight:600; margin-bottom:0.9rem; }
        .block-heading h2 { font-family: var(--f-serif); font-size: var(--text-h2); font-weight: 300; line-height:1.1; letter-spacing:-1px; }
        .block-heading h2 em { color: var(--c-gold); font-style: italic; }

        .block-richtext { color: var(--c-muted); font-size: 1.12rem; line-height: 1.9; }
        .block-richtext p { margin-bottom: 1.3rem; }
        .block-richtext p:last-child { margin-bottom: 0; }
        .block-richtext strong { color: var(--c-cream); font-weight: 600; }
        .block-richtext em { color: var(--c-gold); font-style: italic; }
        .block-richtext a, .check-list a, .pricetiers-foot a { color: var(--c-gold); text-decoration: underline; text-underline-offset: 3px; }
        .block-richtext ul, .block-richtext ol { margin: 0 0 1.3rem 1.4rem; }
        .block-richtext li { margin-bottom: 0.6rem; }

        /* Checklist */
        .check-list { list-style: none; display: grid; gap: 0.9rem; }
        .check-list > li { display: flex; align-items: flex-start; gap: 1rem; color: var(--c-muted); font-size: 1.08rem; line-height: 1.6; }
        .check-list > li i { color: var(--c-gold); font-size: 0.95rem; margin-top: 5px; flex: 0 0 auto; }
        .check-list > li span strong { color: var(--c-cream); }
        .block-checklist h3 { font-family: var(--f-serif); font-size: 1.9rem; font-weight: 400; margin-bottom: 1.6rem; color: var(--c-cream); }

        /* Facts */
        .facts-row { display: flex; flex-wrap: wrap; gap: 1.2rem; justify-content: center; }
        .fact-card { flex: 1 1 200px; max-width: 300px; background: var(--c-surface); border: 1px solid rgba(220,167,115,0.18); border-left: 3px solid var(--c-gold); border-radius: 14px; padding: 1.8rem 2rem; text-align: center; }
        .fact-card i { color: var(--c-gold); font-size: 1.4rem; margin-bottom: 0.9rem; display: block; }
        .fact-label { display: block; font-size: 0.72rem; letter-spacing: 2px; text-transform: uppercase; color: var(--c-muted); font-weight: 600; margin-bottom: 0.5rem; }
        .fact-value { display: block; font-family: var(--f-serif); font-size: 1.5rem; color: var(--c-cream); }

        /* Price tiers */
        .pricetiers-note { text-align:center; font-size:0.75rem; letter-spacing:2px; text-transform:uppercase; color:var(--c-muted); font-weight:600; margin-bottom:1.4rem; }
        .pricetiers-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1rem; }
        .tier-card { background: var(--c-surface); border: 1px solid rgba(255,255,255,0.04); border-radius: 14px; padding: 1.6rem 1rem; text-align: center; transition: var(--transition); }
        .tier-card:hover { border-color: rgba(220,167,115,0.4); transform: translateY(-4px); }
        .tier-range { display: block; font-size: 0.92rem; color: var(--c-muted); margin-bottom: 0.7rem; }
        .tier-price { display: block; font-family: var(--f-serif); font-size: 2rem; color: var(--c-gold); font-weight: 600; }
        .pricetiers-foot { margin-top: 1.6rem; font-size: 0.92rem; color: var(--c-muted); line-height: 1.7; }
        .pricetiers-foot a { color: var(--c-gold); }

        /* Video */
        .video-frame { border-radius: 18px; overflow: hidden; box-shadow: 0 40px 90px rgba(0,0,0,0.55); border: 1px solid rgba(220,167,115,0.2); background: #000; }
        .video-frame video { display: block; width: 100%; height: auto; }

        /* CTA box */
        .page-cta-box { text-align:center; background: var(--c-surface); border-radius:20px; border:1px solid rgba(255,255,255,0.02); border-top:3px solid var(--c-gold); padding: clamp(3rem,6vw,5.5rem) clamp(1.6rem,4vw,4rem); box-shadow:0 30px 70px rgba(0,0,0,0.4); }
        .page-cta-box h2 { font-family:var(--f-serif); font-size:var(--text-h2); font-weight:300; letter-spacing:-1px; margin-bottom:1.3rem; }
        .page-cta-box h2 em { color:var(--c-gold); font-style:italic; }
        .page-cta-box p { color:var(--c-muted); font-size:var(--text-p); max-width:620px; margin:0 auto 2.6rem; line-height:1.8; }

        /* Divider */
        .block-divider { display:flex; align-items:center; justify-content:center; gap:1.2rem; color:var(--c-gold); }
        .block-divider span { height:1px; width:min(120px,22vw); background:linear-gradient(to right, transparent, rgba(220,167,115,0.4)); }
        .block-divider span:last-child { background:linear-gradient(to left, transparent, rgba(220,167,115,0.4)); }
        .block-divider i { font-size:0.85rem; opacity:0.85; }

        /* --- GALERII RUUDUSTIK --- */
        .pg-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0.85rem; }
        .pg-cell { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; background: var(--c-surface); box-shadow: 0 12px 26px rgba(0,0,0,0.35); cursor: zoom-in; }
        .pg-cell img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.16,1,0.3,1), filter 0.5s ease; filter: brightness(0.94); }
        .pg-cell:hover img { transform: scale(1.07); filter: brightness(1.05); }
        .pg-cell-zoom { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.3rem; opacity: 0; background: rgba(17,15,13,0.35); transition: opacity 0.35s ease; }
        .pg-cell:hover .pg-cell-zoom { opacity: 1; }
        .pg-gallery.is-room { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
        /* Piiratud galerii: peidetud ruudud + "+N" kate viimasel nähtaval (vt grill_gallery_html $limit) */
        .pg-cell.pg-hidden { display: none; }
        .pg-cell.pg-more::after {
            content: attr(data-more); position: absolute; inset: 0; z-index: 2;
            display: flex; align-items: center; justify-content: center;
            background: rgba(17,15,13,0.62); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);
            color: var(--c-gold); font-family: var(--f-serif); font-size: 2rem; font-weight: 500; letter-spacing: 1px;
            transition: background 0.35s ease;
        }
        .pg-cell.pg-more:hover::after { background: rgba(17,15,13,0.45); }

        /* --- LIGHTBOX --- */
        body.lb-lock { overflow: hidden; }
        .lightbox { position: fixed; inset: 0; z-index: 3000; background: rgba(10,9,8,0.96); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); display: none; align-items: center; justify-content: center; }
        .lightbox.open { display: flex; animation: paneEntrance 0.35s ease; }
        .lb-stage { margin: 0; max-width: 90vw; max-height: 84vh; display: flex; flex-direction: column; align-items: center; gap: 1rem; }
        .lb-stage img { max-width: 90vw; max-height: 80vh; border-radius: 10px; box-shadow: 0 40px 100px rgba(0,0,0,0.7); transition: opacity 0.3s ease; }
        .lb-count { color: var(--c-muted); font-size: 0.85rem; letter-spacing: 1px; }
        .lb-close, .lb-nav { position: absolute; background: rgba(34,29,26,0.7); border: 1px solid rgba(220,167,115,0.3); color: var(--c-cream); width: 52px; height: 52px; border-radius: 50%; cursor: pointer; font-size: 1.1rem; display: flex; align-items: center; justify-content: center; transition: var(--transition); z-index: 2; }
        .lb-close:hover, .lb-nav:hover { background: var(--c-gold); color: var(--c-bg); }
        .lb-close { top: 1.5rem; right: 1.5rem; }
        .lb-prev { left: 1.5rem; top: 50%; transform: translateY(-50%); }
        .lb-next { right: 1.5rem; top: 50%; transform: translateY(-50%); }

        /* =====================================================================
           KALENDER 2026 (views/kalender.php) + avalehe ürituste ruudustik
           ===================================================================== */
        .cal-timeline { position: relative; max-width: 1000px; margin: 0 auto; }
        .cal-month { margin-bottom: clamp(2.5rem, 4vw, 4rem); }
        .cal-month-label { display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.8rem; }
        .cal-month-name { font-family: var(--f-serif); font-size: clamp(1.8rem, 3vw, 2.6rem); color: var(--c-gold); font-weight: 400; white-space: nowrap; }
        .cal-month-label::after { content: ''; flex: 1; height: 1px; background: linear-gradient(to right, rgba(220,167,115,0.4), transparent); }
        .cal-events { display: grid; gap: 1.4rem; }

        .cal-card { display: grid; grid-template-columns: 220px 1fr; background: var(--c-surface); border: 1px solid rgba(255,255,255,0.03); border-radius: 18px; overflow: hidden; transition: var(--transition); box-shadow: 0 15px 35px rgba(0,0,0,0.25); }
        .cal-card:hover { transform: translateY(-6px); border-color: rgba(220,167,115,0.35); box-shadow: 0 40px 80px rgba(0,0,0,0.6); }
        .cal-card.is-featured { border-color: rgba(220,167,115,0.5); }
        .cal-card-media { position: relative; background: #14110f; display: flex; align-items: center; justify-content: center; padding: 1.2rem; }
        .cal-card-media img { width: 100%; height: 100%; max-height: 220px; object-fit: contain; }
        .cal-badge { position: absolute; top: 1rem; left: 1rem; background: var(--c-gold); color: var(--c-bg); font-size: 0.68rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; padding: 0.35rem 0.8rem; border-radius: 20px; }
        .cal-card-body { padding: clamp(1.8rem, 2.5vw, 2.6rem); }
        .cal-date { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--c-gold); font-weight: 600; font-size: 0.85rem; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 0.9rem; }
        .cal-card-body h3 { font-family: var(--f-serif); font-size: clamp(1.7rem, 2.6vw, 2.3rem); font-weight: 400; margin-bottom: 0.5rem; }
        .cal-cat { display: block; color: var(--c-gold); font-size: 0.9rem; margin-bottom: 1rem; opacity: 0.85; }
        .cal-card-body p { color: var(--c-muted); font-size: 1.02rem; line-height: 1.7; margin-bottom: 1.6rem; }
        .cal-card-foot { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
        .cal-loc { color: var(--c-muted); font-size: 0.92rem; display: inline-flex; align-items: center; gap: 0.5rem; }
        .cal-loc i { color: var(--c-gold); }
        .cal-link { color: var(--c-gold); font-weight: 600; font-size: 0.8rem; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem; transition: var(--transition); }
        .cal-link:hover { gap: 0.8rem; }

        /* Avalehe ürituste ruudustik (pane-tiim) */
        .events-hub-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.4rem; }
        .event-mini { display: flex; flex-direction: column; gap: 0.55rem; text-decoration: none; background: var(--c-surface); border: 1px solid rgba(255,255,255,0.03); border-radius: 16px; padding: 2rem; transition: var(--transition); box-shadow: 0 15px 35px rgba(0,0,0,0.2); }
        .event-mini:hover { transform: translateY(-6px); border-color: rgba(220,167,115,0.4); box-shadow: 0 30px 60px rgba(0,0,0,0.55); }
        .event-mini.is-featured { border-color: rgba(220,167,115,0.5); background: linear-gradient(160deg, rgba(220,167,115,0.08), var(--c-surface) 60%); }
        .event-mini-date { color: var(--c-gold); font-weight: 600; font-size: 0.82rem; letter-spacing: 1px; text-transform: uppercase; display: inline-flex; align-items: center; gap: 0.5rem; }
        .event-mini h4 { font-family: var(--f-serif); font-size: 1.7rem; font-weight: 400; color: var(--c-cream); }
        .event-mini-cat { color: var(--c-muted); font-size: 0.92rem; }
        .event-mini-loc { color: var(--c-muted); font-size: 0.9rem; display: inline-flex; align-items: center; gap: 0.5rem; }
        .event-mini-loc i { color: var(--c-gold); }
        .event-mini-go { margin-top: auto; padding-top: 0.8rem; color: var(--c-gold); font-size: 0.78rem; letter-spacing: 1px; text-transform: uppercase; font-weight: 600; display: inline-flex; align-items: center; gap: 0.5rem; transition: var(--transition); }
        .event-mini:hover .event-mini-go { gap: 0.85rem; }
        .events-hub-actions { display: flex; align-items: center; justify-content: center; gap: 2.5rem; flex-wrap: wrap; margin-top: 3.5rem; }
        .hub-textlink { color: var(--c-cream); text-decoration: none; font-weight: 600; font-size: 0.9rem; display: inline-flex; align-items: center; gap: 0.5rem; transition: var(--transition); border-bottom: 1px solid rgba(220,167,115,0.35); padding-bottom: 3px; }
        .hub-textlink:hover { color: var(--c-gold); gap: 0.8rem; }

        /* Avalehe majutuse kaardid (klikitav hub-card) */
        .room-card-link { display: block; text-decoration: none; background: var(--c-surface); }
        .room-card-link .card-content h3 { color: var(--c-cream); }
        .room-card-more { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 1.4rem; color: var(--c-gold); font-size: 0.78rem; letter-spacing: 1px; text-transform: uppercase; font-weight: 600; transition: var(--transition); }
        .room-card-link:hover .room-card-more { gap: 0.85rem; }

        /* =====================================================================
           MAJUTUS (views/majutus.php)
           ===================================================================== */
        .room-jump { display: flex; flex-wrap: wrap; gap: 0.6rem; justify-content: center; margin-bottom: 1rem; }
        .room-jump a { font-size: 0.8rem; color: var(--c-cream); text-decoration: none; padding: 0.5rem 1.1rem; border-radius: 50px; border: 1px solid rgba(220,167,115,0.3); background: rgba(220,167,115,0.06); transition: var(--transition); }
        .room-jump a:hover { background: var(--c-gold); color: var(--c-bg); border-color: var(--c-gold); }

        .room-section { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: clamp(2rem, 4vw, 4rem); align-items: center; padding: clamp(2.5rem, 4vw, 4rem) 0; border-bottom: 1px solid rgba(255,255,255,0.04); scroll-margin-top: 120px; }
        .room-section.is-flip .room-info { order: 2; }
        .room-cap { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--c-gold); font-size: 0.78rem; letter-spacing: 2px; text-transform: uppercase; font-weight: 600; margin-bottom: 1rem; }
        .room-info h2 { font-family: var(--f-serif); font-size: clamp(2.2rem, 3.5vw, 3.2rem); font-weight: 300; margin-bottom: 0.8rem; }
        .room-view { color: var(--c-muted); font-size: 1.02rem; display: flex; align-items: center; gap: 0.6rem; margin-bottom: 1.6rem; }
        .room-view i { color: var(--c-gold); }
        .room-features { margin-bottom: 1.8rem; }
        .room-price { display: flex; align-items: center; gap: 0.7rem; font-family: var(--f-serif); font-size: 1.3rem; color: var(--c-cream); margin-bottom: 2rem; line-height: 1.5; }
        .room-price i { color: var(--c-gold); font-size: 1rem; }
        .room-price strong { color: var(--c-gold); }
        .room-media .pg-gallery { grid-template-columns: repeat(2, 1fr); }

        .breakfast-section { padding-top: clamp(3rem, 5vw, 5rem); }
        .breakfast-intro { text-align: center; color: var(--c-muted); font-size: 1.1rem; max-width: 720px; margin: 0 auto 2.6rem; line-height: 1.8; padding: 0 1rem; }
        .breakfast-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.6rem; max-width: 820px; margin: 0 auto; }
        .breakfast-card { background: var(--c-surface); border: 1px solid rgba(255,255,255,0.03); border-radius: 16px; padding: 2.4rem; text-align: center; }
        .breakfast-card i { color: var(--c-gold); font-size: 2rem; margin-bottom: 1.2rem; }
        .breakfast-card h4 { font-family: var(--f-serif); font-size: 1.7rem; font-weight: 400; margin-bottom: 0.8rem; }
        .breakfast-card p { color: var(--c-muted); font-size: 0.98rem; line-height: 1.65; margin-bottom: 1rem; }
        .breakfast-price { display: inline-block; color: var(--c-gold); font-weight: 700; font-size: 1.05rem; }
        .breakfast-note { text-align: center; color: var(--c-muted); font-size: 0.92rem; max-width: 640px; margin: 2.2rem auto 0; padding: 0 1rem; line-height: 1.7; }
        .breakfast-note i { color: var(--c-gold); }

        /* Footer kiirlingid */
        .footer-quicklinks { display: flex; flex-direction: column; gap: 0.7rem; }
        .footer-quicklinks a { color: var(--c-muted); text-decoration: none; font-size: 1rem; transition: var(--transition); width: fit-content; }
        .footer-quicklinks a:hover { color: var(--c-gold); transform: translateX(5px); }

        /* --- Alamlehtede responsiivsus --- */
        @media (max-width: 900px) {
            .cal-card { grid-template-columns: 1fr; }
            .cal-card-media { height: 200px; }
            .room-section { grid-template-columns: 1fr; gap: 2rem; }
            .room-section.is-flip .room-info { order: 0; }
            .room-media { order: 2; }
            body.menu-open .mobile-menu a:nth-child(8) { animation-delay: 0.40s; }
            body.menu-open .mobile-menu a:nth-child(9) { animation-delay: 0.44s; }
            body.menu-open .mobile-menu a:nth-child(10) { animation-delay: 0.48s; }
        }
        @media (max-width: 600px) {
            .pg-gallery, .pg-gallery.is-room, .room-media .pg-gallery { grid-template-columns: repeat(2, 1fr); gap: 0.6rem; }
            .facts-row { flex-direction: column; }
            .fact-card { max-width: none; }
            .events-hub-actions { flex-direction: column; gap: 1.6rem; }
            .lb-close { top: 0.8rem; right: 0.8rem; width: 46px; height: 46px; }
            .lb-prev { left: 0.5rem; } .lb-next { right: 0.5rem; }
            .mobile-menu { padding: 6.5rem 1rem 2rem; gap: 0.1rem; }
            .mobile-menu a { font-size: clamp(1.5rem, 6vw, 2rem); }
        }

        /* =====================================================================
           KÜLALISTE TAGASISIDE — täislaiuses lint (äärest ääreni) laial ekraanil,
           et korraga mahuks rohkem arvustusi kõrvuti ja kerida oleks vähem.
           Lint on nüüd section.reviews otsene laps (mitte .container sees).
           ===================================================================== */
        section.reviews { overflow: hidden; } /* väldi lehe horisontaalset ülevoolu */
        .reviews-track {
            padding-left: clamp(1.4rem, 5vw, 5rem);
            padding-right: clamp(1.4rem, 5vw, 5rem);
            scroll-padding-left: clamp(1.4rem, 5vw, 5rem);
        }
        @media (min-width: 1025px) {
            .reviews-track { gap: 2.4rem; }
            /* Kompaktsemad kaardid, et laial ekraanil mahuks rohkem kõrvuti */
            .review-card { min-width: 400px; max-width: 440px; padding: 3.4rem 3.2rem; }
            .review-card p { font-size: 1.45rem; line-height: 1.6; margin-bottom: 2rem; }
        }
        @media (max-width: 600px) {
            .reviews-track { padding-left: 1.4rem; padding-right: 1.4rem; scroll-padding-left: 1.4rem; }
        }

        /* --- LAUA BRONEERIMINE (Intras vidin; nupud avavad TeekoReserve.open(), vt _footer.php) --- */
        .bbq-reserve-fab {
            position: fixed; right: clamp(1.2rem, 3vw, 2.2rem); bottom: clamp(1.2rem, 3vw, 2.2rem); z-index: 950;
            display: inline-flex; align-items: center; gap: 0.6rem;
            padding: 0.95rem 1.7rem; border-radius: 50px;
            background: rgba(26, 23, 21, 0.82); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
            border: 1px solid rgba(220, 167, 115, 0.55); color: var(--c-gold);
            font-family: var(--f-sans); font-size: 0.72rem; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;
            cursor: pointer; box-shadow: 0 12px 35px rgba(0, 0, 0, 0.45);
            transition: background 0.4s, color 0.4s, border-color 0.4s, box-shadow 0.4s, transform 0.4s, opacity 0.3s;
            animation: fabIn 1s cubic-bezier(0.16, 1, 0.3, 1) 1.2s backwards;
        }
        .bbq-reserve-fab i { font-size: 0.85rem; }
        .bbq-reserve-fab:hover { background: var(--c-gold); color: var(--c-bg); border-color: var(--c-gold); transform: translateY(-3px); box-shadow: 0 18px 45px rgba(220, 167, 115, 0.35); }
        @keyframes fabIn { from { opacity: 0; transform: translateY(20px); } }
        body.menu-open .bbq-reserve-fab { opacity: 0; pointer-events: none; }
        @media (max-width: 600px) { .bbq-reserve-fab { padding: 0.85rem 1.3rem; font-size: 0.66rem; letter-spacing: 1.5px; } }

        .contact-reserve { text-align: center; margin-top: 3.2rem; }
        .contact-reserve p { color: var(--c-muted); font-size: 1.05rem; margin-bottom: 1.6rem; }

        /* --- KAARDIBLOKK (Maa-ameti ortofoto, vt views/page.php 'map') --- */
        .block-map .map-frame {
            border-radius: 24px; overflow: hidden; position: relative;
            border: 1px solid rgba(220, 167, 115, 0.28);
            box-shadow: 0 35px 90px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(0,0,0,0.4) inset;
        }
        #pg-map { height: clamp(340px, 52vh, 500px); width: 100%; background: var(--c-charcoal); z-index: 1; }
        #pg-map .leaflet-control-attribution { background: rgba(17,15,13,0.75); color: var(--c-muted); font-size: 0.62rem; }
        #pg-map .leaflet-control-attribution a { color: var(--c-gold); }
        #pg-map .leaflet-bar a { background: rgba(26,23,21,0.92); color: var(--c-cream); border-color: rgba(220,167,115,0.25); }
        #pg-map .leaflet-bar a:hover { background: var(--c-gold); color: var(--c-bg); }
        .map-pin-wrap { pointer-events: none; }
        .map-pin {
            position: absolute; left: 50%; top: 0; transform: translateX(-50%);
            width: 40px; height: 40px; border-radius: 50% 50% 50% 4px;
            background: var(--c-gold); color: var(--c-bg);
            display: flex; align-items: center; justify-content: center; font-size: 1.05rem;
            box-shadow: 0 12px 30px rgba(0,0,0,0.55), 0 0 0 3px rgba(220,167,115,0.35);
            transform: translateX(-50%) rotate(-45deg);
        }
        .map-pin i { transform: rotate(45deg); }
        .map-pin-dot {
            position: absolute; left: 50%; bottom: -4px; width: 30px; height: 9px;
            transform: translateX(-50%); border-radius: 50%;
            background: radial-gradient(ellipse, rgba(0,0,0,0.5), transparent 70%);
        }
        .map-actions {
            display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
            gap: 0.9rem; margin-top: 1.8rem;
        }
        .map-actions a, .map-actions .copy-email, .map-actions .map-address {
            display: inline-flex; align-items: center; gap: 0.55rem;
            padding: 0.75rem 1.4rem; border-radius: 50px;
            border: 1px solid rgba(220,167,115,0.3); background: rgba(34,29,26,0.6);
            color: var(--c-cream); font-size: 0.82rem; font-weight: 500; letter-spacing: 0.3px;
            text-decoration: none; cursor: pointer; transition: var(--transition);
        }
        .map-actions .map-address { cursor: default; color: var(--c-muted); }
        .map-actions a:hover, .map-actions .copy-email:hover { border-color: var(--c-gold); color: var(--c-gold); transform: translateY(-2px); }
        .map-actions i { color: var(--c-gold); font-size: 0.9rem; }
        @media (max-width: 600px) { .map-actions a, .map-actions .copy-email, .map-actions .map-address { padding: 0.65rem 1.1rem; font-size: 0.76rem; } }

        /* --- E-POE MODAL (pood uuenemas → Grillimaailm; vt _footer.php) --- */
        .eshop-overlay {
            position: fixed; inset: 0; z-index: 10500; display: none;
            align-items: center; justify-content: center; padding: 1.4rem;
            background: rgba(10, 8, 7, 0.78); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
        }
        .eshop-overlay.active { display: flex; }
        .eshop-box {
            position: relative; width: 100%; max-width: 580px; text-align: center;
            background: linear-gradient(165deg, var(--c-charcoal), var(--c-bg));
            border: 1px solid rgba(220, 167, 115, 0.35); border-radius: 28px;
            padding: clamp(2.4rem, 5vw, 3.6rem) clamp(1.6rem, 4vw, 3rem);
            box-shadow: 0 50px 120px rgba(0, 0, 0, 0.7), 0 0 60px rgba(220, 167, 115, 0.08) inset;
            animation: eshopIn 0.55s cubic-bezier(0.16, 1, 0.3, 1);
            max-height: 92vh; overflow-y: auto;
        }
        @keyframes eshopIn { from { opacity: 0; transform: translateY(26px) scale(0.97); } }
        .eshop-close {
            position: absolute; top: 1.1rem; right: 1.1rem; width: 42px; height: 42px;
            border: 1px solid rgba(220,167,115,0.25); border-radius: 50%; background: transparent;
            color: var(--c-muted); font-size: 1rem; cursor: pointer; transition: var(--transition);
        }
        .eshop-close:hover { color: var(--c-bg); background: var(--c-gold); border-color: var(--c-gold); }
        .eshop-logos { display: flex; align-items: center; justify-content: center; gap: clamp(0.9rem, 3vw, 1.6rem); margin-bottom: 2.2rem; }
        .eshop-logo { flex: none; display: flex; align-items: center; justify-content: center; border-radius: 18px; padding: 1rem 1.2rem; }
        .eshop-logo img { display: block; height: clamp(56px, 9vw, 76px); width: auto; }
        .eshop-logo.is-farm { background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(220, 167, 115, 0.2); }
        .eshop-logo.is-gm { background: #FDFBF7; border: 1px solid rgba(220, 167, 115, 0.2); box-shadow: 0 14px 34px rgba(0,0,0,0.35); }
        /* Teekonna-animatsioon: säde liigub talu logolt Grillimaailma poole */
        .eshop-route { position: relative; flex: 1; max-width: 130px; height: 22px; }
        .eshop-track {
            position: absolute; left: 0; right: 0; top: 50%;
            border-top: 2px dashed rgba(220, 167, 115, 0.35);
        }
        .eshop-spark {
            position: absolute; top: 50%; left: 0; transform: translate(-50%, -50%);
            color: var(--c-amber); font-size: 1.05rem;
            filter: drop-shadow(0 0 8px rgba(230, 92, 0, 0.7));
            animation: sparkTravel 2.4s ease-in-out infinite;
        }
        @keyframes sparkTravel {
            0%   { left: 4%;  opacity: 0; transform: translate(-50%, -50%) scale(0.7); }
            18%  { opacity: 1; transform: translate(-50%, -50%) scale(1); }
            82%  { opacity: 1; transform: translate(-50%, -50%) scale(1); }
            100% { left: 96%; opacity: 0; transform: translate(-50%, -50%) scale(0.7); }
        }
        .eshop-overline {
            display: block; font-size: 0.7rem; letter-spacing: 4px; text-transform: uppercase;
            color: var(--c-gold); font-weight: 700; margin-bottom: 0.9rem;
        }
        .eshop-box h2 {
            font-family: var(--f-serif); font-weight: 300; font-size: clamp(2.4rem, 5vw, 3.4rem);
            line-height: 1.1; margin-bottom: 1.2rem;
        }
        .eshop-box h2 em { color: var(--c-gold); font-style: italic; font-weight: 400; }
        .eshop-text { color: var(--c-muted); font-size: 1.02rem; line-height: 1.75; max-width: 420px; margin: 0 auto 2.2rem; }
        .eshop-text strong { color: var(--c-cream); font-weight: 600; }
        .eshop-later {
            display: block; margin: 1.4rem auto 0; background: none; border: none;
            color: var(--c-muted); font-family: var(--f-sans); font-size: 0.8rem; letter-spacing: 1px;
            text-transform: uppercase; cursor: pointer; padding: 0.5rem 1rem; transition: var(--transition);
            text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(168,158,149,0.4);
        }
        .eshop-later:hover { color: var(--c-gold); }
        @media (max-width: 480px) {
            .eshop-logo { padding: 0.7rem 0.8rem; border-radius: 14px; }
            .eshop-logo img { height: 48px; }
            .eshop-route { max-width: 70px; }
            .eshop-close { width: 36px; height: 36px; top: 0.8rem; right: 0.8rem; font-size: 0.85rem; }
            .eshop-logos { margin-top: 1.6rem; }
        }

        /* --- KEELEVALIK (päises; päris lingid, hover/fookus avab) --- */
        .lang-switch { position: relative; }
        .lang-current {
            display: inline-flex; align-items: center; gap: 0.5rem;
            background: transparent; border: 1px solid rgba(220,167,115,0.28); border-radius: 50px;
            color: var(--c-cream); font-family: var(--f-sans); font-size: 0.72rem; font-weight: 600;
            letter-spacing: 1.5px; padding: 0.55rem 1rem; cursor: pointer; transition: var(--transition);
        }
        .lang-current i.fa-globe { color: var(--c-gold); font-size: 0.8rem; }
        .lang-switch:hover .lang-current,
        .lang-switch:focus-within .lang-current { border-color: var(--c-gold); color: var(--c-gold); }
        .lang-menu {
            position: absolute; top: calc(100% + 12px); right: 0; min-width: 172px; z-index: 1300;
            background: rgba(26,23,21,0.98); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
            border: 1px solid rgba(220,167,115,0.2); border-radius: 16px; padding: 0.5rem;
            box-shadow: 0 25px 60px rgba(0,0,0,0.55);
            opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity 0.3s, transform 0.3s, visibility 0.3s;
        }
        .lang-switch:hover .lang-menu,
        .lang-switch:focus-within .lang-menu { opacity: 1; visibility: visible; transform: translateY(0); }
        .lang-menu a {
            display: flex; align-items: center; gap: 0.7rem; padding: 0.7rem 0.9rem; border-radius: 10px;
            color: var(--c-cream); text-decoration: none; font-size: 0.9rem; font-weight: 500; transition: var(--transition);
        }
        .lang-menu a .lang-code { font-size: 0.68rem; font-weight: 700; letter-spacing: 1px; color: var(--c-muted); min-width: 22px; }
        .lang-menu a:hover { background: rgba(255,255,255,0.04); color: var(--c-gold); }
        .lang-menu a:hover .lang-code { color: var(--c-gold); }
        .lang-menu a.active { color: var(--c-gold); }
        .lang-menu a.active .lang-code { color: var(--c-gold); }
        .lang-menu a[aria-current] { position: relative; }

        /* Keelevalik mobiilimenüü põhjas */
        .mobile-lang { display: flex; gap: 0.6rem; margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px solid rgba(220,167,115,0.15); }
        .mobile-lang a {
            display: inline-flex; align-items: center; justify-content: center;
            min-width: 46px; padding: 0.5rem 0.7rem; border-radius: 50px;
            border: 1px solid rgba(220,167,115,0.25); color: var(--c-cream);
            font-size: 0.72rem; font-weight: 700; letter-spacing: 1px; text-decoration: none; transition: var(--transition);
        }
        .mobile-lang a.active, .mobile-lang a:hover { background: var(--c-gold); color: var(--c-bg); border-color: var(--c-gold); }