/*
Theme Name: Research Theme
Theme URI: https://yoursite.com
Description: Minimal custom theme for historical research website
Author: Your Name
Version: 1.0
*/

/* Reset & Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Prevent horizontal scroll but allow vertical */
    position: relative;
}

body {
    font-family: 'SchoolBook', Georgia, serif;
    line-height: 1.6;
    color: #333;
    background: #b1bffa;
    min-height: 100vh;
}

/* Header */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    background: #b1bffa;
    padding: 8px 30px 8px 30px;
    z-index: 1000;
}

.site-header::after {
    content: "";
    display: block;
    width: calc(100% - 50px); /* Changed to 50px - adds 5px on each side */
    height: 1px;
    background-color: white;
    position: absolute;
    bottom: 0;
    left: 25px; /* Changed to 25px - 5px closer to edge */
    right: 25px; /* Changed to 25px - 5px closer to edge */
}

.header-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

/* Nav sits absolute on the left, title stays truly centered */
.main-navigation {
    position: absolute;
    left: 0;
}

.site-title {
    /* already has grid-column: 2 — remove that below */
}
/* Load Custom Font */
@font-face {
    font-family: 'SchoolBook';
    src: url('fonts/SchoolBook Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Reset & Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Navigation */
.main-navigation {
    z-index: 10;
}

.main-navigation ul {
    display: flex;
    list-style: none;
    gap: 50px;
    margin: 0;
    padding: 0;
}

.main-navigation li a,
.main-navigation a {
    color: white !important;
    text-decoration: none !important;
    font-size: 16px !important;
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 500;
    padding: 4px 10px;
    border: 2px solid transparent;
    border-radius: 14px; 
    transition: all 0.3s ease;
    display: inline-block;
}

.main-navigation li a:hover,
.main-navigation a:hover {
    color: #6E1626 !important;
    background-color: #b1bffa !important;
    border: 2px solid #6E1626 !important;
    opacity: 1 !important;
}

/* Active/Current page state */
.main-navigation .current-menu-item a,
.main-navigation .current_page_item a,
.main-navigation li.current-menu-item a,
.main-navigation li.current_page_item a {
    color: white !important;
    background-color: #6E1626 !important;
    border: 2px solid #6E1626 !important;
}

/* Remove hover effect on active page - keep it looking the same */
.main-navigation .current-menu-item a:hover,
.main-navigation .current_page_item a:hover {
    color: white !important;
    background-color: #6E1626 !important;
    border: 2px solid #6E1626 !important; /* Same color as background */
}

.site-title {
    color: white;
    font-size: 18px;
    font-weight: bold;
    margin: 0;
    white-space: nowrap;
}

.site-title a {
    color: white !important;
    text-decoration: none;
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;
    font-size: 18px !important;
    padding: 4px 10px;
    border: 2px solid transparent;
    border-radius: 14px; 
    transition: all 0.3s ease;
    display: inline-block;
}

/*.site-title a:hover {
    color: #6E1626 !important;
    background-color: #b1bffa !important;
    border: 2px solid #6E1626 !important;
    opacity: 1 !important;
}
/* Content Area - add padding for fixed header */
.site-content {
    overflow: hidden;
    background: #b1bffa;
    min-height: calc(100vh - 80px);
}
/* Default Page Content */
.page-content {
    max-width: 800px;
    margin: 0 auto;
    padding: 60px 40px;
    background: #b1bffa;
    color: white;
}

.page-content h1 {
    margin-bottom: 30px;
    color: white;
}

/* Hide page title on homepage */
.home .page-content h1 {
    display: none;
}

.page-content p {
    margin-bottom: 20px;
    line-height: 1.7;
    font-family: 'SchoolBook', Georgia, serif;
    font-size: 18px;
}


/* Utility Classes */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Hamburger Menu Button - Hidden on Desktop */
.mobile-menu-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    z-index: 1000;
    position: relative;
}

.mobile-menu-toggle span {
    display: block;
    width: 25px;
    height: 3px;
    background: white;
    margin: 5px 0;
    transition: 0.3s;
}

.mobile-menu-toggle.active span:nth-child(1) {
    transform: rotate(-45deg) translate(-5px, 6px);
}

.mobile-menu-toggle.active span:nth-child(2) {
    opacity: 0;
}

.mobile-menu-toggle.active span:nth-child(3) {
    transform: rotate(45deg) translate(-5px, -6px);
}

/* Medium screens - reduce menu spacing to keep title centered */
/* Gentle compression 1450-1600px */
@media (max-width: 1600px) and (min-width: 1471px) {
    .main-navigation ul {
        gap: 10px;
    }

    .main-navigation li a,
    .main-navigation a {
        font-size: 14px !important;
        padding: 3px 7px;
    }

    .site-title a {
        font-size: 15px !important;
    }
}

/* Medium screens - reduce menu spacing to keep title centered */
@media (max-width: 1470px) and (min-width: 1261px) {
    .main-navigation ul {
        gap: 6px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 14px !important;
        padding: 2px 4px;
    }
    
    .site-title {
        font-size: 14px;
    }
    
    .site-title a {
        font-size: 14px !important;
    }

    .lang-link,
    .lang-sep {
        font-size: 14px !important;
    }
}

/* Apply same compact styling from 1260px down to 1101px (same as 1100px range) */
@media (max-width: 1260px) and (min-width: 1153px) {
    .main-navigation ul {
        gap: 6px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 11px !important;
        padding: 2px 4px;
    }
    
    .site-title {
        font-size: 12px;
    }
    
    .site-title a {
        font-size: 12px !important;
    }
}

/* Extra compact for narrow screens */
@media (max-width: 1152px) and (min-width: 1001px) {
    .main-navigation ul {
        gap: 4px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 10px !important;
        padding: 2px 3px;
    }
    
    .site-title {
        font-size: 11px;
    }
    
    .site-title a {
        font-size: 11px !important;
    }
}



/* Mobile Responsive Styles */
@media (max-width: 1000px) {
    .site-header {
        padding: 15px 20px;
    }
    
    .header-container {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    
    /* Show hamburger menu on mobile */
    .mobile-menu-toggle {
        display: block;
        order: 1;
    }
    
    /* Title next to hamburger */
.site-title {
    position: static;
    transform: none;
    font-size: 14px;
    order: 2;
    margin: 0;
    flex: 1;
    text-align: center;
    white-space: normal; /* Allow text to wrap on mobile */
}
    
    /* Hide navigation by default on mobile */
    .main-navigation {
    position: fixed;
    top: 0;
    left: -100%;
    width: 280px;
    height: 100vh;
    background: #b1bffa;
    padding: 120px 30px 30px; /* Increased from 80px to 120px */
    transition: left 0.3s ease;
    z-index: 999;
    box-shadow: 2px 0 10px rgba(0,0,0,0.3);
}
    
    /* Show navigation when active */
    .main-navigation.active {
        left: 0;
    }
    
    /* Stack menu items vertically in sidebar */
    .main-navigation ul {
        flex-direction: column;
        gap: 20px;
    }
    
    .main-navigation li a {
        font-size: 18px;
    }
    
    /* Overlay when menu is open */
    body.menu-open::after {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 998;
    }
    
    /* Adjust white line for mobile */
    .site-header::after {
        width: calc(100% - 40px);
        left: 20px;
        right: 20px;
    }
    
    /* Make page content more mobile-friendly */
    .page-content {
        padding: 40px 20px !important;
    }
    
    /* Strong override for body text size */
    body .page-content p,
    .page-content p {
        font-size: 17px !important; /* Increased from 15px to 17px */
        line-height: 1.6 !important;
    }
    
    /* Override body font size */
    body {
        font-size: 17px !important; /* Increased from 15px to 17px */
    }
}

@media (max-width: 480px) {
    .site-title {
        font-size: 12px;
    }
    
    .page-content {
        padding: 30px 15px !important;
    }
    
    /* Even smaller for very small screens */
    body .page-content p,
    .page-content p {
        font-size: 16px !important; /* Increased from 14px to 16px */
        line-height: 1.5 !important;
    }
    
    body {
        font-size: 16px !important; /* Increased from 14px to 16px */
    }
}

/* Homepage Scroll Sections */
.burgundy-section {
    background: #b1bffa;
    color: white;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: none;
    padding: 80px 40px 60px 40px;
}

.burgundy-section .entry-content p {
    font-size: 16px !important; /* Increased from 18px default */
    line-height: 1.7;
}
.white-section {
    background: white !important;
    color: #333;
    padding: 60px 30px 60px 30px !important;
    max-width: none !important;
    margin-top: 0 !important;
    width: 100% !important;
}

.white-section h2 {
    color: #b1bffa;
    margin-bottom: 30px;
    font-size: 32px;
}

.white-section p {
    color: #333 !important;
    font-family: 'SchoolBook', Georgia, serif;
    font-size: 18px;
    line-height: 1.7;
}

.white-content {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 40px;
}

/* Scroll indicator - adjusted gradient */
.scroll-indicator {
    position: fixed;
    width: 100%;
    height: 60px;
    z-index: 1001;
    transition: top 0.3s ease, bottom 0.3s ease, background 0.3s ease;
    pointer-events: none;
    bottom: 0;
    top: auto;
    background: linear-gradient(to bottom, rgba(177, 191, 250, 0) 0%, rgba(255, 255, 255, 0.6) 100%);
}

.site-header {
    z-index: 1000;
}

.scroll-indicator.at-bottom {
    top: auto;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(177, 191, 250, 0) 0%, rgba(255, 255, 255, 0.6) 100%);
}

.scroll-indicator.at-top {
    top: 54px;
    bottom: auto;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.6) 0%, rgba(177, 191, 250, 0) 100%);
}

