/*
Theme Name: GP Studio
Theme URI: https://jamesnash.net/
Author: James Nash
Author URI: https://jamesnash.net/
Description: Exclusive theme for GP Studio
Requires at least: 5.9
Tested up to: 6.0
Requires PHP: 5.6
Version: 1.0
Text Domain: gps
This theme uses tailwind css. please use following code to watch css when editing html files
npx tailwindcss -i ./assets/css/tailwind.css -o ./theme.css --watch --minify
*/
a{
  position: relative;

}

.cursor-none{cursor: pointer!important}

a:hover{

}
#hero-logo-overlay {
  display: flex;
  justify-content: center;
  align-items: center;
}
#hero-logo-overlay #site-logo{
  font-size: 18vw;
  color: #fff;
}
body.home .menu-open #site-logo:not(.anim-complete) {
  opacity: 0;
}
body:hover{

}
body.home #masthead:not(.sticky-active) .header-wrapper,
body.single-project #masthead:not(.sticky-active) .header-wrapper{
  color: rgb(255, 255, 255);
  fill: rgb(255, 255, 255);
  border-color: rgb(255, 255, 255);
}
#masthead .header-wrapper {
  transition: height 0.5s;
}
#masthead.sticky-active .header-wrapper {
  height: 60px;
}
#masthead #header-bg {
  content: "";
  background-color: #fff;
  width: 100%;
  height: 0;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  transition: height 0.5s;
}
#masthead.sticky-active #header-bg{
	height: 60px;
}
.word, .line {
  position: relative;
}
.word .line-mask {
  position: absolute;
  top: 0;
  right: 0;
  background-color: #fff;
  opacity: 0.8;
  height: 104%;
  width: 100%;
  z-index: 2;
}
/*.slide-up-text .line-mask {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  height: 100%;
  background-color: #fff;
}*/

.project-item,
.project-item img{
  transition: 1s;
}
.project-item:hover img{
  transform: scale(1.1);
  transform-origin: center;
}
#sorting-options a:hover{
  text-decoration: underline;
}
#sorting-options a.active{
  color: #000;
  font-family: argent-cf,sans-serif;
  line-height: 1.25;
}
body #cursor {
  position: fixed;
  z-index: 9999;
  width: 40px;
  height: 40px;
  border-radius: 100%;
  top: 0%;
  left: 0%;
  opacity: 0;
  pointer-events: none;
  transform-box: fill-box;
  transform-origin: center;
}
body:hover #cursor{
  opacity: 1;
}
body #cursor.white{
  fill: #fff;
}
body #cursor.see-more #left-arrow{
  opacity: 1 !important;
}
body #cursor.drag-cursor g{
  opacity: 1 !important;
}
body #cursor.mask-cursor{
  fill: #fff;
  mix-blend-mode: difference;
}
#masthead svg path{
  transform-origin: center;
  transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.menu-open #line-1 {
  transform: translate(-10%, -20%) scaleY(1) rotate(-45deg);
}
.menu-open #line-2 {
  transform: translate(-12%, 22%) scaleY(1) rotate(45deg);
}

#site-footer a{
  position: relative;
}
#site-footer a::before {
  content: '';
  height: 1px;
  width: 100%;
  background: currentColor;
  position: absolute;
  top: 90%;
  transition: transform 0.3s;
  transform-origin: 0% 50%;
}
#site-footer a:hover::before {
  transform: scaleX(0);
  transform-origin: 100% 50%;
}