/* ==========================================================================
   RESET & GLOBAL
   ========================================================================== */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
}
img,
video {
    max-width: 100%;
}
body {
    overflow-x: hidden;
    background-color: #f5f5f5;
    color: #000;
}
h1, h2, h3, h4, h5, .section-title, .hero-title, .film-title, .event-title {
    font-weight: 400;
}

/* Explicit custom fonts for all heading/title classes (belt-and-suspenders
   to fonts.css — covers .section-title/.hero-title/.film-title/.event-title
   which fonts.css doesn't reference). */
[lang="en"] h1,
[lang="en"] h2,
[lang="en"] h3,
[lang="en"] h4,
[lang="en"] h5,
[lang="en"] .section-title,
[lang="en"] .hero-title,
[lang="en"] .film-title,
[lang="en"] .event-title {
    font-family: "Verdana Custom", Verdana, sans-serif;
}

[lang="ka"] h1,
[lang="ka"] h2,
[lang="ka"] h3,
[lang="ka"] h4,
[lang="ka"] h5,
[lang="ka"] .section-title,
[lang="ka"] .hero-title,
[lang="ka"] .film-title,
[lang="ka"] .event-title {
    font-family: "BPG Pure DejaVu", sans-serif;
}

/* Nav / button / label overrides — Magistral for EN (not bold) */
[lang="en"] nav a,
[lang="en"] button,
[lang="en"] .btn,
[lang="en"] .label {
    font-family: "Magistral", sans-serif;
    font-weight: 400;
}

/* Nav / button / label overrides — BPG Nino for KA */
[lang="ka"] nav a,
[lang="ka"] button,
[lang="ka"] .btn,
[lang="ka"] .label {
    font-family: "BPG Nino Medium Caps", sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}


/* ==========================================================================
   LAYOUT UTILITIES
   ========================================================================== */
.section-padding {
    padding: 60px 5vw;
    margin-bottom: 40px;
}