@media (max-width: 768px) {
    .scroll-indicator {
        height: 50px;
    }
    .scroll-indicator.at-top {
        top: 68px; /* Increased to account for taller hamburger menu header */
    }
}

.site-footer,
footer {
    display: none !important;
}

css/* REMOVE all the previous pink box CSS and use this instead */

/* Highlighter effect on navigation menu 
.main-navigation li a {
    background-color: #fbcbcd;
    padding: 1px 2px;
    border-radius: 3px;
    display: inline-block;
}*/

/* Highlighter effect on paragraphs 
.page-content p,
.entry-content p,
.white-content p {
    background-color: #fbcbcd;
    padding: 1px 2px;
    display: inline;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    line-height: 1.8;
} */

/* Highlighter effect on headings 
.white-content h2,
.page-content h2 {
    background-color: #fbcbcd;
    padding: 1px 2px;
    display: inline;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}*/

/* Reset white section background */
.white-section {
    background: white !important;
}

/* Remove previous pink box styles */
div.white-content {
    background-color: transparent !important;
    padding: 0 40px !important;
}

/* Highlighter effect on navigation menu - stronger version 
.main-navigation li a,
.main-navigation a {
    background-color: #fbcbcd !important;
    padding: 1px 2px !important;
    border-radius: 2px;
    display: inline-block;
    color: white !important;
}*/

