/* ============================================================
   TOLEVIA — Grundlagen
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html{
  -webkit-text-size-adjust:100%;
  scroll-padding-top:6rem;
}
@media (prefers-reduced-motion: no-preference){
  html{scroll-behavior:smooth}
}

body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1.0625rem;
  font-weight:430;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

::selection{background:var(--ink);color:var(--bg)}
img,svg{display:block;max-width:100%}
a{color:inherit}
ul,ol{list-style:none}

a:focus-visible,button:focus-visible{
  outline:2px solid var(--ink);
  outline-offset:4px;
  border-radius:3px;
}

/* Nur für Screenreader */
.sr-only{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}

/* Sprungmarke */
.skip{
  position:absolute;
  left:-9999px;
  top:1rem;
  z-index:30;
  background:var(--ink);
  color:var(--bg);
  font-size:.8125rem;
  padding:.75em 1.25em;
  border-radius:999px;
  text-decoration:none;
}
.skip:focus{left:1rem}

/* Kleinteile */
.eyebrow{
  font-size:.6875rem;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--mut);
}

.lnk{
  text-decoration:none;
  background-image:linear-gradient(currentColor,currentColor);
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:100% 1px;
  padding-bottom:2px;
  transition:background-size .25s var(--ease-out);
}
.lnk:hover{background-size:0% 1px}

/* Navigation reagiert im Gewicht — dieselbe Sprache wie die Wortmarke */
.site-nav a,.foot-nav a{
  font-variation-settings:'wght' 560;
  transition:background-size .25s var(--ease-out), font-variation-settings .35s var(--ease-out);
}
@media (hover:hover) and (pointer:fine){
  .site-nav a:hover,.foot-nav a:hover{font-variation-settings:'wght' 700}
}