.section-title {

    font-size: clamp(2rem, 4vw, 2.5rem);
    font-weight: 400;
    color: #030A19;
    margin-bottom: 30px;
    
}
.section-title.gold { color: #E5BC1A; }
.section-title.white { color: #ffffff; }
.section-title.maroon { color: #BE1333; }
.section-divider {
    width: 80px;
    height: 3px;
    background: #C9A227;
    margin: 0 0 30px 0;
}
.section-divider.center {
    margin: 0 auto 30px;
}

/* ==========================================================================
   MAIN HEADER
   ========================================================================== */

:root {
    --header-h: 50px;                /* actual header height (kept in sync by base.js) */
    --submenu-h: 40px;               /* fixed submenu bar height (below the main nav) */
}

.main-header {
    background: transparent;             
    min-height: 50px;                  /* grew taller whenever the festival text wraps */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;

    display: flex;
    align-items: left;

    padding: 0;

    transform: translateY(0);
    transition: transform 0.3s ease;
}


/* ==========================================================================
   EMPTY LEFT NAVIGATION SPACE
   ========================================================================== */

.nav-left-space {
    height: 50px;
    width: 48px;                           /* was 80px — logo sits a bit left */
    flex: 0 0 48px;
    background: rgba(0, 0, 0, 0.7);
}


/* ==========================================================================
   LOGO
   ========================================================================== */

.main-header .logo-area {
    display: flex;
    align-items: flex-start;

    height: 50px;                    /* pinned — the big logo overflows below but mustn't grow the bar */

    position: relative;
    overflow: visible;

    z-index: 1002;

    flex-shrink: 0;
    background: transparent;
}

.biaff-logo-img {
    height: clamp(128px, 14.4vw, 192px);   /* was clamp(160px, 18vw, 240px) — 20% smaller */
    width: auto;
    max-width: none;

    top: 0;
    left: 0;

    display: block;
    flex-shrink: 0;
}


/* ==========================================================================
RIGHT NAVIGATION
========================================================================== */

.header-right {
    display: flex;
    align-items: center;

    min-height: 50px;                   /* grows taller with the festival text */

    background: rgba(0, 0, 0, 0.7);

    flex: 1 1 0;
    min-width: 0;

    padding: 0 0 0 clamp(10px, 1.5vw, 20px);   /* text sits closer to the logo */

    position: relative;
    overflow: visible;
}

.nav-links {
    display: flex;
    align-items: center;

    gap: clamp(14px, 2.5vw, 47px);

    min-height: 100%;                   /* fills the (possibly taller) bar */

    flex: 1 1 auto;
    min-width: 0;

    flex-wrap: nowrap;
    justify-content: flex-start;

    overflow: hidden;
}

.nav-links a {
    text-decoration: none;

    font-size: clamp(13px, 1vw, 17px);
    font-weight: 400;

    color: #fff;
    line-height: 20px;

    white-space: nowrap;


    flex-shrink: 0;
}

.lang-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    flex-shrink: 0;
}

.nav-links a.active,
.nav-links a:hover {
    color: #EFBD08;
}


/* ==========================================================================
   SOCIAL MEDIA ICONS – between nav links and EN/GE
   ========================================================================== */

.nav-social {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
    margin-left: auto;          /* pushes the social+lang group to the far right */
}


.lang-switch {
    padding-right: clamp(14px, 2vw, 30px);
    gap: 10px;
}

.nav-social__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 18px;
    height: 18px;

    color: #fff;
    text-decoration: none;

    transition: color 0.2s ease;
}

.nav-social__link svg {
    width: 18px;
    height: 18px;
    display: block;
}

.nav-social__link:hover,
.nav-social__link:focus {
    color: #EFBD08;
}

.lang-switch a {
    font-size: 18px;
    line-height: 1;
    text-decoration: none;
    filter: grayscale(0%);
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.lang-switch a:hover {
    transform: scale(1.1);
    opacity: 0.85;
}


.main-header.header--no-logo .logo-area {
    display: none;
}

.main-header.header--no-logo .nav-left-space {
    display: none;
}

.main-header.header--no-logo .header-right {
    padding-left: clamp(20px, 3vw, 48px);
}

/* ==========================================================================
HAMBURGER
========================================================================== */

.main-header .hamburger {
    display: none;

    position: fixed;
    top: 0;
    right: 0;

    width: 50px;
    height: 50px;

    margin: 0;
    padding: 0;

    flex-direction: column;
    justify-content: center;
    align-items: center;

    background: #111111;
    border: none;

    cursor: pointer;

    gap: 5px;

    z-index: 1005;
}

.main-header .hamburger span {
    display: block;

    width: 24px;
    height: 2px;

    background: #fff;

    transition: 0.3s;
}


/* ==========================================================================
MOBILE NAVIGATION
========================================================================== */

@media (max-width: 1024px) {

    .nav-left-space {
        background: rgba(0, 0, 0, 0.7);
                   /* was rgba(255,255,255,0.5) – black bar */
    }

   .header-right {
        background: rgba(0, 0, 0, 0.7);
           /* was rgba(255,255,255,0.5) – black bar */
        padding-left: 10px;            /* text sits closer to the logo on mobile */
    }

    .header-actions {
        display: flex;
    }

    /* Hamburger */
    .main-header .hamburger {
        display: flex;
    }

    /* Full-screen mobile navigation */
    .main-header .nav-links {
    display: none;

    position: fixed;

    top: var(--header-h, 50px);
    left: 0;

    width: 100vw;

    height: auto;
    max-height: calc(100vh - var(--header-h, 50px));

    overflow-y: auto;

    background: #ffffff;               /* solid white — was rgba(255,255,255,0.6) */

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);

    flex-direction: column;
    align-items: flex-start;

    padding: 24px 0 18px;

    border-bottom: 1px solid rgba(0, 0, 0, 0.12);

    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);

    z-index: 1004;
}

    .main-header .nav-links.show {
        display: flex;
    }

    /* Navigation links */
    .main-header .nav-links > a,
    .main-header .nav-links .nav-dropdown > a {
        display: block;

        width: 100%;

        padding: 14px 34px;

        text-align: left;

        font-size: clamp(16px, 2vw, 19px);

        white-space: nowrap;

        color: #000;

        text-decoration: none;

        transition: color 0.2s ease;
    }

    .main-header .nav-links a.active,
    .main-header .nav-links a:hover {
        color: #EFBD08;
    }

    /* Dropdown containers */
    .main-header .nav-dropdown {
        display: flex;

        flex-direction: column;

        align-items: stretch;

        width: 100%;
        height: auto;
    }

    /* Dropdown parent */
    .main-header .nav-dropdown > a {
        display: flex;

        align-items: center;
        justify-content: space-between;

        width: 100%;
    }
    .nav-left-space {
        width: 20px;
        flex: 0 0 20px;
    }

    /* Social icons inside the mobile menu */
    .main-header .nav-social {
        display: flex;
        align-items: center;
        gap: 20px;

        width: 100%;

        margin-left: 0;
        padding: 14px 34px;

        flex-shrink: 0;
    }

    .main-header .nav-social__link {
        width: 22px;
        height: 22px;
        color: #111;                 /* dark icons on the white mobile drawer */
    }

    .main-header .nav-social__link svg {
        width: 22px;
        height: 22px;
    }

    /* Dropdown menu */
    .main-header .nav-dropdown-menu {
        position: static;

        display: none;

        width: 100%;

        margin: 0;

        padding: 5px 0 10px;

        background: transparent;

        backdrop-filter: none;
        -webkit-backdrop-filter: none;

        box-shadow: none;

        flex-direction: column;

        gap: 0;
    }

    /* Open dropdown */
    .main-header .nav-dropdown.open > .nav-dropdown-menu {
        display: flex;
    }

    /* Dropdown links */
    .main-header .nav-dropdown-menu a {
        display: block;

        width: 100%;

        padding: 10px 55px;

        color: #333;

        font-size: 15px;

        text-decoration: none;

        white-space: nowrap;
    }

    .main-header .nav-dropdown-menu a:hover {
        color: #EFBD08;
    }

    /* Language switch */
    .main-header .lang-switch {
        display: inline-flex;

        align-items: center;

        gap: 8px;

        padding: 14px 34px;

        flex-shrink: 0;
    }

    .main-header .lang-switch a {
        width: auto;

        padding: 0;

        font-size: clamp(16px, 2vw, 18px);

        color: #111;              /* dark text on the white mobile drawer */
    }

    /* Hide duplicate mobile buttons */
    .header-buttons-mobile {
        display: none !important;
    }

    /* Hamburger X */
    .main-header .hamburger.open span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }

    .main-header .hamburger.open span:nth-child(2) {
        opacity: 0;
    }

    .main-header .hamburger.open span:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -5px);
    }
}

