:root{
  --ink:#12232F;
  --ink-soft:#20394A;
  --paper:#F1EDE3;
  --paper-2:#E3DCCB;
  --text:#22323C;
  --text-soft:#5B6B74;
  --brass:#BE8C36;
  --danube:#3B786B;
  --wine:#8B4A50;
  --sky:#6D93A6;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Karla",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --measure:34rem;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--text);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}

h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;line-height:1.12;letter-spacing:-.012em}
h1{font-size:clamp(2.6rem,6.4vw,4.6rem);font-weight:300}
h2{font-size:clamp(2rem,4.2vw,3rem)}
h3{font-size:1.32rem;line-height:1.25}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}

.wrap{width:min(100% - 2.5rem,74rem);margin-inline:auto}
.measure{max-width:var(--measure)}

/* ---------- fejléc ---------- */
.masthead{
  position:sticky;top:0;z-index:50;
  background:rgba(18,35,47,.94);
  backdrop-filter:blur(10px);
  color:var(--paper);
}
.masthead-in{
  display:flex;align-items:center;gap:1.5rem;
  padding:.7rem 0;
}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:0 0 auto}
.brand svg{width:34px;height:34px;flex:0 0 auto}
.brand b{font-family:var(--serif);font-weight:400;font-size:1.16rem;letter-spacing:.05em}
.nav{margin-left:auto;display:flex;align-items:center;gap:1.7rem}
.nav a{
  text-decoration:none;font-size:.94rem;color:rgba(241,237,227,.78);
  padding:.3rem 0;border-bottom:1px solid transparent;
}
.nav a:hover,.nav a:focus-visible{color:var(--paper);border-bottom-color:var(--brass)}
.nav .btn-sm{
  border:1px solid rgba(190,140,54,.7);border-radius:999px;
  padding:.42rem 1.05rem;color:var(--paper);
}
.nav .btn-sm:hover{background:var(--brass);border-color:var(--brass);color:var(--ink)}
@media(max-width:720px){
  .nav{gap:1rem}
  .nav a.hide-s{display:none}
}

/* ---------- hero ---------- */
.hero{
  position:relative;overflow:hidden;
  background:var(--ink);color:var(--paper);
  padding:clamp(4.5rem,11vw,8.5rem) 0 clamp(4rem,9vw,7rem);
}
.rosette{
  position:absolute;pointer-events:none;
  right:-14vw;top:50%;transform:translateY(-50%);
  width:min(64vw,720px);aspect-ratio:1;
  opacity:.9;
}
.rosette circle{mix-blend-mode:screen}
.rosette .drift{animation:drift 26s ease-in-out infinite alternate;transform-origin:50% 50%}
.rosette .drift:nth-child(2){animation-delay:-4s}
.rosette .drift:nth-child(3){animation-delay:-9s}
.rosette .drift:nth-child(4){animation-delay:-14s}
.rosette .drift:nth-child(5){animation-delay:-19s}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(1.4%,-1.8%)}}
@media(prefers-reduced-motion:reduce){.rosette .drift{animation:none}}
@media(max-width:820px){
  .rosette{right:-38vw;top:auto;bottom:-16vh;transform:none;width:118vw;opacity:.55}
}

