/* ===== HexaForce – burger + celoobrazovkove menu =====
   Zdielane vsetkymi strankami. Tokeny maju fallback, lebo web ma tri CSS systemy
   (index/akademia/o-projekte inline, cine.css stranky, site.css). */

/* --- preskočenie na obsah (WCAG 2.4.1, prvý prvok v poradí tabulátora) --- */
.preskoc{position:fixed;top:-120px;left:12px;z-index:200;
  padding:12px 18px;border-radius:2px;text-decoration:none;
  background:var(--sumi-0,#0F0C08);border:1px solid var(--amber,#C0691C);
  color:var(--bone,#E9E2D2);
  font-family:var(--mono,ui-monospace,monospace);font-size:12px;
  letter-spacing:.16em;text-transform:uppercase}
.preskoc:focus{top:12px}
.preskoc:focus-visible{outline:2px solid var(--amber,#C0691C);outline-offset:3px}

/* --- späť hore --- */
.hore{position:fixed;right:clamp(16px,2.4vw,30px);bottom:clamp(16px,2.4vw,30px);z-index:60;
  width:46px;height:46px;display:flex;align-items:center;justify-content:center;
  appearance:none;cursor:pointer;border-radius:50%;
  background:rgba(15,12,8,.86);border:1px solid rgba(233,226,210,.22);
  color:var(--bone-dim,#A99E86);font-family:var(--mono,ui-monospace,monospace);font-size:17px;line-height:1;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .35s,transform .35s,color .3s,border-color .3s,visibility .35s}
.hore.on{opacity:1;visibility:visible;transform:none}
.hore:hover{color:var(--amber,#C0691C);border-color:var(--amber,#C0691C)}
.hore:focus-visible{outline:2px solid var(--amber,#C0691C);outline-offset:3px}
/* na mobile nesmie prekryt palcom ovladane prvky v pate */
@media(max-width:600px){.hore{width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){.hore{transition:opacity .01s,visibility .01s}}

/* --- burger --- */
.top__right{display:flex;align-items:center;gap:clamp(14px,2.2vw,30px)}
.mburg{appearance:none;background:none;border:0;padding:10px 2px;cursor:pointer;
  display:flex;flex-direction:column;justify-content:center;gap:6px;width:34px;min-height:44px}
.mburg span{display:block;height:1.5px;width:26px;background:var(--bone,#E9E2D2);border-radius:2px;
  transition:transform .45s cubic-bezier(.465,.183,.153,.946),opacity .3s,background .3s}
.mburg:hover span{background:var(--amber,#C0691C)}
.mburg[aria-expanded="true"] span:nth-child(1){transform:translateY(3.75px) rotate(45deg)}
.mburg[aria-expanded="true"] span:nth-child(2){transform:translateY(-3.75px) rotate(-45deg)}
.mburg:focus-visible{outline:2px solid var(--amber,#C0691C);outline-offset:4px}

/* --- overlay --- */
.mmenu{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(120% 90% at 50% 30%,#1a140d 0%,#0F0C08 62%);
  opacity:0;pointer-events:none;transition:opacity .5s cubic-bezier(.33,0,.2,1);
  overflow-y:auto;padding:clamp(74px,9.5vh,100px) clamp(24px,6vw,80px) clamp(30px,5vh,54px)}
.mmenu.on{opacity:1;pointer-events:auto}
/* zatvorene = display:none (nie visibility) – inak by bolo menu pol sekundy
   nefokusovatelne, lebo visibility sa v prechode preklopi az na konci */
.mmenu[hidden]{display:none}
.mmenu__in{width:100%;max-width:820px;margin:auto}

.mmenu__nav{display:grid;gap:clamp(4px,1vh,12px)}
.mmenu__nav a{display:flex;align-items:baseline;gap:clamp(14px,2.2vw,28px);
  font-family:var(--display,'Fraunces',Georgia,serif);font-weight:600;
  /* mierka podla sirky AJ vysky – na nizkych oknach sa menu zmesti bez scrollu */
  font-size:clamp(26px,min(4.3vw,5.4vh),52px);line-height:1.1;letter-spacing:-.03em;
  color:var(--bone,#E9E2D2);padding:clamp(3px,.55vh,7px) 0;
  opacity:0;transform:translateY(18px);
  transition:color .35s,opacity .6s cubic-bezier(.33,0,.2,1),transform .6s cubic-bezier(.33,0,.2,1)}
.mmenu.on .mmenu__nav a{opacity:1;transform:none}
.mmenu__nav a:hover{color:var(--amber,#C0691C)}
.mmenu__nav a:focus-visible{color:var(--amber,#C0691C);outline:1px solid rgba(192,105,28,.55);outline-offset:6px}
.mmenu__nav a[aria-current]{color:var(--amber,#C0691C)}
.mmenu__nav a i{font-family:var(--mono,'JetBrains Mono',monospace);font-style:normal;
  font-size:13px;letter-spacing:.2em;color:var(--gold,#D9922F);flex:none;min-width:2.4em}

/* --- pata menu: socialne siete + pravne --- */
.mmenu__foot{margin-top:clamp(22px,3.8vh,44px);padding-top:clamp(18px,2.8vh,28px);
  border-top:1px solid rgba(233,226,210,.12);
  opacity:0;transform:translateY(14px);
  transition:opacity .6s cubic-bezier(.33,0,.2,1) .25s,transform .6s cubic-bezier(.33,0,.2,1) .25s}
.mmenu.on .mmenu__foot{opacity:1;transform:none}
.mmenu__lbl{display:block;font-family:var(--mono,monospace);font-size:13px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--amber,#C0691C);margin-bottom:16px}
.mmenu__soc{display:flex;flex-wrap:wrap;gap:10px 12px}
.mmenu__soc a,.mmenu__soc span{font-family:var(--mono,monospace);font-size:13px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--bone-dim,#A99E86);
  border:1px solid rgba(233,226,210,.16);border-radius:2px;padding:10px 15px;
  transition:color .3s,border-color .3s}
.mmenu__soc a:hover,.mmenu__soc a:focus-visible{color:var(--amber,#C0691C);border-color:var(--amber,#C0691C)}
.mmenu__soc span{opacity:.5;cursor:default}
.mmenu__legal{display:inline-block;margin-top:clamp(20px,3vh,30px);
  font-family:var(--mono,monospace);font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--taupe,#8A7E64);border-bottom:1px solid rgba(233,226,210,.14);padding-bottom:3px}
.mmenu__legal:hover{color:var(--amber,#C0691C)}

/* zamknutie scrollu na pozadi */
body.mlock{overflow:hidden}
/* pri otvorenom menu musi byt burger NAD overlayom, inak sa neda zavriet mysou.
   Logo ostava (odkaz domov), ostatne odkazy sa skryju, nech to nie je prepchate. */
body.mlock .top{z-index:75}
body.mlock .top__nav{opacity:0;pointer-events:none}
body.mlock .top.solid{background:none;-webkit-backdrop-filter:none;backdrop-filter:none}


@media(max-width:560px){
  .mmenu__nav a{font-size:clamp(21px,min(7.4vw,4.1vh),38px)}
  .mmenu__nav a i{min-width:2em;font-size:12px}
  .mmenu{padding-top:clamp(64px,8vh,84px)}
}
@media(prefers-reduced-motion:reduce){
  .mmenu,.mmenu__nav a,.mmenu__foot,.mburg span{transition:none}
  .mmenu__nav a,.mmenu__foot{opacity:1;transform:none}
}

/* --- prepinac jazykov (markup generuje tools/i18n_build.py) ---
   Staticke odkazy, nie JavaScript: funguje bez skriptov a vidia ho vyhladavace.
   Ukazuje len hotove jazyky – nikdy mrtvy odkaz. Dotykova plocha 44 px na vysku. */
.jazyk{display:flex;align-items:center;font-family:var(--mono,'JetBrains Mono',monospace);
  font-size:11.5px;line-height:1;letter-spacing:.14em}
.jazyk a{display:inline-flex;align-items:center;min-height:44px;padding:0 7px;
  color:var(--bone-dim,#A99E86);text-decoration:none;transition:color .3s}
.jazyk a+a{position:relative}
.jazyk a+a::before{content:"";position:absolute;left:0;top:50%;height:11px;margin-top:-5.5px;
  border-left:1px solid rgba(233,226,210,.22)}
.jazyk a:hover{color:var(--amber,#C0691C)}
.jazyk a[aria-current]{color:var(--gold,#D9922F)}
.jazyk a:focus-visible{outline:2px solid var(--amber,#C0691C);outline-offset:-2px}
.jazyk--roh{position:fixed;top:clamp(8px,1.6vw,18px);right:clamp(10px,2.2vw,26px);z-index:60}
body.mlock .jazyk{opacity:0;pointer-events:none}
@media(max-width:380px){.jazyk{font-size:10.5px;letter-spacing:.08em}.jazyk a{padding:0 5px}}

/* --- jazykova poznamka v paticke mutacii (doplnok vklada tools/i18n_build.py) --- */
.foot__jazyk{max-width:62ch;margin:0 auto 20px;text-align:center;font-size:12.5px;line-height:1.6;
  color:var(--bone-dim,#A99E86)}
.foot__jazyk--quiz{margin:0 auto 28px;padding:0 20px;opacity:.8}

/* --- veta o zavaznom jazyku na pravnych strankach mutacie (doplnok vklada
   tools/i18n_build.py hned pod <h1>). Tichy, ale citatelny register – rovnaka
   linka vlavo ako .doc__adresa, aby to na stranke nepusobilo ako cudzi prvok. */
.doc__jazyk{max-width:62ch;margin:14px 0 0;padding-left:16px;
  border-left:2px solid var(--umber,#6B4A2A);font-size:14px;line-height:1.7;
  color:var(--bone-dim,#A99E86)}

/* --- nadpis hero v mutaciach na uzkych displejoch ---
   .chero je flex, takze .wrap (min-width:auto) sa roztiahne na sirku najdlhsieho
   slova v nadpise. V slovencine sa najdlhsie slovo zmesti, v anglictine nie
   ("conversations." ma pri 46px 295px, do obsahu ostava 272px) – cela stranka sa
   potom dala posuvat do strany. Pod 360px preto nadpis v mutaciach zmensim.
   Slovencinu to nechyta, jej rozlozenie ostava nedotknute.
   28. 9. 2026: 40px uz nestacilo na spanielcinu – "Conversaciones" ma pri 40px
   281px. Namerane 38px = 267px, teda do 272px sa zmesti aj ono.
   Ked pribudne nemcina, pretecenie odhali tools/test_i18n_render.py. */
@media(max-width:360px){
  html:not([lang="sk"]) .chero__title{font-size:38px}
}

/* --- siete + casté otázky (Marekove body 8 a 9) ---
   Markup je STATICKY – generuje ho tools/i18n_build.py (bloky siete / siete-pata),
   takze funguje aj bez JavaScriptu. Dve kopie, vidno vzdy len jednu:
   pas na lavom kraji (siroke a dost vysoke okno) alebo riadok v paticke (inde).
   Pas: vpravo je burger, jazyky a "spat hore", hore #prog. z-index 60 ako .hore –
   nad vinetou (.vig 59), pod menu (70), kurzorom (70) a preloaderom (100). */
.siete{display:none}
.siete__a{position:relative;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;color:var(--bone-dim,#A99E86);text-decoration:none;transition:color .3s}
.siete__a svg{display:block;width:20px;height:20px}
.siete__a:hover,.siete__a:focus-visible{color:var(--amber,#C0691C)}
.siete__a:focus-visible{outline:2px solid var(--amber,#C0691C);outline-offset:-4px;border-radius:2px}
.siete__a[aria-current]{color:var(--gold,#D9922F)}
.siete__del{display:block;background:rgba(233,226,210,.18)}
/* stitok je len zrakovy doplnok – nazov nesie aria-label (to iste slovo) */
.siete__t{position:absolute;white-space:nowrap;pointer-events:none;
  font-family:var(--mono,'JetBrains Mono',monospace);font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--amber,#C0691C);opacity:0;transition:opacity .3s,transform .3s}

@media (min-width:1280px) and (min-height:560px){
  .siete--pas{display:flex;flex-direction:column;align-items:center;
    position:fixed;left:clamp(12px,1.1vw,22px);top:50%;transform:translateY(-50%);z-index:60;
    animation:sieteIn .8s cubic-bezier(.33,0,.2,1) .3s both}
  .siete--pas::before,.siete--pas::after{content:"";width:1px;height:clamp(28px,6vh,56px);
    background:linear-gradient(180deg,transparent,rgba(233,226,210,.2))}
  .siete--pas::before{margin-bottom:10px}
  .siete--pas::after{margin-top:10px;background:linear-gradient(0deg,transparent,rgba(233,226,210,.2))}
  .siete--pas .siete__del{width:12px;height:1px;margin:8px 0}
  .siete--pas .siete__t{left:100%;top:50%;transform:translate(-6px,-50%);text-shadow:0 2px 10px rgba(10,8,5,.95)}
  .siete--pas .siete__a:hover .siete__t,
  .siete--pas .siete__a:focus-visible .siete__t{opacity:1;transform:translate(2px,-50%)}
  /* animation:none – inak nábehová animácia (fill both) drží opacity:1 a pás by ostal
     cez otvorené menu; visibility ho zároveň vyradí z tabulátora */
  body.mlock .siete--pas{animation:none;opacity:0;visibility:hidden;pointer-events:none}
  /* paticka uvodu (.fnav) nema .wrap a pri 1180–1300 px zacina prvym odkazom na x = 4–46 px */
  footer .fnav{padding-inline:72px}
}
/* velke monitory: tools/velke_monitory.py pravidla vnutri @media nezvacsuje – pas rucne,
   rovnake koeficienty (1,28 / 1,5 / 1,8), inak by na 2560+ ostal drobny voci zvacsenemu webu */
@media (min-width:2300px) and (min-height:560px){
  .siete--pas .siete__a{width:56px;height:56px}.siete--pas .siete__a svg{width:26px;height:26px}
  .siete--pas .siete__del{width:15px}}
@media (min-width:2800px) and (min-height:560px){
  .siete--pas .siete__a{width:66px;height:66px}.siete--pas .siete__a svg{width:30px;height:30px}
  .siete--pas .siete__del{width:18px}}
@media (min-width:3400px) and (min-height:560px){
  .siete--pas .siete__a{width:80px;height:80px}.siete--pas .siete__a svg{width:36px;height:36px}
  .siete--pas .siete__del{width:22px}}
@keyframes sieteIn{from{opacity:0}to{opacity:1}}
@media (max-width:1279.98px),(max-height:559.98px){
  .siete--pata{display:flex;justify-content:center;align-items:center;gap:6px;margin:0 auto 18px}
  .siete--pata .siete__del{width:1px;height:14px;margin:0 6px}
  .siete--pata .siete__t{display:none}
}
@media(prefers-reduced-motion:reduce){.siete--pas{animation:none}.siete__a,.siete__t{transition:none}}
@media print{.siete{display:none!important}}

/* --- novinky na uvode (vklada assets/js/novinky.js len ked je aktualna polozka) ---
   Pas hned pod uvodom. Register ako HUD uvodu: nadpis a datum mono, veta v Inter,
   dve vlasove ciary namiesto ramu – ziadny box, ziadny widget. */
/* sirka a okraje ako .acad__lead (1280 px, clamp 24–80 px) – lista sedi v tej istej
   mriezke ako nadpis Akademie pod nou */
.novinky{position:relative;z-index:2;max-width:1280px;margin:0 auto;
  padding:clamp(18px,3vh,30px) clamp(24px,6vw,80px) 0;
  animation:novinkyIn .9s cubic-bezier(.33,0,.2,1) both}
.novinky__in{padding:16px 0;
  display:grid;grid-template-columns:auto 1fr;gap:8px 26px;align-items:baseline;
  border-top:1px solid rgba(233,226,210,.12);border-bottom:1px solid rgba(233,226,210,.12)}
.novinky__k{font-family:var(--mono,'JetBrains Mono',monospace);font-size:11.5px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--amber,#C0691C)}
.novinky__zoz{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.novinky__zoz li{display:flex;align-items:baseline;gap:16px}
.novinky__zoz time{flex:none;min-width:5.2em;font-family:var(--mono,'JetBrains Mono',monospace);
  font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold,#D9922F)}
.novinky__t{font-size:15px;line-height:1.5;color:var(--bone,#E9E2D2);text-decoration:none;transition:color .3s}
/* dotykova plocha 44 px bez posunu riadku */
a.novinky__t{display:inline-block;padding:11px 0;margin:-11px 0}
a.novinky__t:hover{color:var(--amber,#C0691C)}
a.novinky__t span{color:var(--amber,#C0691C)}
a.novinky__t:focus-visible{outline:2px solid var(--amber,#C0691C);outline-offset:4px;border-radius:2px}
@keyframes novinkyIn{from{opacity:0}to{opacity:1}}

@media(max-width:600px){
  .novinky{padding:18px clamp(24px,6vw,80px) 0}   /* ta ista lava hrana ako .acad__lead */
  .novinky__in{grid-template-columns:1fr;gap:10px}
  .novinky__zoz li{flex-direction:column;gap:2px}
  .novinky__t{font-size:14.5px}
}
@media(prefers-reduced-motion:reduce){.novinky{animation:none}.novinky__t{transition:none}}
@media print{.novinky{display:none}}

/* VELKE-MONITORY:START – generuje tools/velke_monitory.py, needituj rucne */
@media (min-width:2300px){
.preskoc{font-size:15px}
.hore{width:59px;height:59px;font-size:22px}
.mmenu__in{max-width:1050px}
.mmenu__nav a{font-size:clamp(26px,min(4.3vw,5.4vh),67px)}
.mmenu__nav a i{font-size:17px}
.mmenu__lbl{font-size:17px}
.mmenu__soc a,.mmenu__soc span{font-size:17px}
.mmenu__legal{font-size:17px}
.jazyk{font-size:15px}
.foot__jazyk{font-size:16px}
.doc__jazyk{font-size:18px}
.siete__t{font-size:14px}
.novinky{max-width:1638px}
.novinky__k{font-size:15px}
.novinky__zoz time{font-size:15px}
.novinky__t{font-size:19px}
}
@media (min-width:2800px){
.preskoc{font-size:18px}
.hore{width:69px;height:69px;font-size:26px}
.mmenu__in{max-width:1230px}
.mmenu__nav a{font-size:clamp(26px,min(4.3vw,5.4vh),78px)}
.mmenu__nav a i{font-size:20px}
.mmenu__lbl{font-size:20px}
.mmenu__soc a,.mmenu__soc span{font-size:20px}
.mmenu__legal{font-size:20px}
.jazyk{font-size:17px}
.foot__jazyk{font-size:19px}
.doc__jazyk{font-size:21px}
.siete__t{font-size:16px}
.novinky{max-width:1920px}
.novinky__k{font-size:17px}
.novinky__zoz time{font-size:17px}
.novinky__t{font-size:22px}
}
@media (min-width:3400px){
.preskoc{font-size:22px}
.hore{width:83px;height:83px;font-size:31px}
.mmenu__in{max-width:1476px}
.mmenu__nav a{font-size:clamp(26px,min(4.3vw,5.4vh),94px)}
.mmenu__nav a i{font-size:23px}
.mmenu__lbl{font-size:23px}
.mmenu__soc a,.mmenu__soc span{font-size:23px}
.mmenu__legal{font-size:23px}
.jazyk{font-size:21px}
.foot__jazyk{font-size:22px}
.doc__jazyk{font-size:25px}
.siete__t{font-size:20px}
.novinky{max-width:2304px}
.novinky__k{font-size:21px}
.novinky__zoz time{font-size:21px}
.novinky__t{font-size:27px}
}
/* VELKE-MONITORY:END */
