/* e11 — spoločný základ: premenné, písmo, hlavička, kóta (navigácia a výzvy), skip-link. Pre index, CV aj Brain Lab. */
:root{--paper:#F1F1F1; --paper-2:#F9F9F9; --ink:#111111; --ink-2:#6B6B6B; --marker:#FF502F; --marker-ink:#E04526; --line:#C9C9C9; --display:"Outfit",system-ui,sans-serif; --text:"Figtree",system-ui,sans-serif; --mono:"Figtree",system-ui,sans-serif; --hand:"Architects Daughter","Figtree",sans-serif; --pad:clamp(20px,4.5vw,72px); --ly:34; --blk-h:20; --ease:cubic-bezier(.55,0,.25,1);}
*{box-sizing:border-box}
html,body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--text);-webkit-text-size-adjust:100%;overflow-x:clip}
h1,h2,p,ul{margin:0}
ul{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
img{display:block}
a:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.site-head{position:absolute;z-index:20;left:0;right:0;top:0;display:flex;align-items:center;justify-content:space-between;padding:18px var(--pad) 0}
.logo{font:600 22px/1 var(--display);letter-spacing:-.01em;padding:8px 0}
.logo i{font-style:normal;color:var(--marker)}
.nav{display:flex;gap:14px}
.dim{position:relative;display:inline-flex;align-items:center;height:26px;padding:0 10px;isolation:isolate;outline:none;white-space:nowrap}
.dim::before,.dim::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:var(--ink);transition:width .15s}
.dim::before{left:0}
.dim::after{right:0}
.dim .bar{position:absolute;left:0;right:0;top:50%;height:1px;background:var(--ink)}
.dim .tx{position:relative;z-index:1;font:400 11px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;background:var(--paper);padding:0 7px}
.dim .mk{position:absolute;left:-5px;right:-12px;top:22%;height:56%;background:var(--marker);opacity:.92;mix-blend-mode:multiply;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.dim:hover .mk,.dim:focus-visible .mk{transform:scaleX(1)}
.dim:focus-visible{outline:none}
.dim:focus-visible::before,.dim:focus-visible::after{width:3px}
.dim:active .mk{transform:scaleX(1);top:6%;height:88%}
.dim:active .tx{color:var(--paper);background:transparent}
.now{position:relative;z-index:4;padding:clamp(72px,10vw,140px) var(--pad);background:var(--paper);border-top:1px solid var(--ink)}
.num{writing-mode:vertical-rl;transform:rotate(180deg);font:700 clamp(72px,9vw,128px)/.9 var(--display);letter-spacing:-.04em;position:relative;display:inline-block}
.num::after{content:"";position:absolute;top:-6%;bottom:-16%;left:44%;width:40%;background:var(--marker);opacity:.92;mix-blend-mode:multiply;z-index:-1}
.label{font:400 11px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2);margin-bottom:14px}
.now h2{font:600 clamp(32px,4.4vw,56px)/1.02 var(--display);letter-spacing:-.025em}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:40px;max-width:980px}
.three p{font-size:15px;color:var(--ink-2);margin-top:12px;max-width:30ch}
.hl{font:400 15px/1.2 var(--hand);text-transform:uppercase;letter-spacing:.06em;display:inline-block;position:relative;padding-bottom:4px}
.hl::after{content:"";position:absolute;left:0;right:-8px;bottom:0;height:1px;background:var(--ink)}
.hl::before{content:"";position:absolute;right:-16px;bottom:-2px;width:4px;height:4px;border-radius:50%;background:var(--ink)}
@media(max-width:860px){
  .three{grid-template-columns:1fr;gap:22px}
  .num{font-size:64px}
}
@media(max-width:380px){
  .nav{gap:8px}
  .dim{padding:0 6px}
  .dim .tx{padding:0 4px;letter-spacing:.12em}
}
.skip-link{position:absolute;left:-9999px;top:8px;background:var(--ink);color:var(--paper);padding:8px 12px;z-index:50}
.skip-link:focus{left:8px}
html{overscroll-behavior:none}
body{overscroll-behavior:none}
.logo{position:relative}
.logo::after{content:"";position:absolute;inset:-6px -8px}
.dim .hit{position:absolute;left:-3px;right:-3px;top:50%;height:44px;transform:translateY(-50%)}
.logo-dom{font-weight:500;letter-spacing:0}
@media(max-width:500px){.logo{font-size:18px}}

/* prepínač jazyka v menu: aktuálny jazyk podčiarknutý (ako aktuálna stránka), klik prepne na druhý */
.dim.lang .tx b{font-weight:inherit;text-decoration:underline;text-underline-offset:5px}
