/* ALAPBEÁLLÍTÁSOK - SARKI FÉNY STÍLUS */
body { 
    background-color: #0a0f1e; /* Mély éjszakai kék */
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
    margin: 0; 
    color: #d1d1e0; /* Világos szürke szöveg a sötét háttéren */
    background: linear-gradient(135deg, #0a0f1e 0%, #1a1a2e 100%);
    background-attachment: fixed;
}

/* FEJLÉC ÉS NAVIGÁCIÓ */
.main-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(26, 26, 46, 0.9); /* Áttetsző sötét */
    padding: 20px 40px;
    box-shadow: 0 4px 15px rgba(0, 242, 234, 0.1); /* Aurora kék árnyék */
    border-bottom: 2px solid #7a5ba0; /* Lila keret */
}

.site-title {
    font-size: 24px;
    font-weight: bold;
    color: #ffd1dc; /* A te szép rózsaszíned */
    text-shadow: 0 0 10px rgba(255, 209, 220, 0.5);
}

nav a { 
    margin: 0 15px; 
    text-decoration: none; 
    color: #00f2ea; /* Aurora kék */
    font-weight: bold; 
    transition: 0.3s;
}

nav a:hover { 
    color: #ffd1dc; 
    text-shadow: 0 0 8px #ffd1dc;
}

/* KÁRTYÁK */
.card { 
    background: #16213e; /* Sötétkék kártya */
    border-radius: 15px; 
    width: 200px; 
    padding: 15px; 
    box-shadow: 0 4px 15px rgba(0,0,0,0.3); 
    transition: 0.3s;
    border: 1px solid rgba(122, 91, 160, 0.3);
}

.card:hover { 
    transform: translateY(-8px); 
    border-color: #00f2ea; /* Kékre vált a keret hoverkor */
    box-shadow: 0 0 20px rgba(0, 242, 234, 0.2);
}

.card img { 
    width: 100%; 
    border-radius: 10px; 
    height: 280px; 
    object-fit: cover; 
}

/* CÍMEK */
h1 { text-align: center; color: #ffd1dc; padding: 20px; margin: 0; }
h2, .section-title { color: #00f2ea; }

/* LEGFRISSEBB FEJEZET KÁRTYA */
.update-card {
    background: #1b1b2f;
    display: flex;
    align-items: center;
    padding: 15px;
    border-radius: 15px;
    margin-bottom: 15px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    text-decoration: none;
    transition: 0.3s;
    border-left: 4px solid #7a5ba0;
}

.update-card:hover { 
    transform: translateX(10px); 
    background: #242444; 
    border-left-color: #00f2ea;
}

.update-info h3 { margin: 0; color: #ffd1dc; font-size: 16px; }
.update-info p { margin: 5px 0 0; color: #a2a2ba; font-size: 14px; }
.update-date { margin-left: auto; color: #7a5ba0; font-size: 12px; }

/* HÍR KÁRTYA */
.news-card-home {
    background: #16213e;
    padding: 25px;
    border-radius: 20px;
    box-shadow: 0 6px 12px rgba(0,0,0,0.3);
    border: 2px dashed #7a5ba0;
}

.news-tag { 
    background: #00f2ea; 
    color: #0a0f1e; 
    padding: 4px 10px; 
    border-radius: 20px; 
    font-size: 12px; 
    font-weight: bold; 
}

/* LÁBLÉC */
footer {
    background-color: #0a0f1e;
    text-align: center;
    padding: 30px;
    margin-top: 50px;
    border-top: 2px solid #7a5ba0;
}

.discord-btn {
    background-color: #5865F2; /* Discord kék */
    box-shadow: 0 0 15px rgba(88, 101, 242, 0.4);
}

/* ADATLAP / FEJEZETEK */
.chapter-item {
    background: #16213e;
    color: #d1d1e0;
    border: 1px solid rgba(0, 242, 234, 0.1);
}

.chapter-item:hover { 
    background: #7a5ba0; 
    color: white;
}

/* MOBIL NÉZET */
@media (max-width: 768px) {
    .main-header { flex-direction: column; padding: 20px; }
}
.site-logo {
    height: 50px;    /* Itt add meg a magasságot pixelben (kisebb szám = kisebb logó) */
    width: auto;      /* Ez garantálja, hogy ne torzuljon el a kép */
    display: block;   /* Segít a pontos elhelyezkedésben */
}

.logo-section {
    display: flex;       /* Bekapcsolja a Flexbox elrendezést */
    align-items: center;  /* Függőlegesen középre igazítja a logót és a feliratot egymáshoz képest */
    gap: 15px;            /* Távolságot tesz a logó és a felirat közé (ízlés szerint állítsd) */
}
/* KÁRTYÁK KÖZÉPRE RENDEZÉSE */
.manga-grid { 
    display: flex; 
    flex-wrap: wrap; 
    justify-content: center; /* Ez teszi középre a kártyákat */
    gap: 20px; 
    padding: 40px; 
}