Vagány Blog Főoldal: Elementor Layout Terv

Ez a dokumentum a Dark Matter esztétikát követő blog főoldal vizuális és technikai tervét tartalmazza.

🖼️ Vizuális Koncepció (Látványterv)

A cél egy elegáns, futurisztikus, de közben szakmai megjelenés elérése. Az alábbi képen láthatod az irányadó dizájnt:

🏗️ Szerkezeti Felépítés (Elementor Widgetek)

A főoldalt (Archive Page) az alábbi szekciókból és widgetekből építsd fel:

1. Hero Szekció (Címsor és Bevezető)

• Szekció háttér: #050505
• Widget: Heading (Címsor): "Tudástár & Blog" (H1, Montserrat, Bold, Fehér).
• Widget: Text Editor: Rövid kedvcsináló szöveg (Inter, Light, #e0e0e0).
• Extra: Egy nagy, elmosódott neon zöld sugárzás (Radial Gradient shadow) a szöveg mögé rétegelve.

📱 Mobil-Reszponzív Beállítások

• Mobilon a címsor (H1) méretét vedd lejjebb (32-40px közé).
• A hős-szekció szövegét érdemes középre igazítani a keskenyebb kijelzőkön.
• Ügyelj a minimális 15px oldalsó margóra (container padding).

2. Blog Grid (A kártyák elrendezése)

• Widget: Loop Grid (vagy Posts widget):
  • Columns: 3 (Desktop), 2 (Tablet), 1 (Mobile).
  • Query: "Posts", sorrend dátum szerint csökkenő.
  • Pagination: "Load on click" vagy lapozás nélkül az első 9 poszt.

3. Egyedi Kártya Dizájn (Custom Skin)

A kártya (Loop Item) elemei:

• Featured Image: Teljes szélesség, lekerekített sarkok (24px).
• Post Info (Meta): Dátum és szerző kis méretben, halvány szürkével.
• Post Title: H3, Montserrat, félkövér.
• Post Excerpt: Maximum 3 sor, Inter betűtípussal.
• Link: A teljes kártya legyen kattintható.

🪄 Animációk és Interakciók

A "vagány" hatást az apró mozgások adják:

• Kártya Hover: A kép nagyuljon egy kicsit (scale(1.05)), a keret kapjon egy halvány neon zöld derengést, és a kártya emelkedjen meg (translateY(-10px)).
• Cím Hover: A fehér szöveg váltson át azonnal neon zöldre.

[!TIP] Az Elementorban a kártya widget "Overlay" beállításánál használj egy átlátszótól a feketéig tartó gradienst a kép alján, hogy a rá kerülő szövegek (pl. a dátum vagy a tag) mindenképpen olvashatóak legyenek.