:root {
  --green: #5BA847;
  --gdark: #3D7A2C;
  --glight: #7CC46A;
  --gbg: #EDF7EA;
  --brown: #8B5E3C;
  --brownl: #C49A6C;
  --yellow: #F5C842;
  --orange: #F0893A;
  --cream: #FAFDF8;
  --white: #fff;
  --text: #2E3B28;
  --muted: #6B7C65;
  --bdr: rgba(91,168,71,.18);
  --r: 16px;
  --sh: 0 8px 40px rgba(61,122,44,.12);
  --shs: 0 3px 16px rgba(61,122,44,.09);
  --fh: "Baloo 2","Nunito",sans-serif;
  --fb: "Nunito",system-ui,sans-serif;
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior: smooth }
body { font-family:var(--fb); background:var(--cream); color:var(--text); line-height:1.7; overflow-x:hidden }
a { text-decoration:none; color:inherit }
ul { list-style:none }
img { max-width:100%; height:auto; display:block }
.blob { position:absolute; border-radius:50%; filter:blur(70px); opacity:.15; pointer-events:none; z-index:0 }

/* NAV */
nav { position:fixed; top:0; left:0; right:0; z-index:999; background:rgba(250,253,248,.96); backdrop-filter:blur(14px); border-bottom:2px solid var(--bdr); box-shadow:0 2px 20px rgba(61,122,44,.08) }
.nav-inner { max-width:1200px; margin:auto; display:flex; align-items:center; justify-content:space-between; padding:0 28px; height:72px }
.logo-wrap { display:flex; align-items:center }
.logo-fig,.logo-arnia { font-family:var(--fh); font-size:1.9rem; color:var(--gdark); letter-spacing:-.5px; line-height:1 }
.logo-monkey { display:inline-block; width:31px; height:37px; vertical-align:middle; margin:0 -1px; position:relative; top:-2px }
.logo-img { height:52px; width:auto; display:block }
.nav-links { display:flex; gap:2px; align-items:center }
.nav-links a { font-size:.85rem; font-weight:700; padding:7px 13px; border-radius:30px; color:var(--text); transition:all .2s }
.nav-links a:hover,.nav-links a.active { background:var(--green); color:#fff }
.nav-cta { background:var(--green) !important; color:#fff !important; box-shadow:0 4px 14px rgba(91,168,71,.35) }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:8px; border:none; background:none }
.hamburger span { display:block; width:26px; height:3px; background:var(--gdark); border-radius:3px }
.mob { display:none; position:fixed; top:72px; left:0; right:0; background:var(--white); z-index:998; box-shadow:0 8px 32px rgba(61,122,44,.14); padding:24px; border-bottom:3px solid var(--green) }
.mob.open { display:block }
.mob a { display:block; padding:12px 0; font-size:1rem; font-weight:700; color:var(--text); border-bottom:1px solid var(--bdr) }
.mob a:hover { color:var(--green) }

/* UTILS */
.wrap { max-width:1160px; margin:auto; padding:0 24px }
.btn { display:inline-flex; align-items:center; gap:8px; font-family:var(--fb); font-size:.95rem; font-weight:800; padding:14px 28px; border-radius:50px; cursor:pointer; transition:all .25s; border:none }
.btn-g { background:var(--green); color:#fff; box-shadow:0 6px 24px rgba(91,168,71,.4) }
.btn-g:hover { background:var(--gdark); transform:translateY(-2px) }
.btn-o { background:transparent; color:var(--gdark); border:2.5px solid var(--green) }
.btn-o:hover { background:var(--green); color:#fff; transform:translateY(-2px) }
.stag { display:inline-block; font-size:.75rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--gdark); background:var(--gbg); padding:5px 14px; border-radius:20px; margin-bottom:12px }
.stitle { font-family:var(--fh); font-size:clamp(1.8rem,3.5vw,2.7rem); color:var(--text); line-height:1.2; margin-bottom:14px }
.ssub { font-size:1.05rem; color:var(--muted); max-width:560px }
.shead { margin-bottom:52px }

/* HERO */
#hero { min-height:100vh; background:linear-gradient(140deg,#f0fae8,#e8f6e0 40%,#f5fdf0); display:flex; align-items:center; padding-top:80px; position:relative; overflow:hidden }
.hero-in { position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; padding:60px 0 }
.hbadge { display:inline-flex; align-items:center; gap:8px; background:var(--white); border:2px solid var(--green); color:var(--gdark); font-size:.8rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; padding:6px 16px; border-radius:30px; margin-bottom:22px; box-shadow:var(--shs) }
.htitle { font-family:var(--fh); font-size:clamp(2.4rem,5vw,3.8rem); line-height:1.15; color:var(--text); margin-bottom:20px }
.htitle em { color:var(--green); font-style:normal }
.htitle .ul { position:relative }
.htitle .ul::after { content:""; position:absolute; bottom:-4px; left:0; right:0; height:5px; background:var(--yellow); border-radius:3px }
.hdesc { font-size:1.08rem; color:var(--muted); max-width:470px; margin-bottom:34px }
.hact { display:flex; gap:14px; flex-wrap:wrap }
.hstats { display:flex; gap:22px; margin-top:38px; flex-wrap:wrap }
.stat { text-align:center; background:rgba(255,255,255,.85); border-radius:14px; padding:14px 20px; box-shadow:var(--shs) }
.snum { font-family:var(--fh); font-size:1.9rem; color:var(--green) }
.slbl { font-size:.75rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.06em }
.hcards { display:grid; grid-template-columns:1fr 1fr; gap:14px }
.hcard { background:var(--white); border-radius:var(--r); padding:24px 20px; box-shadow:var(--sh); transition:transform .3s; border-top:4px solid var(--glight) }
.hcard:nth-child(2) { border-top-color:var(--yellow); margin-top:26px }
.hcard:nth-child(3) { border-top-color:var(--orange) }
.hcard:nth-child(4) { border-top-color:var(--brownl); margin-top:-26px }
.hcard:nth-child(5) { border-top-color:var(--green); margin-top:14px }
.hcard:hover { transform:translateY(-5px) }
.hci { font-size:2rem; margin-bottom:8px }
.hct { font-weight:800; font-size:.92rem; color:var(--text); margin-bottom:5px }
.hcd { font-size:.8rem; color:var(--muted); line-height:1.5 }

/* O NAS */
#onas { padding:100px 0; background:var(--white) }
.ag { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center }
.awrap { position:relative }
.aimg { width:100%; border-radius:24px; background:linear-gradient(135deg,var(--gbg),#d0edca); aspect-ratio:4/5; display:flex; align-items:center; justify-content:center; font-size:7rem; box-shadow:var(--sh); overflow:hidden }
.aimg img { width:100%; height:100%; object-fit:cover; display:block; border-radius:24px }
.abadge { position:absolute; bottom:28px; left:-20px; background:var(--white); border-radius:14px; padding:16px 20px; box-shadow:var(--sh); display:flex; align-items:center; gap:14px; border-left:4px solid var(--green) }
.abnum { font-size:1.4rem; font-weight:900; color:var(--green) }
.ablbl { font-size:.78rem; color:var(--muted); font-weight:700 }
.afeats { margin-top:28px; display:flex; flex-direction:column; gap:12px }
.feat { display:flex; align-items:flex-start; gap:14px; padding:14px 18px; border-radius:12px; background:var(--gbg); transition:all .25s; border-left:3px solid transparent }
.feat:hover { border-left-color:var(--green); transform:translateX(4px) }
.ficon { font-size:1.4rem; width:40px; height:40px; display:flex; align-items:center; justify-content:center; background:var(--white); border-radius:10px; box-shadow:var(--shs); flex-shrink:0 }
.ftxt strong { display:block; font-weight:800; color:var(--text); font-size:.92rem; margin-bottom:2px }
.ftxt span { font-size:.83rem; color:var(--muted) }
.mbox { margin-top:22px; padding:20px 22px; background:linear-gradient(135deg,rgba(91,168,71,.07),rgba(139,94,60,.06)); border-radius:14px; border-left:4px solid var(--green) }
.mbox p { font-size:.88rem; color:var(--text); line-height:1.8 }

/* ZAJECIA */
#zajecia { padding:100px 0; background:var(--gbg) }
.sgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:24px }
.sgrid-2 { grid-template-columns:repeat(2,minmax(290px,380px)); justify-content:center }
.scard { background:var(--white); border-radius:22px; padding:34px 28px; box-shadow:var(--shs); transition:all .3s; position:relative; overflow:hidden; border:1.5px solid transparent }
.scard::after { content:""; position:absolute; bottom:0; left:0; right:0; height:4px }
.c1::after { background:var(--green) }
.c2::after { background:var(--yellow) }
.c3::after { background:var(--orange) }
.c4::after { background:var(--brownl) }
.scard:hover { transform:translateY(-8px); box-shadow:var(--sh); border-color:var(--bdr) }
.sico { width:64px; height:64px; border-radius:18px; display:flex; align-items:center; justify-content:center; font-size:2.1rem; margin-bottom:20px }
.c1 .sico { background:var(--gbg) }
.c2 .sico { background:rgba(245,200,66,.15) }
.c3 .sico { background:rgba(240,137,58,.12) }
.c4 .sico { background:rgba(196,154,108,.15) }
.stit { font-family:var(--fh); font-size:1.35rem; color:var(--text); margin-bottom:12px }
.sdesc { font-size:.9rem; color:var(--muted); margin-bottom:20px; line-height:1.7 }
.slist { display:flex; flex-direction:column; gap:8px }
.slist li { display:flex; align-items:flex-start; gap:10px; font-size:.87rem; color:var(--text) }
.slist li::before { content:"\2713"; flex-shrink:0; width:19px; height:19px; border-radius:50%; background:var(--green); color:#fff; display:flex; align-items:center; justify-content:center; font-size:.68rem; font-weight:900; margin-top:3px }
.c2 .slist li::before { background:var(--yellow); color:var(--text) }
.c3 .slist li::before { background:var(--orange) }
.c4 .slist li::before { background:var(--brown) }
.slink { display:inline-flex; align-items:center; gap:5px; margin-top:20px; font-size:.87rem; font-weight:800; color:var(--gdark); border-bottom:2px solid transparent; transition:all .2s }
.slink:hover { border-bottom-color:var(--green) }

/* GRAFIK */
#grafik { padding:100px 0; background:var(--gbg) }
.schgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:22px }
.schcard { background:var(--white); border-radius:22px; padding:34px 26px; box-shadow:var(--shs); transition:all .3s; border-top:5px solid var(--green) }
.schcard:nth-child(2) { border-top-color:var(--yellow) }
.schcard:nth-child(3) { border-top-color:var(--orange) }
.schcard:hover { transform:translateY(-6px); box-shadow:var(--sh) }
.schday { font-family:var(--fh); font-size:1.7rem; color:var(--text); margin-bottom:4px }
.schloc { font-size:.82rem; font-weight:700; color:var(--muted); margin-bottom:20px; line-height:1.5 }
.schtimes { display:flex; flex-direction:column; gap:10px }
.schtime { display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:11px; background:var(--gbg) }
.tdot { width:11px; height:11px; border-radius:50%; background:var(--green); flex-shrink:0 }
.schcard:nth-child(2) .tdot { background:var(--yellow) }
.schcard:nth-child(3) .tdot { background:var(--orange) }
.tinfo strong { display:block; font-size:.88rem; font-weight:800; color:var(--text) }
.tinfo span { font-size:.79rem; color:var(--muted) }

/* FACEBOOK */
#facebook { padding:80px 0; background:var(--white) }
.fb-wrap { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start }
.fb-text p { font-size:1rem; color:var(--muted); margin-bottom:28px; line-height:1.75 }
.fb-badge { display:inline-flex; align-items:center; gap:12px; background:#1877F2; color:#fff; padding:12px 22px; border-radius:50px; font-weight:800; font-size:.95rem; text-decoration:none; transition:all .25s; box-shadow:0 6px 20px rgba(24,119,242,.35) }
.fb-badge:hover { background:#0d65d9; transform:translateY(-2px); box-shadow:0 10px 28px rgba(24,119,242,.45) }
.fb-badge svg { flex-shrink:0 }
.fb-card { background:var(--gbg); border-radius:20px; overflow:hidden; box-shadow:var(--sh); border:1.5px solid var(--bdr) }
.fb-card-header { background:#1877F2; padding:18px 22px; display:flex; align-items:center; gap:14px }
.fb-card-header svg { flex-shrink:0 }
.fb-card-header-text strong { display:block; color:#fff; font-size:1rem; font-weight:800 }
.fb-card-header-text span { color:rgba(255,255,255,.75); font-size:.8rem }
.fb-posts { display:flex; flex-direction:column; gap:0 }
.fb-post { padding:20px 22px; border-bottom:1px solid var(--bdr); transition:background .2s; cursor:pointer; text-decoration:none; display:block; color:inherit }
.fb-post:last-child { border-bottom:none }
.fb-post:hover { background:rgba(24,119,242,.04) }
.fb-post-date { font-size:.75rem; color:var(--muted); font-weight:700; margin-bottom:7px; display:flex; align-items:center; gap:6px }
.fb-post-date::before { content:""; width:8px; height:8px; border-radius:50%; background:#1877F2; flex-shrink:0 }
.fb-post-text { font-size:.9rem; color:var(--text); line-height:1.6 }
.fb-post-img { width:100%; border-radius:10px; margin-top:12px; object-fit:cover; max-height:180px }
.fb-card-footer { padding:16px 22px; text-align:center; border-top:1px solid var(--bdr) }
.fb-card-footer a { font-size:.85rem; font-weight:800; color:#1877F2; display:inline-flex; align-items:center; gap:7px }
.fb-card-footer a:hover { text-decoration:underline }
@media(max-width:880px) { .fb-wrap { grid-template-columns:1fr } }

/* GALERIA */
#galeria { padding:100px 0; background:var(--gbg) }
.ggrid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px }
.gitem { border-radius:13px; overflow:hidden; cursor:pointer; position:relative; aspect-ratio:1; transition:transform .3s; background:linear-gradient(135deg,#d0edca,#b8e0b0) }
.gitem:nth-child(3n+2) { background:linear-gradient(135deg,#f5e9cc,#f0d8a8) }
.gitem:nth-child(3n+3) { background:linear-gradient(135deg,#fde8d8,#f8cdb0) }
.gitem:hover { transform:scale(1.03); z-index:2; box-shadow:var(--sh) }
.gitem img { width:100%; height:100%; object-fit:cover; transition:transform .4s; display:block }
.gitem:hover img { transform:scale(1.08) }
.gov { position:absolute; inset:0; background:linear-gradient(to top,rgba(46,59,40,.65),transparent); opacity:0; transition:opacity .3s; display:flex; align-items:flex-end; padding:14px }
.gitem:hover .gov { opacity:1 }
.gov span { color:#fff; font-size:.79rem; font-weight:700 }
.gemoji { width:100%; height:100%; display:none; align-items:center; justify-content:center; font-size:3.5rem }
.gitem.ie img { display:none }
.gitem.ie .gemoji { display:flex }
.lb { display:none; position:fixed; inset:0; z-index:9999; background:rgba(10,20,8,.93); backdrop-filter:blur(10px); align-items:center; justify-content:center }
.lb.on { display:flex }
.lbx { position:absolute; top:24px; right:32px; font-size:2.5rem; color:#fff; cursor:pointer; opacity:.7; border:none; background:none; line-height:1 }
.lbx:hover { opacity:1 }
.lbimg { max-width:90vw; max-height:85vh; border-radius:14px; object-fit:contain; box-shadow:0 32px 80px rgba(0,0,0,.5) }
.lbem { font-size:9rem; text-align:center }

/* KONTAKT */
#kontakt { padding:100px 0; background:var(--white) }
.cgrid { display:grid; grid-template-columns:1fr 1.4fr; gap:56px; align-items:start }
.ccards { display:flex; flex-direction:column; gap:16px }
.ccard { background:var(--gbg); border-radius:18px; padding:22px 24px; box-shadow:var(--shs); display:flex; align-items:flex-start; gap:16px; transition:transform .25s; border-left:4px solid var(--green) }
.ccard:hover { transform:translateX(5px) }
.ccico { font-size:1.7rem; width:48px; height:48px; background:var(--white); border-radius:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:var(--shs) }
.ccard h4 { font-weight:900; font-size:.93rem; color:var(--text); margin-bottom:4px }
.ccard p,.ccard a { font-size:.89rem; color:var(--muted); line-height:1.6 }
.ccard a:hover { color:var(--gdark) }
.cform { background:var(--gbg); border-radius:26px; padding:40px 38px; box-shadow:var(--sh); border:1.5px solid var(--bdr) }
.cform h3 { font-family:var(--fh); font-size:1.65rem; color:var(--text); margin-bottom:26px }
.fg { margin-bottom:18px }
.fg label { display:block; font-size:.84rem; font-weight:700; color:var(--text); margin-bottom:6px }
.fg input,.fg textarea,.fg select { width:100%; padding:12px 16px; border:2px solid rgba(91,168,71,.2); border-radius:11px; font-family:var(--fb); font-size:.91rem; color:var(--text); background:var(--white); transition:border-color .2s; outline:none }
.fg input:focus,.fg textarea:focus,.fg select:focus { border-color:var(--green) }
.fg textarea { resize:vertical; min-height:110px }
.frow { display:grid; grid-template-columns:1fr 1fr; gap:14px }
.binfo { margin-top:18px; padding:16px 20px; background:rgba(91,168,71,.08); border-radius:12px; border-left:3px solid var(--green) }
.binfo h5 { font-weight:900; font-size:.88rem; color:var(--text); margin-bottom:7px }
.binfo p { font-size:.84rem; color:var(--muted); line-height:1.75 }

/* FOOTER */
footer { background:var(--gdark); color:rgba(255,255,255,.78); padding:60px 0 28px }
.fgrid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:38px; margin-bottom:40px }
.fbrand p { font-size:.87rem; line-height:1.75; margin-top:12px }
.fcol h5 { font-weight:900; font-size:.86rem; text-transform:uppercase; letter-spacing:.1em; color:#fff; margin-bottom:16px }
.fcol ul { display:flex; flex-direction:column; gap:9px }
.fcol li { font-size:.87rem }
.fcol a { color:rgba(255,255,255,.68); transition:color .2s }
.fcol a:hover { color:var(--yellow) }
.fbot { border-top:1px solid rgba(255,255,255,.14); padding-top:22px; text-align:center; font-size:.8rem }
.stb { position:fixed; bottom:30px; right:30px; z-index:900; width:46px; height:46px; border-radius:50%; background:var(--green); color:#fff; border:none; font-size:1.2rem; cursor:pointer; box-shadow:0 4px 18px rgba(91,168,71,.45); opacity:0; pointer-events:none; transition:all .3s; display:flex; align-items:center; justify-content:center }
.stb.on { opacity:1; pointer-events:all }
.stb:hover { background:var(--gdark); transform:translateY(-3px) }

/* RESPONSIVE */
@media(max-width:1040px) { .fgrid{grid-template-columns:1fr 1fr} .ggrid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:880px) { .hero-in,.ag,.bdgrid,.shgrid,.cgrid{grid-template-columns:1fr} .hcards{grid-template-columns:1fr 1fr;margin-top:28px} .hcard:nth-child(2),.hcard:nth-child(4),.hcard:nth-child(5){margin-top:0} .abadge{left:0} .nav-links{display:none} .hamburger{display:flex} }
@media(max-width:600px) { .ggrid{grid-template-columns:repeat(2,1fr)} .benef,.schgrid,.sgrid{grid-template-columns:1fr} .hcards{grid-template-columns:1fr} .cform{padding:24px 18px} .frow,.fgrid{grid-template-columns:1fr} .bvis{display:none} }
