/* Generated Styles */
        
             @font-face {
                 font-family: 'PlayfairDisplay';
                 src: url('./fonts/PlayfairDisplay-Bold.ttf') format('truetype');
                 font-weight: 700;
                 font-style: normal;
             }

             @font-face {
                 font-family: 'PlayfairDisplay';
                 src: url('./fonts/PlayfairDisplay-BoldItalic.ttf') format('truetype');
                 font-weight: 700;
                 font-style: italic;
             }

             @font-face {
                 font-family: 'PlayfairDisplay';
                 src: url('./fonts/PlayfairDisplay-Italic.ttf') format('truetype');
                 font-weight: 400;
                 font-style: italic;
             }

             @font-face {
                 font-family: 'PlayfairDisplay';
                 src: url('./fonts/PlayfairDisplay-Regular.ttf') format('truetype');
                 font-weight: 400;
                 font-style: normal;
             }
        
        * { box-sizing: border-box; margin: 0; padding: 0; }
        
    :root {
        --fs-sm: 0.85rem;
        --fs-base: 1.1rem;
        --fs-md: 1.25rem;
        --fs-lg: 1.5rem;
        --fs-xl: 2.5rem;
        
        --space-xs: 8px;
        --space-sm: 16px;
        --space-md: 24px;
        --space-lg: 32px;
        --space-xl: 40px;
        --space-xxl: 80px;
        
        --sidebar-width: 260px;
        --mobile-header-height: 60px;
        --container-max-width: 900px;
        --container-padding: 60px;
        --container-padding-mobile: 20px;
        
        --border-light: rgba(0,0,0,0.05);
        --text-muted: #9ca3af;
        --text-caption: #6b7280;
    }

        body { 
            font-family: 'PlayfairDisplay', -apple-system, system-ui, sans-serif; 
            min-height: 100vh; 
            color: #616161; 
            background: #ffffff; 
            margin: 0;
            font-size: var(--fs-base);
        }
        
        /* Base Nav Elements */
        /* Base Nav Elements */
        aside h2 { 
            font-size: var(--fs-lg); 
            font-family: 'PlayfairDisplay', sans-serif; 
            font-weight: 700; 
            font-style: normal; 
            margin-bottom: var(--space-lg); 
            color: var(--nav-text-color, #616161); 
        }
        aside h2 a {
            font-size: inherit;
            font-weight: inherit;
            font-style: inherit;
            font-family: inherit;
            color: inherit;
            text-decoration: none;
        }
        aside a { text-decoration: none; color: var(--nav-text-color, #616161); font-weight: 500; font-size: var(--fs-base); display: block; padding: 0; border-radius: 6px; }
        aside a:hover { background-color: transparent !important; background: transparent !important; box-shadow: none !important; text-decoration: underline !important; color: var(--nav-text-color, #616161); }
        .lang-switcher { display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-md); }
        aside.topbar-nav .lang-switcher { margin-top: 0; }
        .lang-link { text-decoration: none; color: var(--nav-text-color, #616161); font-size: var(--fs-sm); font-weight: 500; opacity: 0.6; padding: 0; transition: opacity 0.2s; }
        .lang-link:hover { opacity: 0.9; }
        .lang-link.active { opacity: 1; }

        /* Dynamic Layout */
        
            body { display: block; }
            aside { 
                background: #ffffff; padding: var(--space-sm) var(--space-xl); 
                display: flex; align-items: center; justify-content: space-between; 
                position: relative; z-index: 1000;
            }
            aside h2 { margin-bottom: 0 !important; }
            aside ul { list-style: none; display: flex; gap: var(--space-md); margin: 0; padding: 0; }
            aside li { margin-bottom: 0; }
            aside a, .lang-link { font-size: var(--fs-base) !important; }
            aside h2 a { font-size: inherit !important; font-weight: inherit !important; }
            main { padding: 0; margin: 0; width: 100%; display: flex; flex-direction: column; min-height: 100vh; }
        

        /* Asset Download Link */
        .asset-download-link {
            display: inline-block;
            background: #ffffff;
            text-decoration: underline;
            color: inherit;
        }

        /* Enquire Link and Pricing Actions */
        .artwork-actions {
            margin-top: 1.5rem;
        }
        
        .artwork-price {
            display: block;
            line-height: 1;
        }

        .enquire-link {
            display: block;
            width: 100%;
            text-align: left;
            font-size: var(--fs-base);
            font-family: inherit;
            font-weight: 500;
            text-decoration: underline;
            text-underline-offset: 4px;
            color: inherit;
        }

        /* Container for Constrained Content */
        .container {
            max-width: var(--container-max-width);
            margin: 0 auto;
            padding: 0 var(--container-padding);
            width: 100%;
        }
        @media (max-width: 768px) {
            .container { padding: 0 var(--container-padding-mobile); }
        }
        
        /* Immersive Mode Support */
        body:has(.immersive-gallery) {
            overflow-x: hidden;
        }
        body:has(.content > .immersive-gallery:first-child) aside {
            background-color: transparent !important;
            z-index: 1001;
        }
        body:has(.content > .immersive-gallery:first-child) aside.topbar-nav {
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
        }
        body:has(.content > .immersive-gallery:first-child) aside.topbar-nav .nav-submenu {
            background: transparent !important;
            border: none !important;
            box-shadow: none !important;
        }
        body:has(.immersive-gallery) main {
            margin: 0 !important;
            max-width: none !important;
        }
        body:has(.content > .immersive-gallery:first-child) main {
            padding: 0 !important;
        }
        body:has(.content > .immersive-gallery:first-child) .mobile-header {
            background-color: transparent !important;
            z-index: 1001;
            position: absolute; /* Allow scrolling */
        }
        @media (max-width: 768px) {
            body:has(.content > .immersive-gallery:first-child) main {
                padding-top: 0 !important;
            }
        }

        h1 { font-size: var(--fs-xl); font-weight: 800; margin-bottom: var(--space-md); color: inherit; }
        .content { flex: 1; line-height: 1.7; font-size: var(--fs-base); color: inherit; padding-bottom: var(--space-xl); }
        .content a { color: #4372d0; }
        img { max-width: 100%; height: auto; display: block; }
        figure { margin: var(--space-md) 0; }
        figcaption { text-align: center; font-size: var(--fs-sm); color: #616161; margin-top: var(--space-xs); font-style: italic; }
        .caption { font-size: var(--fs-sm); color: #616161; margin-top: var(--space-xs); font-style: italic; text-align: center; }
        .caption-left { font-size: var(--fs-sm); color: #616161; margin-top: var(--space-xs); font-style: italic; text-align: left; width: 100%; }
        .main-footer {
            padding: var(--space-xl) var(--space-xl);
            background-color: #ffffff;
            color: #000000;
            font-size: var(--fs-base);
        }
        .main-footer .container {
            max-width: var(--container-width);
            margin: 0 auto;
        }

        .sub-footer { 
            padding: var(--space-lg) 0 var(--space-xl); 
            font-size: var(--fs-sm); 
            color: #000000; 
            background-color: #ffffff;
        }
        .footer-inner { display: flex; justify-content: space-between; align-items: center; padding: 0 var(--space-xl); }
        @media (max-width: 768px) {
            .sub-footer { padding-top: var(--space-md); padding-bottom: var(--space-md); }
            .footer-inner { flex-direction: column; gap: var(--space-xs); text-align: center; padding: 0 var(--container-padding-mobile); }
            .main-footer { padding: var(--space-lg) var(--container-padding-mobile); }
        }

        /* Mobile Header */
        .mobile-header { 
            display: none; 
            position: fixed; top: 0; left: 0; right: 0; height: var(--mobile-header-height); 
            background: #ffffff; 
            border-bottom: 1px solid var(--border-light); 
            z-index: 1000; align-items: center; justify-content: space-between; padding: 0 var(--container-padding-mobile); 
        }
        .mobile-header h2 { 
            font-size: var(--fs-base); 
            margin: 0; 
            color: var(--nav-text-color, #616161);
            font-family: 'PlayfairDisplay', sans-serif;
            font-weight: 700; 
            font-style: normal;
        }
        .mobile-header .menu-btn { background: none; border: none; padding: 8px; cursor: pointer; color: var(--nav-text-color, #616161); }
        
        /* Mobile Menu Modal */
        .mobile-menu { 
            position: fixed; inset: 0; 
            background: #ffffff; 
            z-index: 2000; display: none; flex-direction: column; padding: var(--space-xl) var(--space-md); 
            opacity: 0; transform: translateY(-10px); transition: all 0.3s ease; 
        }
        .mobile-menu.active { display: flex; opacity: 1; transform: translateY(0); }
        .mobile-menu .close-btn { align-self: flex-end; background: none; border: none; padding: 8px; cursor: pointer; color: #616161; margin-bottom: var(--space-lg); }
        .mobile-menu ul { list-style: none; padding: 0; margin: 0; }
        .mobile-menu li { margin-bottom: var(--space-md); font-size: var(--fs-base); font-weight: 500; }
        .mobile-menu li a { text-decoration: none; color: inherit; }
        .mobile-menu .lang-switcher { margin-top: auto; border-top: 1px solid var(--border-light); padding-top: var(--space-lg); }

        @media (max-width: 768px) {
            body { display: block !important; }
            aside { display: none !important; }
            main { padding-top: var(--mobile-header-height) !important; }
            .mobile-header { display: flex !important; }
        }

        /* Submenu Styling */
        .nav-item-parent { position: relative; }
        .nav-parent-toggle { display: flex; align-items: center; justify-content: space-between; cursor: pointer; color: var(--nav-text-color, #616161); font-weight: 500; }
        .nav-parent-toggle:hover { opacity: 0.8; }
        .nav-submenu { display: none; padding-left: var(--space-md) !important; margin-top: var(--space-xs) !important; }
        .nav-item-parent.open > .nav-submenu { display: block; }
        
        /* Chevron rotation */
        .nav-parent-toggle .chevron { transition: transform 0.2s; }
        .nav-item-parent.open > .nav-parent-toggle .chevron { transform: rotate(180deg); }

        /* Topbar specific submenu overrides */
        aside.topbar-nav .nav-item-parent { position: relative; }
        aside.topbar-nav .nav-submenu { 
            position: absolute; 
            top: 100%; 
            left: 0; 
            background: #ffffff; 
            border: 1px solid rgba(0,0,0,0.1);
            min-width: 200px;
            padding: var(--space-sm) !important; 
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            border-radius: 4px;
            flex-direction: column !important;
            gap: 4px !important;
            margin-top: 8px !important;
        }
        aside.topbar-nav .nav-submenu::before {
            content: '';
            position: absolute;
            top: -10px;
            left: 0;
            width: 100%;
            height: 10px;
        }
        @media (min-width: 769px) {
            aside.topbar-nav .nav-item-parent:hover > .nav-submenu { display: flex; }
            aside.topbar-nav .nav-item-parent:hover > .nav-parent-toggle .chevron { transform: rotate(180deg); }
        }

        /* Generated Classes (Replacing Inline Styles) */

        /* Artworks Detail */
        .artwork-detail-container { display: flex; flex-direction: column; align-items: center; width: 100%; }
        .artwork-content-wrapper { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: var(--space-xl); width: 100%; }
        .artwork-desc-block { max-width: 100%; }

        /* Widgets Media & Links */
        .widget-img-full, .widget-video { width: 100%; height: auto; display: block; }
        .widget-img-max { max-width: 100%; height: auto; display: block; }
        .widget-audio { width: 100%; }
        .widget-link-block { text-decoration: none; color: inherit; display: block; }
        .widget-link-contents { display: contents; }
        .widget-fallback { padding: 20px; border: 1px dashed #ccc; }

        /* News / Blog Post Layout */
        .news-post-header { margin-top: var(--space-xl); margin-bottom: var(--space-xl); }
        .news-post-img { width: 100%; height: auto; margin-bottom: var(--space-lg); }
        .news-post-title { margin-bottom: 0; }
        .news-post-date { font-size: 0.85rem; color: var(--text-main); margin-top: var(--space-xs); }

        /* News Article List */
        .news-article-preview { margin-bottom: 60px; border-bottom: 1px solid var(--border-light); padding-bottom: 40px; }
        .news-article-img { width: 100%; height: auto; margin-bottom: 20px; transition: box-shadow 0.2s ease, transform 0.2s ease; }
        .news-article-title { margin-bottom: 5px; }
        .news-article-desc { margin-bottom: 20px; }
        .news-article-date { font-size: 0.85rem; color: var(--text-main); margin-bottom: 15px; }
        .news-article-link-wrapper { text-decoration: none; color: #616161 !important; display: block; }
        .news-article-link-wrapper:hover .news-article-title { text-decoration: underline; }
        .news-article-link-wrapper:hover .news-article-img { box-shadow: 0 10px 30px rgba(0,0,0,0.15); transform: translateY(-3px); }
        .news-empty-state { text-align: center; color: var(--text-muted); padding: 40px 0; }

        /* News Pagination */
        .news-pagination-container { display: flex; justify-content: space-between; align-items: center; padding: 20px 0; border-top: 1px solid var(--border-light); margin-top: 40px; font-size: 0.9rem; }
        .news-pagination-prev { flex: 1; }
        .news-pagination-numbers { flex: 1; text-align: center; display: flex; gap: 8px; justify-content: center; }
        .news-pagination-next { flex: 1; text-align: right; }
        .news-pagination-link { text-decoration: none; color: var(--text-main); font-weight: 600; }

        /* News Feed Global */
        .news-feed-container { margin-top: var(--space-xl); }
        .news-feed-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-lg); }
        .news-feed-title { margin: 0; }
        .news-rss-link { color: var(--text-main); font-size: var(--fs-sm); font-weight: 600; text-decoration: none; }

        /* Forms */
        input, textarea, select {
            width: 100%;
            padding: 10px 12px;
            margin-bottom: var(--space-md);
            border: 1px solid #000;
            background: #fff;
            color: #000;
            font-family: inherit;
            font-size: var(--fs-base);
            border-radius: 4px;
        }
        input:focus, textarea:focus, select:focus {
            outline: 2px solid #000;
            outline-offset: 2px;
        }
        button, input[type="submit"], input[type="button"] {
            padding: 10px 20px;
            background: #000;
            color: #fff;
            border: 1px solid #000;
            cursor: pointer;
            font-family: inherit;
            font-size: var(--fs-base);
            border-radius: 4px;
            transition: all 0.2s ease;
        }
        button:hover, input[type="submit"]:hover, input[type="button"]:hover {
            background: #fff;
            color: #000;
        }
        label {
            display: block;
            margin-bottom: var(--space-xs);
            font-weight: 500;
        }