/* Highlighter effect on site title 
.site-title a {
    background-color: #fbcbcd !important;
    padding: 1px 2px !important;
    border-radius: 3px;
    display: inline-block;
}*/

/* Body text black */
.page-content p,
.entry-content p,
.white-content p,
.burgundy-section p {
    color: #000 !important; /* Black text */
}


/* Two column layout for image + text - WIDER VERSION */
.two-column-layout {
    display: flex;
    gap: 80px; /* Increased back to 80px */
    align-items: flex-start;
    max-width: 1800px; /* Increased back to 1800px */
    margin: 0 auto;
    width: 95%; /* Increased back to 95% */
    padding: 80px 40px;
}

.image-column {
    flex: 0 0 50%; /* Increased from 45% */
    max-width: 750px; /* Increased from 600px */
}

.image-column img {
    width: 100%;
    height: auto;
    display: block;
    /*border: 3px solid #333;*/
}

.text-column {
    flex: 0 0 38%;
    max-width: 600px;
    padding-top: 60px; /* Increased from 40px - moves text lower */
}

.text-column p {
    font-size: 18px; /* Increased from 17px - bigger text */
    line-height: 1.75;
    margin-bottom: 15px;
}
/* Adjust burgundy section for two columns - CENTERED */
.burgundy-section {
    padding: 100px 60px 80px 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    box-sizing: border-box;
    max-width: none;
}

