/* ===== GlampingGuide aloldalak =====
   KOZOS stiluslap a /projektek/<slug>/ es az /expo/ lapokhoz.

   MIERT KULON FAJL, es miert nem inline, mint a fooldalon:
   a fooldal EGY lap 14 nyelven, ott az inline CSS kevesebb kerest jelent.
   Itt NYOLC lap hasznalja ugyanazt, tehat a kulon fajl egyszer tolt le,
   utana gyorsitotarbol jon. Es ami ennel fontosabb: a szinvilag-dontes
   (docs/glampingguide-felujitas-terv.md, 3.1) meg nyitott. Ha a landing
   atvalt az atadoanyag erdozold palettajara, akkor az alabbi :root blokk
   EGYETLEN atirasaval mind a nyolc aloldal koveti. Nyolc lapba masolt
   tokenbol ez nyolc szerkesztes es legalabb egy kifelejtett lap lenne.

   A tokenek MOST a landing (sites/glampingguide.hu/sablon/index.html)
   ertekei, nem a /tervezo/ lape. Indok: ezekre a lapokra a landingrol
   kattint at a latogato, tehat a landinggal kell egy csaladnak latszania. */
:root{
  --erdo:#2F3A22;
  --oliva:#5E6B44;
  --moha:#7C8A5C;
  --homok:#EDE7D0;
  --papir:#FAF9F4;
  --zuzmo:#C9D89A;
  --szoveg:#2B2F24;
  --halvany:#5D6152;
  --vonal:#DAD4BC;
  --hiba:#A23B2A;
  --r-nagy:22px; --r-kicsi:10px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--papir);color:var(--szoveg);
     font:16px/1.65 "Poppins",system-ui,sans-serif;overflow-x:hidden}
h1,h2,h3{font-family:"Poppins",sans-serif;color:var(--erdo);line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(1.9rem,5vw,3.1rem);font-weight:600;letter-spacing:-.02em}
h2{font-size:clamp(1.4rem,3.4vw,2rem);font-weight:500}
h3{font-size:1.1rem;font-weight:600}
p{margin:0 0 1em;max-width:68ch}
.serif{font-family:"Lora",Georgia,serif}
a{color:var(--oliva)}
:focus-visible{outline:3px solid var(--oliva);outline-offset:3px}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}
img{max-width:100%;display:block}

/* ---- Fejlec. Ugyanaz a mintazat, mint a landingen, hogy az atkattintas
        ne erezzen hatarnak. A menupontok a FOOLDAL horgonyaira mutatnak,
        abszolut uttal: innen a "#projektek" onmagaban az aloldalt keresne. */
header.top{display:flex;justify-content:space-between;align-items:center;gap:12px;
           padding:18px 16px;max-width:1120px;margin:0 auto}
/* A markajel 2026-11-02 ota itt is ott van, a nyitolappal AZONOS meretben
   (44 px) es szerkezetben. A `.szo` burkolo nem dekoracio: enelkul a
   "Glamping" es a "Guide" ket kulon flex-elem lenne, es a 10 px-es `gap`
   kettevagna a nevet. */
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--erdo);text-decoration:none}
.logo img{width:44px;height:44px;display:block;flex:none}
.logo .szo{font-weight:700;font-size:1.25rem;line-height:1}
.logo .szo span{font-weight:400}
.top nav{display:flex;gap:16px;flex-wrap:wrap;min-width:0}
.top nav a{text-decoration:none;font-size:.95rem;color:var(--halvany)}
.top nav a:hover{color:var(--erdo)}

/* ---- Nyelvvalto ----
   2026-10-18: az aloldalak ot tovabbi nyelven is allnak, de a fejlecbol nem
   lehetett nyelvet valtani. Ugyanaz a hianyossag, ami a nyitolapon es a
   glamping.hu-n is elsult: a hreflang tudta, hogy letezik a nemet lap, a
   latogato nem.
   A `flex-wrap` es a `min-width:0` NEM diszites, lasd a nyitolap sablonjat:
   nelkuluk a valto egyetlen nem-tordelo flex-elem, ami kizoomolja a mobilt. */
.nyelvvalto{display:inline-flex;flex-wrap:wrap;gap:6px 10px;align-items:center;
            font-size:.95rem;min-width:0;
            padding-left:16px;border-left:1px solid var(--vonal)}
.nyelvvalto a{color:var(--halvany);text-decoration:none}
.nyelvvalto a:hover{color:var(--erdo);text-decoration:underline}
.nyelvvalto strong{color:var(--erdo);font-weight:600}
@media (max-width:760px){.nyelvvalto{flex-basis:100%;padding-left:0;border-left:0;
                                     padding-top:6px;border-top:1px solid var(--vonal)}}

/* ---- Morzsa ---- */
.morzsa{font-size:.9rem;color:var(--halvany);padding:6px 0 0}
.morzsa a{color:var(--halvany);text-decoration:none}
.morzsa a:hover{color:var(--erdo);text-decoration:underline}
.morzsa span{opacity:.6;padding:0 6px}

