/* Hairlo — styl textových stránek (ochrana osobních údajů, 404). Samostatný malý soubor, aby se tyto stránky nenačítaly
   s celým site.css. Tokeny jsou stejné jako v site.css — změna palety = změna v obou souborech a v DESIGN.md. */
:root{
  --bila:#FFFFFF; --cerna:#000000; --bezova:#E8DDCE; --text-2:#2B2B2B; --sediva:#5F5F5F; --linka:#CFCFCC; --zluta:#FEE601; --zluta-hover:#EBD400;
  --pismo:"Albert Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --okraj:clamp(16px,4vw,56px);
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;font-family:var(--pismo);font-size:17px;line-height:1.65;color:var(--cerna);background:var(--bila);-webkit-font-smoothing:antialiased}
a{color:inherit}
img{display:block;max-width:100%;height:auto}
::selection{background:var(--zluta);color:var(--cerna)}
:focus-visible{outline:2px solid var(--cerna);outline-offset:4px}
main:focus{outline:none}

/* hlavička a patička */
.hlava{border-bottom:1px solid var(--linka)}
.hlava-in{max-width:1240px;margin:0 auto;padding:22px var(--okraj);display:flex;align-items:center;gap:24px}
.logo img{width:88px}
.hlava-odkazy{margin-left:auto;display:flex;gap:24px;font-size:15px}
.hlava-odkazy a{color:var(--sediva);text-decoration:none}
.hlava-odkazy a:hover{color:var(--cerna)}
.pata{border-top:1px solid var(--linka);color:var(--sediva);font-size:14px;padding:28px var(--okraj) 32px}
.pata div{max-width:1240px;margin:0 auto;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* obsah */
main{flex:1 0 auto;width:100%;max-width:760px;margin:0 auto;padding:clamp(56px,8vw,112px) var(--okraj) clamp(72px,9vw,128px)}
h1{font-weight:300;font-size:clamp(38px,5.4vw,64px);line-height:1.05;letter-spacing:-.035em;margin:0 0 28px}
h2{font-weight:600;font-size:20px;margin:44px 0 10px}
p,li{color:var(--text-2)}
ul{padding-left:20px}
.pozn{font-size:14px;color:var(--sediva);border-top:1px solid var(--linka);padding-top:20px;margin-top:48px}
.doplnit{display:inline-block;border:1px dashed var(--sediva);border-radius:4px;padding:0 8px;font-size:.82em;font-weight:500;color:var(--sediva)}

/* tlačítka na stránce 404 */
.akce{display:flex;gap:12px;flex-wrap:wrap;margin:36px 0 0}
.tlacitko{display:inline-flex;align-items:center;min-height:50px;padding:0 26px;border-radius:999px;background:var(--zluta);color:var(--cerna);font-size:16px;font-weight:600;text-decoration:none;transition:background-color .15s}
.tlacitko:hover{background:var(--zluta-hover)}
.tlacitko-svetle{background:var(--bezova)}
.tlacitko-svetle:hover{background:var(--linka)}

/* odkaz „Přeskočit na obsah“ */
.skip{position:absolute;left:12px;top:-72px;z-index:100;background:var(--cerna);color:var(--bila);padding:12px 22px;border-radius:999px;font-size:15px;font-weight:600;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}

@media (max-width:560px){.hlava-odkazy a:not(.jazyk){display:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}