/* Mobile responsive */
@media (max-width: 968px) {
    .two-column-layout {
        flex-direction: column;
        gap: 40px;
    }
    
    .image-column {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* Work Sans Variable Font */
@font-face {
    font-family: 'Work Sans';
    src: url('fonts/WorkSans-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900; /* Supports all weights from 100-900 */
    font-style: normal;
}

@font-face {
    font-family: 'Work Sans';
    src: url('fonts/WorkSans-Italic-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: italic;
}

/* Apply Work Sans to everything */
body {
    font-family: 'Work Sans', sans-serif !important;
}

.page-content p,
.entry-content p,
.white-content p,
.text-column p {
    font-family: 'Work Sans', sans-serif !important;
}

/* These should already be using Work Sans but ensuring it */
.main-navigation li a,
.main-navigation a,
.site-title a {
    font-family: 'Work Sans', sans-serif !important;
}

/* Depo Page Layout */
.depo-page {
    background: white;
    padding-top: 20px;
    min-height: 100vh;
}

.depo-container {
    display: flex;
    max-width: 1600px;
    margin: 0 auto;
    padding: 40px;
    gap: 60px;
}

/* Left Sidebar */
.depo-sidebar {
    flex: 0 0 200px;
}

.depo-sidebar h2 {
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    font-size: 24px;
    margin-bottom: 30px;
    color: #000;
}

.publication-categories {
    list-style: none;
    padding: 0;
    margin: 0;
}

.publication-categories li {
    margin-bottom: 15px;
}

.publication-categories a {
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
    color: #000;
    text-decoration: none;
    display: block;
}

.publication-categories a:hover {
    opacity: 0.7;
}

/* Depo Page Layout */
.depo-page {
    background: white;
    padding-top: 20px;
    min-height: 100vh;
}

.depo-container {
    display: flex;
    max-width: 1800px; /* Wider to accommodate 3 columns better */
    margin: 0 auto;
    padding: 60px 40px;
    gap: 80px; /* More space between sidebar and content */
    align-items: flex-start;
}

/* Left Sidebar */
.depo-sidebar {
    flex: 0 0 180px; /* Slightly narrower */
}

.depo-sidebar h2 {
    font-family: 'Work Sans', sans-serif;
    font-weight: 700;
    font-size: 20px; /* Slightly smaller */
    margin-bottom: 30px;
    color: #000;
}

.publication-categories {
    list-style: none;
    padding: 0;
    margin: 0;
}

.publication-categories li {
    margin-bottom: 15px;
}

.publication-categories a {
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
    color: #000;
    text-decoration: none;
    display: block;
}

.publication-categories a:hover {
    opacity: 0.7;
}

/* Publications Grid */
.depo-content {
    flex: 1;
    min-width: 0; /* Allows proper flex shrinking */
}

.publications-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 60px 60px;
    width: 100%;
    max-width: 1200px; /* Increased from 900px */
    margin: 0 auto;
}

.publication-item {
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: transform 0.3s ease;
}

.publication-item:hover {
    transform: translateY(-5px);
}

.publication-image {
    width: 100% !important;
    max-width: 238px !important;
    margin-bottom: 15px;
    border: 2px solid #000;
    aspect-ratio: 3/4; /* Force consistent proportions */
    overflow: hidden;
}

.publication-image img {
    width: 100% !important;
    height: 100% !important;
    display: block;
    object-fit: cover; /* Crop to fit */
}

.publication-title {
    font-family: 'Work Sans', sans-serif;
    font-weight: 400; /* Changed from 700 - normal weight */
    font-size: 15px;
    color: #000;
    margin: 0; /* Changed from 0 0 5px 0 - remove bottom margin */
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1.4; /* Add consistent line height */
}

.publication-year {
    font-family: 'Work Sans', sans-serif;
    font-weight: 700; /* Keep bold */
    font-size: 15px;
    color: #000;
    margin: 0;
    text-align: center;
    line-height: 1.4; /* Match title line height */
}

/* Responsive */
@media (max-width: 1200px) {
    .publications-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .depo-container {
        flex-direction: column;
        gap: 30px;
    }
    
    .publications-grid {
        grid-template-columns: 1fr;
    }
}

.depo-sidebar h2 a {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

/*
.depo-sidebar h2 a:hover {
    opacity: 0.7;
}

.depo-sidebar h2 a.active {
    font-weight: 700;
    color: #6E1626;
}

/* Medium screens - smooth scaling */
/* Medium screens - smooth scaling */
@media (max-width: 1770px) {
    .main-navigation ul {
        gap: 35px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 15px !important;
        padding: 4px 9px;
    }
    
    .site-title a {
        font-size: 16px !important;
        padding: 4px 9px;
    }
    
    .site-title {
        left: 54%; /* Increased */
    }
}

@media (max-width: 1600px) and (min-width: 1471px) {
    .main-navigation ul {
        gap: 10px;
    }

    .main-navigation li a,
    .main-navigation a {
        font-size: 14px !important;
        padding: 3px 7px;
    }

    .site-title a {
        font-size: 15px !important;
    }
}

@media (max-width: 1400px) {
    .main-navigation ul {
        gap: 25px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 14px !important;
        padding: 3px 8px;
    }
    
    .site-title a {
        font-size: 14px !important;
        padding: 3px 8px;
    }
    
    .site-title {
        left: 56%; /* Increased */
    }
}

@media (max-width: 1200px) {
    .main-navigation ul {
        gap: 20px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 13px !important;
        padding: 3px 7px;
    }
    
    .site-title a {
        font-size: 13px !important;
    }
    
    .site-title {
        left: 58%; /* Increased */
    }
}

@media (max-width: 1024px) {
    .main-navigation ul {
        gap: 18px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 12px !important;
        padding: 3px 6px;
    }
    
    .site-title a {
        font-size: 12px !important;
    }
    
    .site-title {
        left: 60%; /* Increased */
    }
}

@media (max-width: 900px) {
    .main-navigation ul {
        gap: 15px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 11px !important;
        padding: 2px 5px;
    }
    
    .site-title a {
        font-size: 11px !important;
    }
    
    .site-title {
        left: 62%; /* Increased */
    }
}

@media (max-width: 800px) {
    .main-navigation ul {
        gap: 12px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 10px !important;
        padding: 2px 4px;
    }
    
    .site-title a {
        font-size: 10px !important;
    }
    
    .site-title {
        left: 65%; /* Maximum shift */
    }
}

@media (max-width: 768px) {
    .main-navigation ul {
        gap: 10px;
    }
    
    .main-navigation li a,
    .main-navigation a {
        font-size: 9px !important;
        padding: 2px 3px;
    }
    
    .site-title a {
        font-size: 9px !important;
    }
    
    .site-title {
        left: 68%; /* Even more right */
    }
}
.depo-sidebar {
    display: flex;
    flex-direction: column;
}

.sidebar-note {
    margin-top: 15px; /* Same as the spacing between filter items */
    padding: 0;
}

.sidebar-note p {
    font-family: 'Work Sans', sans-serif;
    font-size: 12px;
    line-height: 1.6;
    color: #000;
    margin: 0;
}

.carousel {
    position: relative;
    width: 100%;
    overflow: hidden;
    border: 3px solid #000;
    box-sizing: border-box;
    background: #000;
}

.carousel-track {
    position: relative;
    width: 100%;
    height: 600px;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    overflow: hidden;
}

.carousel-slide {
    grid-area: 1 / 1 / 2 / 2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    min-width: 100%;
    min-height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    background: #000;
}

.carousel-slide.active {
    opacity: 1;
    z-index: 1;
}

/* Hide arrows and dots */
.carousel-prev,
.carousel-next,
.carousel-dots {
    display: none;
}
/* Expandable "+ več" section */
.expand-link {
    color: #b1bffa;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    display: block;
    margin-top: 15px;
}

.expand-link:hover {
    text-decoration: underline;
}

.expandable-content {
    margin-top: 20px;
}

.more-sections {
    display: flex;
    flex-direction: column;
    gap: 25px;
    margin-top: 20px;
}

.more-section-item h3 {
    font-family: 'Work Sans', sans-serif;
    font-size: 24px;
    font-weight: 400;
    margin-bottom: 0; /* Changed from 10px to 0 */
    color: #000;
    margin-bottom: 0.0001em !important;
    padding-bottom: 0 !important;
    min-height: 80px;
}

.more-section-item p {
    font-family: 'Libre Baskerville', serif;
    font-size: 14px;
    line-height: 1.6;
    margin-top: 0; /* Add this to remove top margin */
    margin-bottom: 20px;
    color: #000;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Več o projektu link - burgundy red */
.burgundy-section .expand-link {
    color: #6E1626 !important;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    display: block !important;
    margin-top: 40px;
    cursor: pointer;
    transition: opacity 0.3s ease;
    position: relative !important;
}

.burgundy-section .expand-link:hover {
    opacity: 0.7;  /* Slightly transparent on hover */
}

/* White section with grid */
.white-section {
    background: #fff;
    padding: 60px 30px 60px 30px;
    margin-top: 0;
}
.white-content {
    max-width: 1600px;  /* Wider container */
    margin: 0 auto;
}

.more-sections-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 60px;  /* More gap between items */
}

.more-section-item {
    text-align: left;
}

.more-section-item a {
    text-decoration: none;
    color: #000;
    display: flex;
    flex-direction: column;
}



/* Headings and text ABOVE image */
/* Much bigger, bolder headings */
.more-section-item h3 {
    font-family: 'Work Sans', sans-serif;
    font-weight: 800;  /* Extra bold */
    font-size: 32px;  /* Much bigger */
    margin: 0 0 15px 0;
    color: #000;
    order: 1;
}

@media (max-width: 1437px) and (min-width: 1001px) {
    html[lang^="en"] .more-section-item h3 {
        font-size: 30px;
    }
}

.more-section-item p {
    font-family: 'Work Sans', sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: #000;
    margin: 0 0 25px 0;
    order: 2;
}

/* Hover image wrapper */
.hover-image-wrap {
    position: relative;
    width: 100%;
    order: 3;
    border: 2px solid #000;
    display: block;
    overflow: hidden;
}

.hover-image-wrap .img-bw,
.hover-image-wrap .img-color {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border: none;
}

.hover-image-wrap .img-color {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.more-section-item a:hover .img-color {
    opacity: 1;
}

/*.more-section-item:hover h3 {
    text-decoration: underline;
}
*/
/* Smooth scroll */
html {
    scroll-behavior: smooth;
}

/* Align text with carousel - force text expansion */

/* Fix alignment for 1600-1650px range */
@media (max-width: 1650px) and (min-width: 1601px) {
    .burgundy-section .two-column-layout {
        display: flex;
        align-items: stretch;
        gap: 35px;
    }
    
    .burgundy-section .image-column {
        flex: 0 0 52%;
        max-width: 52%;
    }
    
    .burgundy-section .text-column {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
    }
    
    .burgundy-section .text-column .entry-content {
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    
    .burgundy-section .text-column .entry-content p {
        flex: 0 0 auto;
        margin: 0;
    }
    
    .burgundy-section .text-column .entry-content .expand-link {
        margin-top: 40px !important;
        flex: 0 0 auto;
    }
}

/* Desktop layout: text and carousel same height, + več pinned to bottom */

@media (max-width: 1600px) and (min-width: 1201px) {
    .burgundy-section .two-column-layout {
        display: flex;
        align-items: flex-start;
        gap: 30px;
    }

    .burgundy-section .image-column {
        flex: 0 0 47%;
        max-width: 47%;
    }

    .burgundy-section .carousel-track {
        height: 455px;
    }

    .burgundy-section .text-column {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        padding: 0;
        margin: 0;
        height: 440px;
    }

    .burgundy-section .text-column .entry-content {
        flex: 1;
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .burgundy-section .text-column .entry-content p {
        flex: 0 0 auto;
        margin: 0;
    }

    .burgundy-section .text-column .entry-content .expand-link {
        margin-top: auto;
        flex: 0 0 auto;
    }
}


@media (max-width: 1200px) and (min-width: 1001px) {
    .burgundy-section .two-column-layout {
        gap: 20px;
        align-items: flex-start;
    }

    .burgundy-section .image-column {
        flex: 0 0 42%;
        max-width: 42%;
    }

    .burgundy-section .carousel-track {
        height: 420px;
    }

    .burgundy-section .text-column {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        padding: 0;
        margin: 0;
        height: 420px;
    }

    .burgundy-section .text-column .entry-content {
        flex: 1;
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .burgundy-section .text-column .entry-content p {
        flex: 0 0 auto;
        margin: 0;
    }

    .burgundy-section .text-column .entry-content .expand-link {
        margin-top: 40px !important;
        flex: 0 0 auto;
    }
}

@media (max-width: 1000px) {
    .burgundy-section .two-column-layout {
        gap: 20px;
    }
    
    .burgundy-section .image-column {
        flex: 0 0 35%;  /* 35% for carousel */
        max-width: 35%;
    }
    
    .burgundy-section .carousel-track {
        height: 360px;
    }
}

@media (max-width: 768px) {
    .burgundy-section .two-column-layout {
        flex-direction: column;
        gap: 30px;
    }
    
    .burgundy-section .image-column {
        flex: none;
        max-width: 100%;
    }
    
    .burgundy-section .carousel-track {
        height: 400px;
    }
    
    .burgundy-section .text-column .entry-content .expand-link {
        margin-top: 15px;
    }
}

/* O Projektu Page */
.o-projektu-page {
    max-width: 800px;
    margin: 0 auto;
    padding: 100px 40px 60px 40px;
    background: #b1bffa;
    color: white;
}

.o-projektu-page h1 {
    color: white;
    margin-bottom: 30px;
    font-family: 'Work Sans', sans-serif;
    font-size: 32px;
}

.o-projektu-page .entry-content p {
    font-family: 'Work Sans', sans-serif;  /* Work Sans for paragraphs */
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
    margin-bottom: 20px;
}

.o-projektu-page .entry-content a {
    color:#000;
    text-decoration: underline;
}

.o-projektu-page .entry-content a:hover {
    opacity: 0.8;
}

@media (max-height: 870px) {
    .burgundy-section {
        min-height: 100vh !important;
        padding: 40px 40px 30px 40px;
    }
    
    .two-column-layout {
        gap: 20px;
    }
}

@media (min-height: 871px) {
    .burgundy-section {
        min-height: 100vh !important;
    }
}


/* Footer Styles - 3 Column Layout with Page Links */
.site-footer {
    background: white !important;
    margin-top: 0 !important;
    padding: 15px 30px !important;
    display: block !important;
    width: 100% !important;
    clear: both !important;
}

.footer-separator {
    width: calc(100% - 50px) !important;
    max-width: none !important;
    height: 1px !important;
    background-color: #000 !important;
    margin: 0 0 15px 25px !important;
    display: block !important;
}

/* 3-Column Layout */
.footer-content-wrapper {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 40px !important;
    margin-left: 0 !important;
    margin-right: 25px !important;
}

/* Left Column - Logo */
.footer-left {
    flex: 0 0 auto !important;
}

.footer-logo {
    height: 90px !important;
    width: auto !important;
    display: block !important;
    margin-left: -8px !important;
}

/* Middle Column - Text */
.footer-middle {
    flex: 2 !important;
    padding: 0 20px !important;
}

.footer-middle p {
    font-family: 'Work Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    color: #000 !important;
    margin: 0 !important;
}

/* Right Column - Links */
.footer-right {
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 40px !important;
    align-items: center !important;
}

.footer-link {
    color: #000 !important;
    cursor: pointer !important;
    font-family: 'Work Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important; /* No underline by default */
    transition: opacity 0.3s !important;
    display: inline-block !important;
    white-space: nowrap !important; /* Prevent wrapping */
}

.footer-link:hover {
    opacity: 0.6 !important;
}

/* Mobile Responsive */
@media (max-width: 1024px) {
    .footer-content-wrapper {
        flex-direction: column !important;
        gap: 30px !important;
        align-items: flex-start !important;
    }
    
    .footer-left,
    .footer-middle,
    .footer-right {
        width: 100% !important;
    }
    
    .footer-right {
        align-items: flex-start !important;
    }
}

@media (max-width: 768px) {
    .site-footer {
        padding: 40px 20px 60px !important;
    }
    
    .footer-separator {
        width: calc(100% - 40px) !important;
        margin-left: 20px !important;
    }
    
    .footer-content-wrapper {
        margin-left: 20px !important;
        margin-right: 20px !important;
    }
    
    .footer-logo {
        height: 50px !important;
    }
    
    .footer-right {
        flex-direction: column !important;
        gap: 15px !important;
        align-items: flex-start !important;
    }
}
.dostopnost {
    background: white !important;
    min-height: 100vh !important;
    padding-top: 80px !important;
}

.dostopnost-content {
    max-width: 800px !important;
    margin: 0 auto !important;
    padding: 60px 40px !important;
}

.dostopnost-content h1 {
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 800 !important;
    font-size: 32px !important;
    color: #000 !important;
    margin-bottom: 40px !important;
}

.dostopnost-body {
    font-family: 'Work Sans', sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.7 !important;
    color: #000 !important;
}

.dostopnost-body h2 {
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    color: #000 !important;
    margin-top: 30px !important;
    margin-bottom: 15px !important;
}

.dostopnost-body h3 {
    font-family: 'Work Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 17px !important;
    color: #000 !important;
    margin-top: 25px !important;
    margin-bottom: 10px !important;
}

.dostopnost-body p {
    font-family: 'Work Sans', sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    margin-bottom: 15px !important;
    color: #000 !important;
}

.dostopnost-body ul,
.dostopnost-body ol {
    margin-left: 25px !important;
    margin-bottom: 15px !important;
}

.dostopnost-body li {
    font-family: 'Work Sans', sans-serif !important;
    font-size: 15px !important;
    margin-bottom: 5px !important;
    color: #000 !important;
}

.dostopnost-body a {
    color: #000 !important;
    text-decoration: underline !important;
}

.dostopnost-body a:hover {
    opacity: 0.6 !important;
}

/* Mobile */
@media (max-width: 768px) {
    .dostopnost-content {
        padding: 40px 20px !important;
    }

    .dostopnost-content h1 {
        font-size: 26px !important;
    }
}

/* Remove forced full-height on white section */
.white-section {
    min-height: unset !important;
}

@media (max-width: 1330px) and (min-width: 1261px) {
    .footer-content-wrapper {
        gap: 20px !important;
    }
}

/* Language switcher */
.language-switcher {
    display: flex;
    align-items: center;
    gap: 0;
    position: absolute;
    right: 0;
    padding-right: 12px;
}

.lang-link {
    color: white !important;
    text-decoration: none !important;
    font-family: 'Work Sans', sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    padding: 0;
    border: none !important;
    border-radius: 0 !important;
    background: none !important;
    transition: opacity 0.2s ease;
    white-space: nowrap;
}

.lang-link:hover {
    color: white !important;
    background: none !important;
    border: none !important;
    opacity: 0.7;
}

.lang-active {
    color: #6E1626 !important;
    background: none !important;
    border: none !important;
    font-weight: 800 !important;
}

.lang-sep {
    color: white;
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
    font-weight: 500;
    padding: 0 2px;
}

/* English menu — scale down earlier due to longer item names */
@media (max-width: 1770px) {
    html[lang^="en"] .main-navigation ul {
        gap: 30px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 15px !important;
        padding: 4px 8px;
    }
    html[lang^="en"] .site-title a {
        font-size: 16px !important;
    }
}

@media (max-width: 1600px) {
    html[lang^="en"] .main-navigation ul {
        gap: 20px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 14px !important;
        padding: 3px 7px;
    }
    html[lang^="en"] .site-title a {
        font-size: 15px !important;
    }
}

@media (max-width: 1500px) {
    html[lang^="en"] .main-navigation ul {
        gap: 14px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 13px !important;
        padding: 3px 6px;
    }
    html[lang^="en"] .site-title a {
        font-size: 14px !important;
    }
}

@media (max-width: 1470px) {
    html[lang^="en"] .main-navigation ul {
        gap: 8px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 15px !important;
        padding: 2px 5px;
    }
    html[lang^="en"] .site-title a {
        font-size: 17px !important;
    }
}

@media (max-width: 1420px) {
    html[lang^="en"] .main-navigation ul {
        gap: 6px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 13px !important;
        padding: 3px 4px;
    }
    html[lang^="en"] .site-title a {
        font-size: 14px !important;
    }
}

@media (max-width: 1380px) {
    html[lang^="en"] .main-navigation ul {
        gap: 5px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 12px !important;
        padding: 2px 4px;
    }
    html[lang^="en"] .site-title a {
        font-size: 13px !important;
    }
}

@media (max-width: 1350px) {
    html[lang^="en"] .main-navigation ul {
        gap: 4px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 11px !important;
        padding: 2px 3px;
    }
    html[lang^="en"] .site-title a {
        font-size: 12px !important;
    }
}

@media (max-width: 1200px) {
    html[lang^="en"] .main-navigation ul {
        gap: 3px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 9px !important;
        padding: 1px 2px;
    }
    html[lang^="en"] .site-title a {
        font-size: 10px !important;
    }
}

@media (max-width: 1100px) {
    html[lang^="en"] .main-navigation ul {
        gap: 2px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 8px !important;
        padding: 1px 2px;
    }
    html[lang^="en"] .site-title a {
        font-size: 9px !important;
    }
}

@media (max-width: 1000px) {
    html[lang^="en"] .main-navigation ul {
        gap: 2px;
    }
    html[lang^="en"] .main-navigation li a,
    html[lang^="en"] .main-navigation a {
        font-size: 7px !important;
        padding: 1px 1px;
    }
    html[lang^="en"] .site-title a {
        font-size: 8px !important;
    }
}

/* Scroll indicator adjustments for English nav scaling */
@media (min-width: 1781px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 56px;
    }
}

@media (max-width: 1780px) and (min-width: 1601px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 55px;
    }
}
@media (min-width: 1601px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 55px;
    }
}

@media (max-width: 1600px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 52px;
    }
}

@media (max-width: 1500px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 50px;
    }
}

@media (max-width: 1470px) and (min-width: 1421px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 54px;
    }
}

@media (max-width: 1420px) and (min-width: 1381px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 48px;
    }
}

@media (max-width: 1380px) and (min-width: 1351px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 46px;
    }
}

