/* ===== Világos, áttekinthető téma mélyvörös akcentussal ===== */
:root{
    --bg:#f7f7f8;         /* old: #0a0a0a */
    --paper:#ffffff;      /* kártyák, szekciók */
    --ink:#222;           /* szöveg */
    --accent:#8B0000;     /* mélyvörös */
    --accent-2:#a82c2c;
    --muted:#666;
    --line:#e7e7ea;       /* határvonalak */
    --shadow:0 4px 20px rgba(0,0,0,.06);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}

body{
    background:
            radial-gradient(60vw 60vw at 20% -10%, rgba(168,44,44,.06), transparent 60%),
            linear-gradient(180deg,#fafafb, var(--bg));
    color:var(--ink);
    font-family: Georgia, "Times New Roman", serif;
    font-size:17px;
    line-height:1.7;
    position:relative;
    overflow-x:hidden;
}

.noise{
    position:fixed; inset:0; pointer-events:none;
    background-image:url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%224%22 height=%224%22 viewBox=%220 0 4 4%22><path fill=%22%23dcdcdc%22 d=%22M0 0h2v2H0zM2 2h2v2H2z%22/></svg>');
    opacity:.15; mix-blend-mode:multiply;
}

/* ===== Linkek, tipográfia ===== */
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
img{display:block;max-width:100%;height:auto;border-radius:14px}

/* ===== Fejléc / Navigáció ===== */
.site-header{
    position:sticky; top:0; z-index:99;
    display:flex; align-items:center; justify-content:space-between;
    padding:12px 20px;
    background:rgba(255,255,255,.85);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:800;color:var(--ink)}
.logo{
    display:inline-grid; place-items:center; width:36px; height:36px; border-radius:999px;
    background:radial-gradient(circle at 30% 30%, var(--accent-2), var(--accent));
    color:#fff; font-weight:900;
}
.brand-text{letter-spacing:.5px}

.nav{display:flex;gap:.6rem;flex-wrap:wrap}
.nav a{
    color:var(--ink);
    padding:8px 12px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
    box-shadow:var(--shadow);
}
.nav a:hover{
    background:var(--accent);
    border-color:var(--accent);
    color:#fff;
    text-decoration:none;
}

/* ===== Láb ===== */
.site-footer{
    display:flex; align-items:center; justify-content:space-between; gap:1rem;
    padding:22px 20px;
    border-top:1px solid var(--line);
    background:#fff;
}
.site-footer .small{color:#888; font-size:.95rem}

/* ===== HĹ‘s szekciĂł ===== */
.hero{
    padding:8vw 20px 4vw;
    background:
            radial-gradient(60vw 60vw at 20% -10%, rgba(168,44,44,.09), transparent 60%),
            radial-gradient(50vw 50vw at 100% 10%, rgba(139,0,0,.08), transparent 60%);
}
.hero-text{max-width:980px;margin:0 auto}
.hero h1{
    font-size:clamp(2rem,5vw,3.4rem);
    line-height:1.12; margin:.2em 0;
    color:var(--ink);
}
.cta-row{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}
.btn{
    display:inline-block; padding:.75rem 1.05rem; border-radius:12px;
    border:1px solid var(--line); background:#fff; transition:.2s;
    box-shadow:var(--shadow); color:var(--ink);
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--accent);border-color:var(--accent); color:#fff}
.btn-ghost{background:#fff;border-color:var(--line); color:var(--ink)}

/* ===== Csempék / Kártyák ===== */
.tiles,
.grid.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:20px; padding:24px 20px; max-width:1200px; margin:0 auto}
.tile, .card{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:16px;
    overflow:hidden;
    display:flex; flex-direction:column;
    box-shadow:var(--shadow);
}
.tile-body,.card-body{padding:16px; display:flex; flex-direction:column; gap:.5rem}
.card .meta{display:flex;gap:.5rem;color:#777;font-size:.92rem;flex-wrap:wrap}
.card .actions{display:flex;gap:.5rem;flex-wrap:wrap}
.note{padding:10px 20px; max-width:980px; margin:0 auto}
.small{color:#777; font-size:.95rem}

/* ===== Oldal hős ===== */
.page-hero{
    padding:34px 20px;
    border-bottom:1px solid var(--line);
    background:#fff;
}
.page-hero h1{margin:.2em 0}

/* ===== About blokk ===== */
.about{padding:10px 20px 40px}
.cols{display:grid;grid-template-columns:1.6fr .9fr;gap:22px; max-width:1200px; margin:0 auto}
@media (max-width:900px){.cols{grid-template-columns:1fr}}
.list{list-style:none;padding:0;margin:0}
.list li{padding:.35rem 0}
.tags{list-style:none;display:flex;gap:.5rem;flex-wrap:wrap;padding:0;margin:1rem 0}
.tags li{padding:.3rem .65rem;border:1px solid var(--line);border-radius:999px;background:#fff; box-shadow:var(--shadow)}

/* ===== Galéria ===== */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;padding:24px 20px; max-width:1200px; margin:0 auto}
.gallery figure{background:#fff; border:1px solid var(--line); border-radius:16px; padding:10px; box-shadow:var(--shadow)}
.gallery figcaption{color:#666;font-size:.95rem;margin-top:.4rem}

/* ===== Szűrők és termékek (Ékszerek) ===== */
.filters{padding:10px 20px; max-width:1200px; margin:0 auto}
#productGrid .card-body p{margin:.2rem 0}

/* ===== Blog ===== */
.blog-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;padding:24px 20px; max-width:1200px; margin:0 auto}
.blog-list .card{min-height:200px}

/* ===== Kisebb vizuális finomságok ===== */
.reveal{transform:translateY(6px); opacity:0; transition:transform .45s ease, opacity .45s ease}
.reveal.in{transform:none; opacity:1}
code{background:#fff;color:#333;padding:.12rem .35rem;border-radius:6px;border:1px solid var(--line); box-shadow:var(--shadow)}

/* ===== Webfejlesztés – projekt layout ===== */
.project-list { display: grid; gap: 28px; padding: 24px 20px; max-width: 1200px; margin: 0 auto; }
.project { background: var(--paper); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.project-head { display:flex; align-items:flex-start; justify-content:space-between; gap: 1rem; padding: 16px; border-bottom: 1px solid var(--line); }
.project-head h2 { margin: 0; }
.project .meta { display:flex; gap:.5rem; color:#777; font-size:.92rem; flex-wrap:wrap }
.project .actions { display:flex; gap:.5rem; flex-wrap:wrap }

.project-body { display:grid; grid-template-columns: 1.2fr 1fr; gap: 16px; padding: 16px; }
@media (max-width: 900px) { .project-body { grid-template-columns: 1fr; } }

.project-copy p { margin-top: 0; }
.bullets { margin: .6rem 0 0; padding-left: 1.1rem; }
.bullets li { margin: .25rem 0; }

/* ===== Mini galéria + lightbox ===== */
.mini-gallery { display:grid; grid-template-columns: repeat(3, 1fr); gap: 8px; align-content:start; }
.mini-gallery a { display:block; border-radius: 12px; overflow:hidden; border:1px solid var(--line); background:#fff; box-shadow: var(--shadow); }
.mini-gallery img { display:block; width:100%; height:100%; object-fit:cover; aspect-ratio: 4/3; }

.lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.78); display: none; place-items: center; z-index: 999; }
.lightbox.open { display: grid; }
.lb-img { max-width: min(92vw, 1200px); max-height: 86vh; border-radius: 12px; box-shadow: 0 18px 60px rgba(0,0,0,.5); background:#000 }
.lb-close { position:absolute; top: 16px; right: 16px; width: 42px; height: 42px; border-radius: 999px; border:1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.45); color:#fff; font-size: 26px; cursor: pointer; }
.lb-nav { position:absolute; top:50%; transform: translateY(-50%); width:46px; height:46px; border-radius:999px; border:1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.45); color:#fff; font-size: 26px; cursor: pointer; }
.lb-nav.prev { left: 16px; } .lb-nav.next { right: 16px; }
.lb-dots { position:absolute; bottom: 16px; left: 50%; transform: translateX(-50%); display:flex; gap:6px; }
.lb-dots i { width:8px; height:8px; border-radius:999px; background:#bbb; opacity:.6 }
.lb-dots i.active { opacity:1; background:#fff }


/* ===== Játék kártyák – egységes borítók ===== */
.game-cards .card { overflow: hidden; }
.game-cards .cover{
    position: relative;
    border-bottom: 1px solid var(--line);
    background: #000;
}
.game-cards .cover img{
    display:block; width:100%;
    aspect-ratio: 16 / 9;   /* egységes borító */
    object-fit: cover;      /* középre vágás, ha nem pontos a méret */
    border-radius: 0;       /* a kártya felső íve elég */
}
.game-cards .cover .badge{
    position: absolute; bottom: 10px; left: 10px;
    padding: .35rem .55rem; border-radius: 999px;
    font-size: .85rem; color: #fff;
    background: rgba(0,0,0,.45);
    border: 1px solid rgba(255,255,255,.25);
    backdrop-filter: blur(4px);
}

.excerpt{ margin:.35rem 0 .1rem; color: var(--ink); }

/* ===== Fotóportfólió – nagy, hézagmentes rács ===== */
.photo-gallery{
    /* teljes szélesség kihasználása, nincs belső padding */
    max-width: 1400px;
    margin: 0 auto 0;
    padding: 0;

    display: grid;
    grid-template-columns: repeat(3, 1fr); /* kevesebb oszlop = nagyobb képek */
    gap: 0;                                 /* 0 távolság a képek között */
}

/* reszponzĂ­v: tablet -> 2 oszlop, mobil -> 1 oszlop */
@media (max-width: 900px){ .photo-gallery{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px){ .photo-gallery{ grid-template-columns: 1fr; } }

/* csempe: nincs szegély, nincs árnyék, nincs lekerekítés */
.photo-gallery a{
    display:block;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    background: #000;           /* villanás ellen, sötét letterbox ha kell */
    box-shadow: none;
    transition: none;           /* nincs felugrás hoverre, mert hézagmentes */
}

/* kép: teljes kitöltés, egységes 16:10 arány (vagy hagyd auto-ra) */
.photo-gallery img{
    display:block;
    width:100%;
    height:100%;
    object-fit: cover;
    aspect-ratio: 16 / 10;      /* egységes raszter – ha természetes arány kell, töröld ezt a sort */
    border-radius: 0;
}

/* ===== HERO PRO ===== */
.hero-pro{
    position: relative;
    padding: 56px 16px 16px;
    background:
            radial-gradient(1000px 600px at 15% 0%, rgba(139,0,0,.12), transparent 70%),
            linear-gradient(180deg, rgba(0,0,0,.04), transparent);
}
.hero-pro .hero-inner{
    max-width: 1100px; margin: 0 auto;
}
.kicker{
    font-size: .95rem; letter-spacing: .08em; text-transform: uppercase;
    color: var(--muted, #6b7280); margin: 0 0 .25rem;
}
.hero-pro h1{
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.1; margin: 0 0 .5rem;
}
.hero-pro h1 .accent{ color: #8B0000; }
.hero-pro .sub{ max-width: 70ch; color: var(--ink, #222); margin: 0 0 1rem; }

.statbar{
    max-width: 1100px; margin: 16px auto 0; padding: 12px 14px;
    border:1px solid var(--line); border-radius: 14px; background: var(--paper);
    display:grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
}
@media (max-width: 800px){ .statbar{ grid-template-columns: repeat(2, 1fr); } }
.statbar li{ list-style:none; text-align:center; padding:10px 6px; }
.statbar strong{ display:block; font-size:1.25rem; }
.statbar span{ color:#6b7280; font-size:.92rem; }

/* ===== SzekciĂł fej ===== */
.section-head{
    max-width: 1100px; margin: 28px auto 8px; padding: 0 16px;
    display:flex; align-items: center; justify-content: space-between; gap: 12px;
}
.section-head h2{ margin: 0; }

/* ===== Featured grid igazítás ===== */
.featured .grid.cards{ max-width: 1100px; margin: 0 auto; padding: 0 16px; }

/* ===== Game cards borĂ­tĂł ===== */
.home-games .grid.cards{ max-width: 1100px; margin: 0 auto; padding: 0 16px; }
.game-cards .card { overflow: hidden; }
.game-cards .cover{ position:relative; border-bottom: 1px solid var(--line); background:#000; }
.game-cards .cover img{ display:block; width:100%; aspect-ratio:16/9; object-fit:cover; }
.game-cards .cover .badge{
    position:absolute; bottom:10px; left:10px;
    padding:.35rem .55rem; border-radius:999px; font-size:.85rem; color:#fff;
    background: rgba(0,0,0,.45); border:1px solid rgba(255,255,255,.25); backdrop-filter: blur(4px);
}
.excerpt{ margin:.35rem 0 .1rem; color: var(--ink); }

/* ===== Photo strip ===== */
.home-photos .mini-strip{
    display:grid; gap: 6px; grid-template-columns: repeat(6, 1fr);
    max-width: 1100px; margin: 8px auto; padding: 0 16px;
}
.home-photos .mini-strip img{ width:100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 8px; border:1px solid var(--line); }
.home-photos .muted{ color:#6b7280; text-align:center; }

/* ===== About / CTA ===== */
.home-about .cols{ max-width: 1100px; margin: 8px auto 24px; padding: 0 16px; display:grid; grid-template-columns: 1.3fr 1fr; gap: 16px; }
@media (max-width: 900px){ .home-about .cols{ grid-template-columns: 1fr; } }
.contact-cta .stacked{ display:grid; gap: 8px; margin-top: 8px; }


/* ===== Rólam + Kapcsolat – egységes kártya/mezők ===== */
.home-about .cols{
    max-width: 1100px; margin: 8px auto 32px; padding: 0 16px;
    display:grid; grid-template-columns: 1.3fr 1fr; gap: 16px;
}
@media (max-width: 900px){ .home-about .cols{ grid-template-columns: 1fr; } }

.quick-contacts{ margin-top:.5rem; color:#6b7280; display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.quick-contacts .sep{ opacity:.5; }

.contact-card{ padding:16px; }
.contact-card h3{ margin-top:0; }
.contact-card .muted{ color:#6b7280; }

form .grid2{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px){ form .grid2{ grid-template-columns: 1fr; } }

.field{ display:block; }
.field > span{ display:block; font-size:.92rem; color:#6b7280; margin: 8px 0 6px; }
.field input[type="text"],
.field input[type="email"],
.field select,
.field textarea{
    width:100%;
    appearance:none;
    border:1px solid var(--line);
    background: var(--paper);
    color: var(--ink, #1f2937);
    padding: .65rem .7rem;
    border-radius: 10px;
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.field textarea{ resize: vertical; min-height: 120px; }
.field select{ background-image: none; }

.field input:focus,
.field textarea:focus,
.field select:focus{
    border-color: #8B0000;
    box-shadow: 0 0 0 3px rgba(139,0,0,.15);
    background: #fff;
}

/* hibaĂĽzenet */
.field .err{
    display:none; font-style: normal; color: #a61b1b; font-size: .85rem; margin-top: 6px;
}
.field.invalid .err{ display:block; }
.field.invalid input,
.field.invalid textarea,
.field.invalid select{
    border-color:#a61b1b;
    box-shadow: 0 0 0 3px rgba(166,27,27,.12);
}

.check{
    display:flex; gap:.55rem; align-items:flex-start; margin: 6px 0 6px;
    color:#374151; font-size:.95rem;
}
.check input{ transform: translateY(3px); accent-color:#8B0000; }

.actions.stacked{ display:grid; gap:8px; margin-top:10px; }
.tiny{ font-size:.85rem; }


/* ===== Hamburger menĂĽ (mobil-first) ===== */
.hamburger{
    /* alapból látszik mobilon, desktopon eltűnik */
    appearance:none; border:1px solid var(--line); background:#fff; color:inherit;
    width:42px; height:42px; border-radius:12px; box-shadow:var(--shadow);
    display:grid; place-items:center; cursor:pointer;
}
.hamburger:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.hamburger-bar{
    position:relative; width:22px; height:2px; background:var(--ink); border-radius:2px;
}
.hamburger-bar::before,
.hamburger-bar::after{
    content:""; position:absolute; left:0; width:22px; height:2px; background:var(--ink); border-radius:2px;
    transition: transform .18s ease, opacity .18s ease;
}
.hamburger-bar::before{ top:-7px; }
.hamburger-bar::after{ top:7px; }

/* nav alap – desktop */
@media (min-width: 901px){
    .hamburger{ display:none; }
    .nav{ display:flex; gap:.6rem; flex-wrap:wrap; } /* megőrizzük az eredetit */
}

/* nav – mobil nézetben lenyíló panelré válik */
@media (max-width: 900px){
    .nav{
        position:fixed; top:60px; right:0; left:0; bottom:0;
        display:grid; align-content:start; gap:8px;
        background:#fff; border-top:1px solid var(--line);
        padding:12px 16px 24px;
        transform: translateY(-8px); opacity:0; pointer-events:none;
        transition: opacity .18s ease, transform .18s ease;
        box-shadow: 0 14px 40px rgba(0,0,0,.08);
    }
    .nav a{
        display:block; padding:12px 14px; border-radius:12px;
        border:1px solid var(--line); background:#fff; box-shadow:var(--shadow);
    }
    .nav.open{
        transform: translateY(0);
        opacity:1; pointer-events:auto;
    }

    /* X ikon animáció */
    .hamburger[aria-expanded="true"] .hamburger-bar{ background:transparent; }
    .hamburger[aria-expanded="true"] .hamburger-bar::before{ transform: translateY(7px) rotate(45deg); }
    .hamburger[aria-expanded="true"] .hamburger-bar::after{ transform: translateY(-7px) rotate(-45deg); }

    /* háttér a menü mögé */
    .nav-backdrop{
        position:fixed; inset:0; background:rgba(0,0,0,.35); backdrop-filter: blur(2px);
    }
}

/* kis finomítás: fejléchez igazított top offset
   ha magasabb a headered, itt állítsd */
.site-header{ min-height:60px; }

/* reduced motion */
@media (prefers-reduced-motion: reduce){
    .nav{ transition:none }
    .hamburger-bar::before, .hamburger-bar::after{ transition:none }
}


/* =============== GLOBAL SCALE & CONTAINMENT =============== */
:root{
    --container: 1100px;
    --gutter: 16px;
}

/* egységes max-szélesség a fő rácsoknak mobil-gutterrel */
.tiles,
.grid.cards,
.project-list,
.blog-list,
.gallery,
.section-head,
.hero-pro .hero-inner,
.statbar,
.home-games .grid.cards,
.home-photos .mini-strip,
.home-about .cols{
    max-width: var(--container);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

/* tipó skálázás */
h1{ font-size: clamp(1.9rem, 5vw, 3.2rem); }
h2{ font-size: clamp(1.35rem, 2.6vw, 1.8rem); }
h3{ font-size: clamp(1.1rem, 2vw, 1.25rem); }

/* képek ne okozzanak sorból kilógást */
img{ height: auto; max-width: 100%; }

/* hosszĂş szavak/URL-ek ne lĂłgjanak ki */
h1, h2, h3, p, .card-body, .project-copy, .meta, .quick-contacts{
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* =============== HEADER / NAV – mobil finomítások =============== */
:root{ --header-h: 60px; }
.site-header{ min-height: var(--header-h); padding: 10px 12px; gap: 10px; }

@media (max-width: 900px){
    .brand-text{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .nav{ top: var(--header-h); } /* hamburger-panel pontosan a header alĂłl indul */
}

/* görgetés tiltása nyitott menü alatt */
body.no-scroll{ overflow: hidden; touch-action: none; }

/* =============== HERO / CTA =============== */
.hero-pro{ padding: clamp(28px, 6vw, 56px) 0 16px; }
.hero-pro .sub{ max-width: 70ch; }
.cta-row{ gap: .5rem; }
@media (max-width: 520px){
    .cta-row .btn{ width: 100%; text-align: center; }
}

/* statbar: 4→2→1 hasáb */
.statbar{ display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
@media (max-width: 900px){ .statbar{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 480px){ .statbar{ grid-template-columns: 1fr; } }

/* =============== FEATURED / CARDS =============== */
/* kártyaborítók egységes arányon */
.grid.cards > .card > img{ width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 0; }

/* =============== GAME CARDS =============== */
.game-cards .cover img{ aspect-ratio: 16 / 9; object-fit: cover; }

/* =============== PHOTO STRIP (home) =============== */
.home-photos .mini-strip{ grid-template-columns: repeat(6,1fr); gap: 6px; }
@media (max-width: 1000px){ .home-photos .mini-strip{ grid-template-columns: repeat(4,1fr); } }
@media (max-width: 640px){  .home-photos .mini-strip{ grid-template-columns: repeat(2,1fr); } }

/* =============== ABOUT / FORM =============== */
.home-about .cols{ display: grid; grid-template-columns: 1.3fr 1fr; gap: 16px; }
@media (max-width: 900px){ .home-about .cols{ grid-template-columns: 1fr; } }

form .grid2{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px){ form .grid2{ grid-template-columns: 1fr; } }

/* űrlap gombok mobilon szélesek */
@media (max-width: 560px){
    .actions.stacked .btn{ width: 100%; }
}

/* =============== PROJECT LIST – mobil-first =============== */
.project-list{ display:grid; gap: 28px; padding-top: 24px; padding-bottom: 24px; }
.project-head{
    display:flex; gap:12px; align-items:flex-start; justify-content:space-between;
    flex-wrap: wrap; /* hogy a gomb le tudjon törni */
}
.project-head h2{ margin:0; font-size: clamp(1.1rem, 2.5vw, 1.35rem); }
@media (max-width: 560px){
    .project .actions{ width: 100%; display: grid; gap: 8px; }
    .project .actions .btn{ width: 100%; text-align: center; }
}
.project-body{ display:grid; grid-template-columns: 1fr; gap:16px; padding:16px; }
@media (min-width: 900px){ .project-body{ grid-template-columns: 1.2fr 1fr; } }

.mini-gallery{ display:grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
@media (max-width: 560px){ .mini-gallery{ grid-template-columns: repeat(2,1fr); } }
.mini-gallery img{ width:100%; height:100%; object-fit: cover; aspect-ratio: 4/3; }

/* Opcionális: a teljes project-list két oszlop nagy kijelzőn */
@media (min-width: 1100px){
    .project-list.project-list--grid{
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }
    .project-list.project-list--grid .project{
        display:grid; grid-template-rows: auto 1fr; height: 100%;
    }
}

/* =============== FOOTER =============== */
@media (max-width: 720px){
    .site-footer{ flex-direction: column; align-items: flex-start; gap: 10px; }
}

/* =============== REDUCED MOTION SAFETY =============== */
@media (prefers-reduced-motion: reduce){
    *{ scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}


/* ===== Footer: full-bleed háttér + konténeres tartalom ===== */
.site-footer{
    /* teljes szélességű sáv */
    width: 100%;
    max-width: none;                 /* felülírjuk a korábbi max-width-et */
    border-top: 1px solid var(--line);
    background: #fff;

    /* okos oldalpadd: középre zárt konténer wrapper nélkül */
    padding-top: 18px;
    padding-bottom: 18px;
    padding-left: max(var(--gutter,16px), calc((100vw - var(--container,1100px)) / 2));
    padding-right: max(var(--gutter,16px), calc((100vw - var(--container,1100px)) / 2));

    /* elrendezés: 2 oszlop desktopon */
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    gap: 10px 20px;
}

/* tipĂł Ă©s linkek */
.site-footer strong{ display:block; margin-bottom: 2px; }
.site-footer a{ color: var(--accent); text-decoration: none; overflow-wrap:anywhere; }
.site-footer a:hover{ text-decoration: underline; }
.site-footer .small{ color:#888; font-size:.95rem; line-height:1.5; justify-self: end; }

/* mobil: 1 oszlop, kényelmes tappolás */
@media (max-width: 720px){
    .site-footer{
        grid-template-columns: 1fr;
        gap: 6px;
        /* kicsit nagyobb oldalpad, hogy ne ragadjon a szélekhez */
        padding-left: max(14px, env(safe-area-inset-left));
        padding-right: max(14px, env(safe-area-inset-right));
    }
    .site-footer .small{ justify-self: start; }
    .site-footer a{ display:inline-block; margin-right:.35rem; }
}

/* ===== Language switcher ===== */
.lang-switch {
    margin-left: auto;
    display: flex;
    gap: .25rem;
    align-items: center;
    font-weight: 600;
}
.lang-switch a, .lang-switch span {
    padding: 6px 8px;
    border-radius: 10px;
}
.lang-switch a {
    border: 1px solid var(--line);
    text-decoration: none;
    color: var(--ink);
}
.lang-switch .active {
    background: var(--ink);
    color: #fff;
}
@media (max-width: 800px){
    .lang-switch{order:99;margin-left:0}
}


/* Nyelvváltó – desktop: jobbra tolva, egy sorban marad */
.lang-switch{
    margin-left: auto;
    display: flex;
    gap: .25rem;
    align-items: center;
    font-weight: 600;
    white-space: nowrap;         /* ← ne törje ketté a HU | EN-t */
}
.lang-switch a, .lang-switch span{
    display: inline-flex;        /* szebb vertikális igazítás */
    align-items: center;
    padding: 6px 8px;
    border-radius: 10px;
    line-height: 1;              /* kompakt magasság */
}
.lang-switch a{
    border: 1px solid var(--line);
    text-decoration: none;
    color: var(--ink);
}
.lang-switch .active{
    background: var(--ink);
    color: #fff;
}

/* Mobil: kerüljön a lista végére, kapjon kis felső margót, maradjon egyben */
@media (max-width: 900px){
    .lang-switch{
        order: 99;
        margin-left: 0;
        margin-top: 6px;
    }
}