/* ==========================================================================
   MOBILE NAVIGATION ACTION BUTTONS
   ========================================================================== */

.mobile-nav-actions {
    display: none;
}


/* Only show action buttons inside the hamburger menu */
@media (max-width: 1024px) {

    .mobile-nav-actions {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 10px;

        margin-top: 12px;
        padding: 12px 34px 4px;

        background: transparent;
    }

    .mobile-nav-actions a {
        display: block;
        width: 100%;

        /* Match the desktop ACTION BUTTONS BAR design */
        height: 31px;
        line-height: 19px;
        font-size: clamp(12px, 1vw, 17px);
        padding: 6px clamp(12px, 2vw, 20px);
        font-weight: 400;
        
        text-decoration: none;
        text-transform: none;
        transition: all 0.3s ease;
        box-sizing: border-box;

        text-align: center;
  

        background: #fff;
        color: #BE1333;
        border: 1px solid #BE1333;
    }

    .mobile-nav-actions .btn-submit,
    .mobile-nav-actions .btn-accreditation {
        background: #fff;
        color: #BE1333;
        border: 1px solid #BE1333;
    }

    .mobile-nav-actions .btn-accreditation:hover,
    .mobile-nav-actions .btn-submit:hover {
        background: #BE1333;
        color: #fff;
        border: 1px solid transparent;
    }

    /* Hide the desktop button bar completely on mobile */
    .header-actions {
        display: none !important;
    }
}