/* ---- Fejlap ---- */
.fejlap{padding:18px 0 30px}
.fejlap .cimke{display:inline-block;background:var(--homok);color:var(--erdo);
               border-radius:999px;padding:4px 14px;font-size:.85rem;font-weight:500;
               margin-bottom:14px}
.fejlap .lead{font-family:"Lora",Georgia,serif;font-size:1.18rem;color:var(--halvany);
              line-height:1.7;max-width:62ch}

/* A nyito kep. Fix aranyu doboz: igy a lap nem ugrik meg betoltes kozben,
   akkor sem, ha a kepek aranya nem egyezik pontosan. */
.nyitokep{border-radius:var(--r-nagy);overflow:hidden;background:var(--homok);
          margin:8px 0 6px}
.nyitokep img{width:100%;height:clamp(240px,42vw,480px);object-fit:cover}
.kepalairas{font-size:.85rem;color:var(--halvany);margin:0 0 26px;max-width:68ch}

/* ---- Torzs ---- */
.torzs{padding:8px 0 10px}
.torzs p{font-size:1.03rem}

/* ---- Tenyek. Nem tablazat: egy tablazat itt szamokat igerne, es
        szandekosan NINCS koltseg- es hozamszam a lapokon. ---- */
.tenyek{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;
        margin:10px 0 30px;padding:0;list-style:none}
.tenyek li{background:#fff;border:1px solid var(--vonal);border-radius:var(--r-kicsi);
           padding:14px 16px}
.tenyek b{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;
          color:var(--moha);font-weight:600;margin-bottom:2px}

/* ---- Galeria ---- */
.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;
         margin:6px 0 10px}
.galeria a{display:block;border-radius:var(--r-kicsi);overflow:hidden;background:var(--homok);
           line-height:0}
.galeria img{width:100%;height:200px;object-fit:cover;transition:transform .35s ease}
.galeria a:hover img,.galeria a:focus-visible img{transform:scale(1.04)}
/* Az elso kep a racsban ket oszlopot foglal, ahol van hely ra. Enelkul a
   galeria egyenletes, de lapos; igy van benne egy hangsuly. */
@media (min-width:880px){
  .galeria .kiemelt{grid-column:span 2}
  .galeria .kiemelt img{height:412px}
}

/* ---- Szakaszfej ---- */
.szakasz{padding:26px 0 6px}
.szakasz h2{margin-bottom:.35em}
.szakasz>p{color:var(--halvany)}

/* ---- Program-racs (expo) ---- */
.racs{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;
      margin:10px 0 26px}
.elem{background:#fff;border:1px solid var(--vonal);border-radius:var(--r-kicsi);padding:18px 20px}
.elem b{display:block;color:var(--erdo);margin-bottom:6px}
.elem span{color:var(--halvany);font-size:.96rem}

/* ---- Megjegyzes-sav. Ide kerul minden "ez terv, nem megvalosult beruhazas"
        tipusu mondat. Lathatonak kell lennie, de nem riasztonak. ---- */
.megjegyzes{background:var(--homok);border-radius:var(--r-kicsi);padding:14px 18px;
            font-size:.94rem;color:var(--erdo);max-width:none;margin:4px 0 26px}

/* ---- CTA sav ---- */
.gomb{display:inline-block;background:var(--erdo);color:#fff;text-decoration:none;
      border-radius:999px;padding:13px 26px;font-weight:500;border:1.5px solid var(--erdo)}
.gomb:hover{background:var(--oliva);border-color:var(--oliva)}
.gomb.masod{background:transparent;color:var(--erdo)}
.gomb.masod:hover{background:var(--homok);color:var(--erdo)}
.cta{background:var(--homok);border-radius:var(--r-nagy);padding:28px 30px;margin:20px 0 40px;
     display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}
.cta h2{margin-bottom:.3em}
.cta p{margin:0;color:var(--halvany)}

/* ---- Tovabbi tervek ---- */
.tovabbiak{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;
           margin:8px 0 36px}
.tovabbiak a{display:flex;flex-direction:column;gap:2px;background:#fff;text-decoration:none;
             border:1px solid var(--vonal);border-radius:var(--r-kicsi);padding:14px 16px;
             color:var(--szoveg)}
.tovabbiak a:hover{border-color:var(--moha);background:var(--papir)}
.tovabbiak b{color:var(--erdo)}
.tovabbiak small{color:var(--halvany)}

/* ---- Lablec ---- */
footer{background:var(--erdo);color:#E7E9DF;margin-top:10px;padding:34px 0}
footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:22px;
             font-size:.93rem}
footer a{color:var(--zuzmo)}
footer strong{color:#fff}

@media (max-width:860px){
  .cta{grid-template-columns:1fr;padding:22px}
}
@media (max-width:480px){
  .galeria{grid-template-columns:1fr}
  .galeria img{height:220px}
  .nyitokep img{height:230px}
}