.hero-in{position:relative;z-index:2;max-width:36rem}
.hero h1{margin-bottom:1.4rem}
.hero-lead{
  font-size:clamp(1.06rem,2.1vw,1.24rem);
  color:rgba(241,237,227,.82);
  max-width:31rem;margin-bottom:2.3rem;
}
.hero-place{
  font-family:var(--serif);font-style:italic;font-size:1.02rem;
  color:var(--brass);margin-bottom:1.6rem;
}
.actions{display:flex;flex-wrap:wrap;gap:.8rem}
.btn{
  display:inline-block;text-decoration:none;font-weight:500;
  font-size:1rem;padding:.86rem 1.7rem;border-radius:999px;
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.btn-primary{background:var(--brass);color:#1A1206;border:1px solid var(--brass)}
.btn-primary:hover{background:#D2A04B;border-color:#D2A04B}
.btn-ghost{border:1px solid rgba(241,237,227,.4);color:var(--paper)}
.btn-ghost:hover{border-color:var(--paper);background:rgba(241,237,227,.09)}
.btn-dark{background:var(--ink);color:var(--paper);border:1px solid var(--ink)}
.btn-dark:hover{background:var(--ink-soft);border-color:var(--ink-soft)}

/* ---------- általános szekció ---------- */
.band{padding:clamp(3.8rem,8vw,6.5rem) 0}
.band-paper2{background:var(--paper-2)}
.lede{font-size:1.14rem;color:var(--text-soft)}
.h-block{margin-bottom:3rem}
.h-block h2{margin-bottom:1.1rem}

/* ---------- három pillér ---------- */
.pillars{
  display:grid;gap:2.6rem 2rem;
  grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
}
.pillar-mark{width:74px;height:74px;margin-bottom:1.1rem}
.pillar h3{margin-bottom:.5rem}
.pillar p{color:var(--text-soft);font-size:.98rem}

/* ---------- programok ---------- */
.prog-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(34,50,60,.18)}
.prog-list li{
  display:grid;grid-template-columns:auto 1fr;gap:1.1rem;
  padding:1.5rem 0;border-bottom:1px solid rgba(34,50,60,.18);
  align-items:start;
}
.dot{width:15px;height:15px;border-radius:50%;margin-top:.42rem}
.prog-list h3{font-size:1.2rem;margin-bottom:.25rem}
.prog-list p{color:var(--text-soft);font-size:.97rem;max-width:44rem}

.mosaic{
  margin-top:3.2rem;
  display:grid;gap:.7rem;
  grid-template-columns:repeat(4,1fr);
}
.mosaic figure{margin:0;overflow:hidden;background:var(--paper-2);aspect-ratio:4/3}
.mosaic img{width:100%;height:100%;object-fit:cover}
.mosaic .tall{grid-row:span 2;aspect-ratio:3/4}
.mosaic .wide{grid-column:span 2}
@media(max-width:760px){
  .mosaic{grid-template-columns:repeat(2,1fr)}
  .mosaic .wide{grid-column:span 2}
}

/* ---------- idézet ---------- */
.quote{background:var(--ink);color:var(--paper);text-align:center}
.quote blockquote{
  margin:0 auto;max-width:36rem;
  font-family:var(--serif);font-weight:300;
  font-size:clamp(1.5rem,3.4vw,2.15rem);line-height:1.32;
}
.quote .attrib{
  margin-top:1.6rem;font-size:.92rem;letter-spacing:.09em;
  color:rgba(241,237,227,.6);
}

/* ---------- csatlakozás ---------- */
.join{text-align:center}
.join h2{margin-bottom:1.1rem}
.join p{margin-inline:auto;max-width:31rem;color:var(--text-soft)}
.mailto{
  display:inline-block;margin:2.2rem 0 .8rem;
  font-family:var(--serif);font-size:clamp(1.6rem,4.4vw,2.4rem);
  color:var(--ink);text-decoration:none;
  border-bottom:2px solid var(--brass);padding-bottom:.12rem;
}
.mailto:hover{color:var(--danube);border-bottom-color:var(--danube)}
.join .note{font-size:.92rem}

/* ---------- lábléc ---------- */
.foot{background:var(--ink);color:rgba(241,237,227,.7);padding:2.6rem 0;font-size:.9rem}
.foot-in{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center}
.foot a{color:rgba(241,237,227,.85)}
.foot .right{margin-left:auto}
@media(max-width:620px){.foot .right{margin-left:0}}

:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:99;background:var(--paper);color:var(--ink);padding:.6rem 1rem;border-radius:4px}

/* ---------- WordPress-specifikus kiegészítések ---------- */
.admin-bar .masthead{top:32px}
@media screen and (max-width:782px){.admin-bar .masthead{top:46px}}
@media screen and (max-width:600px){.admin-bar .masthead{top:0}}
.wp-block-image,figure{margin:0}