/* ==========================================================================
   MAIN HEADER – scroll behavior (hidden initially, appears on scroll)
   ========================================================================== */
.main-header,
.header-actions,
.header-submenu {
    transition: opacity 0.5s ease, transform 0.5s ease;
    opacity: 0;
    transform: translateY(-20px);
    pointer-events: none;
}
.main-header.visible,
.header-actions.visible,
.header-submenu.visible {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Body padding so content doesn't hide behind header */
body main {
    padding-top: 0px;
}


main.past-winners-page {
    padding-top: 0;
}




/* ==========================================================================
   ACTION BUTTONS BAR (visible on all screen sizes)
   ========================================================================== */
.header-actions {
    position: fixed;
    top: var(--header-h, 50px);
    left: 0;
    width: 100%;
    padding: 2px clamp(20px, 4vw, 60px);
    display: flex;
    justify-content: flex-end;
    gap: 20px;
    z-index: 999;
    transition: transform 0.3s ease, opacity 0.3s ease;
}
.header-actions--hidden {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}
.header-actions .btn-submit,
.header-actions .btn-accreditation {
    height: 31px;
    line-height: 19px;
    font-size: clamp(12px, 1vw, 17px);
    padding: 6px clamp(12px, 2vw, 20px);
    font-weight: 400;
    
    text-decoration: none;
    text-transform: none;
    transition: all 0.3s ease;
    display: inline-block;
    border: none;
    background: #fff;
    color: #BE1333;
    border: 1px solid #BE1333;
}

.header-actions .btn-accreditation:hover,
.header-actions .btn-submit:hover {
    background: #BE1333;
    color: #fff;
    border: 1px solid transparent;
}

/* ==========================================================================
   FIXED SUBMENU BAR – sibling sub-pages of the current section.
   Sits directly between the main nav (top: --header-h) and the CTA action
   bar, and is shorter in height than the main navigation. Only rendered on
   pages whose section has sub-pages (see nav_context: submenu_items).
   ========================================================================== */
.header-submenu {
    position: fixed;
    top: var(--header-h, 50px);
    left: 0;
    width: 100%;
    height: var(--submenu-h, 40px);
    display: flex;
    align-items: stretch;
    background: transparent;
    z-index: 999;
}

.header-submenu .nav-left-space {
    height: var(--submenu-h, 40px);
    width: 48px;
    flex: 0 0 48px;
    background: rgba(190, 19, 51, 0.92);   /* submenu's own maroon, not the header's black */
}

.header-submenu__links {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(16px, 2.5vw, 36px);
    padding: 0 clamp(20px, 4vw, 60px);
    background: rgba(190, 19, 51, 0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.header-submenu__links a {
    color: #fff;
    text-decoration: none;
    font-size: clamp(12px, 1vw, 15px);
    font-weight: 400;
    letter-spacing: 0.01em;
    white-space: nowrap;
    padding: 4px 2px;
    position: relative;
}

/* White underline on hover and active page */
.header-submenu__links a:hover,
.header-submenu__links a.active {
    color: #fff;
}

.header-submenu__links a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px;
    height: 1px;
    background: #fff;
    opacity: 0;
}

.header-submenu__links a:hover::after,
.header-submenu__links a.active::after {
    opacity: 1;
}

/* When the submenu is present it occupies the strip right under the header,
   so push the CTA action bar down below both. */
body.has-submenu .header-actions {
    top: calc(var(--header-h, 50px) + var(--submenu-h, 40px));
}

.main-header.header--no-logo .header-right {
    padding-left: clamp(20px, 3vw, 48px);
}

/* ARCHIVE was removed from the DESKTOP nav only. It stays reachable in the
   mobile accordion menu and via footer/home links, and its submenu bar still
   renders on archive pages. */
@media (min-width: 1025px) {
    /* Keep the parent navigation items visible */
    .nav-dropdown {
        display: flex;
        align-items: center;
        position: relative;
    }

    /* Hide all desktop dropdown panels */
    .nav-dropdown-menu {
        display: none !important;
    }

}

/* The submenu (like the CTA bar) is a desktop affordance – the mobile menu
   already handles sub-pages inline. */
@media (max-width: 1024px) {
    .header-submenu {
        display: none !important;
    }
}

 
/* ==========================================================================
   NEW CTA SECTION – red background with repeating pattern, text centered
   ========================================================================== */
.cta-section--new {
    position: relative;
    background-color: #BE1333;                     /* solid fallback */
    background-image: url('/static/img/logo3.png'); /* pattern image */
    background-repeat: repeat;                     /* tiles the pattern */
    background-size: auto;                         /* natural size, no stretching */
    overflow: hidden;
    min-height: 80vh;                              /* or adjust as needed */
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px clamp(20px, 5vw, 80px);
}

.cta-section--new .cta-content {
    max-width: 820px;
    width: 100%;
    z-index: 2;
    position: relative;
}

/* ---- Headings ---- */
.cta-section--new .cta-heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.1em;
    margin-bottom: 0.5em;
}

.cta-section--new .cta-line1 {

    font-weight: 400;
    font-size: clamp(2rem, 6vw, 3.125rem);
    color: #fff;
    letter-spacing: 0.02em;
    line-height: 1.2;
}

.cta-section--new .cta-line2 {

    font-weight: 400;
    font-size: clamp(2.5rem, 7vw, 3.75rem);
    color: #fff;
    letter-spacing: 0.02em;
    line-height: 1.1;
}

/* ---- Description ---- */
.cta-section--new .cta-description {
    font-weight: 400;
    font-size: clamp(0.9rem, 2vw, 1.125rem);
    color: rgba(255, 255, 255, 0.95);
    line-height: 1.6;
    max-width: 700px;
    margin: 0 auto 1.8em;
}

/* ---- Buttons ---- */
.cta-section--new .cta-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.cta-section--new .btn-primary,
.cta-section--new .btn-outline {
   
    font-weight: 400;
    font-size: clamp(0.85rem, 1.2vw, 1rem);
    padding: 12px clamp(20px, 3vw, 40px);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border: 1px solid transparent;
    transition: all 0.25s ease;
    display: inline-block;
}

.cta-section--new .btn-primary {
    background: #fff;
    color: #000;
    border-color: #fff;
}

.cta-section--new .btn-primary:hover {
    background: transparent;
    color: #fff;
}

.cta-section--new .btn-outline {
    background: transparent;
    color: #fff;
    border-color: #fff;
}

.cta-section--new .btn-outline:hover {
    background: rgba(255, 255, 255, 0.15);
}

/* ---- Mobile adjustments ---- */
@media (max-width: 640px) {
    .cta-section--new {
        min-height: auto;
        padding: 60px 20px;
    }
    .cta-section--new .cta-buttons {
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }
    .cta-section--new .btn-primary,
    .cta-section--new .btn-outline {
        width: 100%;
        max-width: 300px;
        text-align: center;
    }
}


.global-partners {
    width: 100%;
    background: #f5f5f5;
    padding: 45px 40px;
    box-sizing: border-box;
}

.global-partners__inner {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 30px 55px;
}

.global-partners__logo {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 1 auto;
    max-width: 180px;
    height: 70px;

    text-decoration: none;
}

.global-partners__logo img {
    display: block;
    max-width: 180px;
    max-height: 65px;
    width: auto;
    height: auto;
    object-fit: contain;
}

@media (max-width: 768px) {
    .global-partners {
        padding: 35px 20px;
    }

    .global-partners__inner {
        gap: 25px 30px;
    }

    .global-partners__logo {
        max-width: 130px;
        height: 55px;
    }

    .global-partners__logo img {
        max-width: 130px;
        max-height: 50px;
    }
}


/* ==========================================================================
   FOOTER (unchanged)
   ========================================================================== */
.site-footer {
    background: #111111;
    color: rgba(255, 255, 255, 0.7);
    padding: 60px 5vw 30px;
}
.site-footer .footer-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    /* Footer currently renders only footer-brand + footer-nav. Give the nav a
       wider track so its links can flow into rows and wrap when space runs low. */
    grid-template-columns: 2fr 3fr;
    gap: 40px;
}

