/* Kafelki w menu portalu.

   Ten sam wyglad, ktory stal wczesniej w pasku zakladek nad kazda strona —
   tylko ze teraz w jednym miejscu, a nie powielony na kazdej stronie.
   Arkusz podpiety na koncu, wiec te reguly wygrywaja z wczesniejszymi. */

.mmenu{padding:62px 14px 96px}

.mkafle-grupa{margin:16px 2px 8px;font-family:var(--f-cond,inherit);
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--zloto,#C9A227)}
.mkafle-grupa:first-child{margin-top:0}

.mkafle{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}

/* Wygrywamy z .mmenu a z mobile.css — tamto rysowalo zwykla liste. */
.mmenu .mkafle>a{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;
  min-height:82px;padding:11px 4px 9px;
  border:1px solid rgba(227,199,101,.22);border-bottom:1px solid rgba(227,199,101,.22);
  border-radius:13px;background:rgba(255,255,255,.03);
  color:#E7E9EB;text-decoration:none;text-align:center;
  font-size:11.5px;font-weight:600;line-height:1.2;
  overflow-wrap:anywhere;hyphens:auto}
.mmenu .mkafle>a:hover{border-color:rgba(227,199,101,.5);background:rgba(227,199,101,.07)}
.mmenu .mkafle>a:active{transform:scale(.97)}

.mmenu .mkafle .pnav-ico{display:block;width:24px;height:24px;flex:0 0 auto;opacity:.85}

/* Strona, na ktorej wlasnie jestes — zloto, tak jak wszedzie na portalu. */
.mmenu .mkafle>a.on{
  border-color:var(--zloto,#E3C765);color:var(--zloto,#E3C765);
  background:rgba(227,199,101,.12);font-weight:700}
.mmenu .mkafle>a.on .pnav-ico{opacity:1}

.mkafle-wyjscie{margin:20px 2px 0}
.mkafle-wyjscie button{width:100%;min-height:48px;cursor:pointer;font:inherit;font-size:14px;
  border-radius:24px;background:transparent;
  border:1px solid rgba(255,255,255,.22);color:#B9BCC0}
.mkafle-wyjscie button:hover{border-color:#E4674F;color:#E4674F}

/* Bardzo waskie telefony: podpis ma sie zmiescic w wiersz. */
@media (max-width:359px){
  .mkafle{grid-template-columns:repeat(2,1fr)}
}

/* Szeroki ekran: menu jest szersze, wiec miesci wiecej kafelkow w rzedzie. */
@media (min-width:761px){
  .mmenu{width:min(92vw,430px)}
  .mkafle{grid-template-columns:repeat(4,1fr)}
}
