:root {
    /* Arculati színek és beállítások a logó alapján */
    --color-brand-maroon: #420f18;      /* Mély bársonyos burgundy a férfi kalapjából */
    --color-brand-gold: #f1cc6c;        /* Élénk, nemes arany szín a tökéletes kontrasztért */
    --color-brand-gold-hover: #ffffff;  /* Hover állapotban ragyogó fehér */
    --color-text-dark: #333333;
    
    --navbar-height: 70px;
    --container-max-width: 1200px;
    --transition-smooth: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}

/* Sima legördülés bekapcsolása a menüpontokra kattintáskor */
html {
    scroll-behavior: smooth;
}

/* Megakadályozza, hogy a rögzített menüsor kitakarja a szekciók címeit görgetés után */
section {
    scroll-margin-top: calc(var(--navbar-height) + 20px);
}

/* Globális alapbeállítások */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: var(--color-text-dark);
    overflow-x: hidden;
    
    /* Végtelenített papírháttér beállítása */
    background-image: url('bkgnd.png');
    background-repeat: repeat;
    background-attachment: fixed; /* A háttér egy helyben marad, a tartalom csúszik felette */
    background-color: #fcfbf9;    /* Biztonsági tartalék szín */
}

/* Navigációs sáv - Tömör, Mély Burgundy kivitelben */
.navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--navbar-height);
    background-color: var(--color-brand-maroon); 
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
    z-index: 1000;
    display: flex;
    align-items: center;
    transition: var(--transition-smooth);
}

/* Görgetés közbeni navbar állapot (Opcionális extra mélység az árnyéknak) */
.navbar.scrolled {
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.4);
}

.nav-container {
    width: 100%;
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* A logó fix helye a navbarban (szélesség-igazításhoz) */
.nav-logo-space {
    width: 50px;
    height: 50px;
}

.nav-menu {
    display: flex;
    list-style: none;
    gap: 25px; /* Optimális távolság a hosszabb szövegekhez */
}

/* Menüpontok linkjei - Arany szín és a logó robusztus betűstílusa */
.nav-menu li a {
    text-decoration: none;
    color: var(--color-brand-gold);
    
    /* Logó tipográfia: Montserrat, vastag, csupa nagybetűs és elegánsan széthúzott betűköz */
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px; 
    font-size: 0.9rem;
    
    transition: color 0.3s ease, transform 0.3s ease;
    display: inline-block;
}

/* Egérmutató rátartás (Hover) effektus */
.nav-menu li a:hover {
    color: var(--color-brand-gold-hover);
    transform: translateY(-1px); /* Finom emelkedés elmozdításkor */
}

/* Hero szekció a nagy logó központosításához */
.hero-section {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

/* A LOGÓ DINAMIKUS MOZGÁSA */

/* Kezdőállapot: Képernyő mértani középpontjában nagyban */
#main-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 500px;
    width: 90%;
    height: auto;
    z-index: 1001;
    transition: var(--transition-smooth);
}

/* Beúszott állapot: Navbar bal sarkába finoman lekicsinyítve */
#main-logo.minimized {
    top: calc(var(--navbar-height) / 2);
    /* Automatikusan igazodik a navbar belső konténerének bal széléhez */
    left: calc(max(20px, (100vw - var(--container-max-width)) / 2 + 20px));
    transform: translate(0, -50%);
    max-width: 50px;
}

/* Fő tartalmi rész elrendezése */
.content {
    padding: calc(var(--navbar-height) + 60px) 20px;
    max-width: var(--container-max-width);
    margin: 0 auto;
    min-height: 150vh; 
}

.content section {
    margin-bottom: 60px;
}