.site-footer .footer-brand .footer-tagline {
    font-size: 0.85rem;
    line-height: 1.6;
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.6);
}
.site-footer h4 {
    font-size: 0.9rem;
    font-weight: 400;
    color: #FFFFFF;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 16px;
}
.site-footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.site-footer ul li {
    margin-bottom: 8px;
}
.site-footer ul li a {
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.3s;
}
.site-footer ul li a:hover { color: #FFFFFF; }
.site-footer .footer-contact p {
    font-size: 0.85rem;
    margin: 4px 0;
    color: rgba(255, 255, 255, 0.6);
}
.site-footer .footer-awards p {
    font-size: 0.85rem;
    margin: 4px 0;
    color: rgba(255, 255, 255, 0.6);
}
.site-footer .footer-awards .award-name {
    color: #E5BC1A;
    font-weight: 400;
}
.site-footer .footer-bottom {
    max-width: 1200px;
    margin: 40px auto 0;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    text-align: center;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.4);
}
@media (max-width: 768px) {
    .site-footer .footer-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    body:not(.home-page) main:not(.past-winners-page) {
        padding-top: 0px;
    }
}


@media (max-width: 1024px) {
    /* On mobile, the dropdown becomes a tap-to-expand accordion row.
       Tapping the row (not a specific sub-link) toggles the sub-list;
       it does NOT navigate immediately. A chevron on the right indicates
       expand/collapse state. */
    .nav-dropdown {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        align-self: auto;
        height: auto;
        width: 100%;
    }
    .nav-dropdown > a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        height: auto;
        padding: 12px 34px;
    }

    .nav-dropdown > a::after {
        content: none;
    }
    
    .nav-dropdown-menu {
        position: static;
        display: none;
        /* Keep the same background as the parent menu (translucent white),
           so the sub-pages do NOT change the background color when expanded.
           Text inset is handled entirely by the <a> padding below. */
        width: calc(100% + 48px);
        margin: 0 -24px;
        background: transparent;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        box-shadow: none;
        padding: 8px 0;
        flex-direction: column;
        gap: 0;
    }

    .nav-dropdown.open > .nav-dropdown-menu {
        display: flex;
    }
    .nav-dropdown-menu a {
        padding: 12px 34px; /* text inset — adjust 34px to taste */
        color: #fff;
    }
    .nav-dropdown-menu a:hover {
        color: #EFBD08;
    }

    .hero-nav-links .nav-dropdown-menu {
        background: transparent;
    }
}



