@font-face {
    font-family: 'bornabold';
    src: 
    url('../fonts/borna-bold-webfont.woff') format('woff'),
    url('../fonts/borna-bold-webfont.woff2') format('woff2');
	font-display: swap;
    }


html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;}

body {
	line-height: 1em;
	padding: 1em;
	background: #fff;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

	blockquote:before, blockquote:after, q:before, q:after {
		content: '';
		content: none;
	}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

body {
	-webkit-text-size-adjust: none;
}

mark {
	background-color: transparent;
	color: inherit;
}





:root {
  --clip-x: calc(100vw - 1rem - 0.6rem);
  --clip-y: 1.6rem;
}





::view-transition-old(root) {
  animation-delay: 500ms;
}

::view-transition-new(root) {
  animation: circle-in 500ms;
}

@keyframes move-in {
  from { translate: 0 -100%; }
  to { translate: 0  0; }
}

@keyframes circle-in {
  from { clip-path: circle(0% at var(--clip-x) var(--clip-y)); }
  to { clip-path: circle(120% at 50% 0%); }
}







* {
	font-family: 'bornabold', sans-serif;
	font-weight: normal;
	font-size: 1rem;
	line-height: 1.2em;
	color: #000;
}

h1 {
	font-size: 1.5rem;
	padding-block: 0.5em;
}



#logo {
	width: 40px;
}

footer {
	margin-block-start: 2rem;
}

body.home header p {
	color: #fff;
	mix-blend-mode: exclusion;
	font-weight: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;	
}

header,
header * {
	pointer-events: none;
	user-select: none;
	-webkit-user-select: none;
}

@media (hover: none) { 
	main {
		user-select: none;
		-webkit-user-select: none;
	}
}
	
footer p,
footer a {
	mix-blend-mode: normal;
}

footer span {
	display: block;
	margin-top: 3rem;
}

footer span a {
	font-family: sans-serif;
	font-size: 0.6rem;
}

body.txt p {
	font-family: sans-serif;
	margin-bottom: 1em;
	hyphens: auto;
}

body.txt p a {
	mix-blend-mode: normal;
}

 .slideshow {
  position: relative;
  width: 100%;
  height: 70vh;
  overflow: hidden;
  margin-block-start: -2rem;
  z-index: -10;	 
	 
}

.slideshow .slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  animation-play-state: running;
}

main {
	cursor: none;
}

/*
main:hover {
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32'><circle cx='16' cy='16' r='15' fill='black'/><rect x='13' y='11' width='2' height='10' fill='white'/><rect x='17' y='11' width='2' height='10' fill='white'/></svg>") 16 16, auto;
}

main.paused:hover {
  cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32'><circle cx='16' cy='16' r='15' fill='black'/><polygon points='13,11 13,21 21,16' fill='white'/></svg>") 16 16, auto;
}
*/   


#themebutton {
	font-size: 0;
	width: 1.2rem;
	height: 1.2rem;
	background: #000;
	border: none;
	border-radius: 2rem;
	position: absolute;
	right: 1rem;
	top: 1rem;
	cursor: pointer;
}


.dark {
  body {
	background-color: #000;
	color: #f0f0f0;
  }

  h1, p, a {
	color: #f0f0f0;
  }

  svg#logo .cls-1 {
	fill: #fff;
  }	

	#themebutton {
		background: #f0f0f0;
	}
}


/* Custom Cursor */
#custom-cursor {
  position: fixed;
  width: 32px;
  height: 32px;
  pointer-events: none;
  z-index: 10000;
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.3s ease, opacity 0.3s ease;
  opacity: 0;
}

/* Inhalt über CSS-Hintergrund – Standard: Pause */
#custom-cursor::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32'><circle cx='16' cy='16' r='15' fill='black'/><rect x='13' y='11' width='2' height='10' fill='white'/><rect x='17' y='11' width='2' height='10' fill='white'/></svg>");
}

/* Beim Hover aktivieren */
main:hover + #custom-cursor {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

/* Klasse für "Play"-Symbol */
#custom-cursor.playing::before {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32'><circle cx='16' cy='16' r='15' fill='black'/><polygon points='13,11 13,21 21,16' fill='white'/></svg>");
}

/* Deaktiviert auf Touch-Geräten */
@media (hover: none) {
  main {
    cursor: default;
  }
  #custom-cursor {
    display: none;
  }
}