@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

* {
	box-sizing: border-box;
}

img {
  /* Prevents selection */
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none;    /* Firefox */
  -ms-user-select: none;     /* IE/Edge */
  user-select: none;         /* Standard */

  /* Prevents the "ghost" image in WebKit browsers */
  -webkit-user-drag: none; 
}

html {
    scroll-behavior: smooth;
}

html, body {
    overflow-x: hidden;
}

body {
	font-family: "Playfair Display", serif;
	font-optical-sizing: auto;
	font-weight: normal;
	font-style: normal;
	background-color: #000;
	color: #fff;
    margin: 0;
}

.h {
	display: none !important;
}

#cursor-circle {
  /* 1. Sizing and Shape */
  width: 1.5vw;
  aspect-ratio: 1;
  border-radius: 50%; /* Makes it a circle */

  z-index: 100;

  /* 2. The Inversion Effect */
  background-color: white;
  mix-blend-mode: difference; /* This is the magic! */

  /* 3. Positioning */
  position: fixed;
  top: 0; /* Will be updated by JS */
  left: 0; /* Will be updated by JS */
  
  /* 4. Center on cursor and prevent blocking */
  transform: translate(-50%, -50%);
  pointer-events: none; /* Lets you click "through" the circle */

  /* 5. Hide it until the mouse moves (optional) */
  opacity: 0;
  transition: opacity 0.3s ease;
  transition: transform 500ms ease;
}

/* Optional: Show the circle only when the mouse is moving */
body.mouse-moving #cursor-circle {
  opacity: 1;
}

#cursor-circle.cursor-grow {
  transform: scale(35);
}


@media (hover: none) {
    #cursor-circle {
        display: none;
    }
}

.btn {
	font-size: 2.5vmax;
  background: #000;
  color: #fff;
  border-radius: 100px;
  padding: 1vmax 2vmax;
  height: min-content;
  transition: all 200ms ease-out;
  letter-spacing: 1px;
}

.btn:hover {
	scale: 1;
}

a {
    text-decoration: none;
}

::selection {
  background-color: #000000; /* This is the highlight's background */
  color: #ffffff;            /* This is the color of the text itself */
}