/* ==========================================================================
    HERO NAVIGATION – shared across all pages with .has-hero
    ========================================================================== */

/* Wrapper – hidden by default, shown only on pages with .has-hero */
.hero-nav-wrapper {
    display: none;                           /* hidden on pages without hero */
    position: relative;                      /* allow absolute positioning of nav */
    z-index: 1000;
}
.has-hero .hero-nav-wrapper {
    display: block;                          /* shown on hero pages */
}

.hero-nav {
    width: 100%;
    height: clamp(80px, 8vw, 110px);
    padding: 0;
    background: rgba(0, 0, 0, 0.8);          /* 80% opacity black */
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: absolute;                      /* positioned inside hero section */
    top: 0;
    left: 0;
    z-index: 2;                              /* above video but below content if needed */
}

/* Logo area – left aligned */
.hero-logo-area {
    position: absolute;
    left: 40px;
    bottom: 0px;
    display: flex;
    align-items: flex-end;
    gap: 10px;
}

.hero-logo-img {
    width: auto;
    height: clamp(70px, 9vw, 105px);
    display: block;
    padding-top: 10px;
}

.hero-logo-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: auto;
    padding-bottom: 10px;
    line-height: 1;
    font-weight: 400;
}

/* Logo text – now maroon red (#BE1333) */
.hero-biaff,
.hero-edition {
   
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 400;
    color: #BE1333;                          /* changed to maroon red */
    line-height: 1;
    margin: 0;
}