@media (max-width: 1350px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 44px;
    }
}

@media (max-width: 1200px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 42px;
    }
}

@media (max-width: 1100px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 40px;
    }
}

@media (max-width: 1000px) {
    html[lang^="en"] .scroll-indicator.at-top {
        top: 68px;
    }
}

/* Slovenian nav matching English at 1600px and below */
@media (max-width: 1600px) and (min-width: 1471px) {
    body .main-navigation ul {
        gap: 14px;
    }
    body .main-navigation li a,
    body .main-navigation a {
        font-size: 15px !important;
        padding: 4px 9px;
    }
    body .site-title a {
        font-size: 16px !important;
    }
}

@media (max-width: 1470px) and (min-width: 1261px) {
    body .main-navigation ul {
        gap: 16px;
    }
    body .main-navigation li a,
    body .main-navigation a {
    font-size: 15px !important;
        padding: 2px 5px;
    }
    body .site-title a {
        font-size: 17px !important;
    }
}
/* White section fills full screen with centered content */
.white-section {
    min-height: 100vh !important;
    margin-top: 0 !important;
    padding: 60px 30px !important;
    width: 100% !important;
    box-sizing: border-box;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.white-section .white-content {
    width: 100%;
}

@media (max-width: 1470px) and (min-width: 1201px) {
    .burgundy-section {
        min-height: calc(100vh - 32px);
    }
}

@media (max-width: 1420px) and (min-width: 1265px) {
    html[lang^="sl"] .scroll-indicator.at-top {
        top: 52px;
    }
}

@media (max-width: 1264px) and (min-width: 769px) {
    html[lang^="sl"] .scroll-indicator.at-top {
        top: 48px;
    }
}