body {
  margin: 0;
  padding: 0;
  background-color: #11111B;
  color: #E0E0E0;
  font-family: 'Inter', sans-serif;
}


.page-wrapper {
  position: relative;
}
.background-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}

/* Globale Einstellungen für SVG-Icons */
:root {
  --svg-icon-size: 72px; /* Einheitliche Icon-Größe für SVG-Icons */
  --svg-icon-spacing: 12px; /* Abstand nach rechts */
}

/* Zielgerichtete Regeln: Icons in Skill-Boxen, Social-Icons und allgemeine SVG-Images mit Klasse .icon */
.skill-box .icons img,
.social-links img.icon,
.svg-button img.icon,
img.icon {
  width: var(--svg-icon-size);
  height: auto;
  max-width: none;
  display: inline-block;
  vertical-align: middle;
  margin-right: var(--svg-icon-spacing);
}

/* Falls SVGs als inline <svg> verwendet werden */
.skill-box .icons svg,
.social-links svg.icon,
svg.icon {
  width: var(--svg-icon-size);
  height: auto;
  vertical-align: middle;
  margin-right: var(--svg-icon-spacing);
}

/* Social circular buttons should not get the global right-margin and need a smaller icon size
   Override to ensure icons are centered inside their circular background */
.social-links li a .icon,
.svg-button img.icon {
  width: 40px; /* match contact.css default */
  height: 40px;
  margin-right: 0;
  display: block;
  object-fit: contain;
}