/* Nav links – white */
.hero-nav-links {
    display: flex;
    align-items: center;
    gap: 47px;
    height: 20px;
}

.hero-nav-links a {
    text-decoration: none;
    font-size: 17px;
    font-weight: 400;
    color: #ffffff;
    line-height: 20px;
    white-space: nowrap;
    
}

.hero-nav-links a.active,
.hero-nav-links a:hover {
    color: #EFBD08;                          /* gold hover/active */
}

/* Language switcher */
.hero-lang-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.hero-lang-switch a {
    font-size: 17px;
    color: rgba(255,255,255,0.7);
}

.hero-lang-switch a.active-lang {
    color: #ffffff;
}

.hero-lang-switch a:hover {
    color: #EFBD08;
}

/* Hamburger – hidden on desktop, shown on mobile */
.hero-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 24px;
    background: none;
    border: none;
    cursor: pointer;
    gap: 5px;
    z-index: 1001;
}

.hero-hamburger span {
    display: block;
    width: 100%;
    height: 2px;
    background: #ffffff;
    transition: 0.3s;
}

/* --- Mobile styles for hero nav --- */
@media (max-width: 1024px) {
    .hero-nav-links {
        display: none;                        /* hidden by default on mobile */
        position: fixed;
        top: 110px;                          /* below hero nav height */
        left: 0;
        width: 100vw;
        height: auto;
        max-height: calc(100vh - 110px);
        overflow-y: auto;
        background: rgba(0, 0, 0, 0.9);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
        flex-direction: column;
        align-items: flex-start;
        padding: 24px 24px 18px;
        border-bottom: 1px solid rgba(255,255,255,0.1);
        z-index: 999;
    }

    .hero-nav-links.show {
        display: flex;
    }

    .hero-nav-links a {
        display: block;
        width: 100%;
        padding: 12px 0;
        text-align: left;
        font-size: clamp(16px, 2vw, 18px);
        white-space: nowrap;
        color: #ffffff;
        text-decoration: none;
        transition: color 0.2s ease;
    }

    .hero-nav-links a.active,
    .hero-nav-links a:hover {
        color: #EFBD08;
    }

    .hero-lang-switch {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 12px 0;
    }

    .hero-lang-switch a {
        font-size: clamp(16px, 2vw, 18px);
        color: rgba(255,255,255,0.7);
    }

    .hero-lang-switch a.active-lang {
        color: #ffffff;
    }

    .hero-hamburger {
        display: flex;                         /* show hamburger on mobile */
    }

    /* Hamburger X animation */
    .hero-hamburger.open span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }
    .hero-hamburger.open span:nth-child(2) {
        opacity: 0;
    }
    .hero-hamburger.open span:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -5px);
    }
}

@media (max-width: 640px) {
    .hero-nav {
        height: clamp(70px, 10vw, 90px);
        padding: 0 20px;
    }
    .hero-logo-area {
        left: 20px;
    }
    .hero-logo-img {
        height: clamp(50px, 8vw, 70px);
    }
    .hero-biaff,
    .hero-edition {
        font-size: clamp(22px, 4vw, 28px);
    }
    .hero-nav-links {
        top: 90px;                             /* adjust for smaller height */
        max-height: calc(100vh - 90px);
    }

    .nav-left-space {
        width: 10px;
        flex: 0 0 10px;
    }

}

/* --- Footer nav rendered in rows; wraps into more rows when space is short --- */
.site-footer .footer-nav ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    justify-content: flex-start;
}
.site-footer .footer-nav ul li {
    margin: 0;
}

/* --- Footer sitemap: parent pages + indented subpages --- */
.site-footer .footer-nav ul li > a {
    font-weight: 400;
}
.site-footer .footer-nav ul li.footer-subpage {
    padding-left: 16px;
}
.site-footer .footer-nav ul li.footer-subpage > a {
    font-weight: 400;
    font-size: 0.85rem;
}


@media (max-width: 1024px) {
    .main-header {
        position: fixed;
        top: 0;
        left: 0;
        height: 50px;
        min-height: 50px;
        margin: 0;
        padding: 0;
    }

    body main {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
}