/*
Theme Name: Royal Ghost
Theme URI: 
Author: JP
Author URI: 
Description: 
Requires at least: 7.0
Tested up to: 7.0
Requires PHP: 5.7
Version: 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: royal-ghost
Tags: 
*/

@font-face {
  font-family: 'Press2';
  src: url('assets/fonts/press-start-2p-v16-latin-regular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}




:root {
  --bg:        #0A0612;
  --bg2:       #12091F;
  --bg3:       #1A0F2A;
  --purple:        #A020F0;
  --purple-dim:    #3D1A5F;
  --purple-soft:   #6B3FA0;
  --purple-glow:   rgba(160, 32, 240, 0.25);
  --white:     #F5F0FF;
  --grey:      #B8A8D9;
  --discord:   #5865F2;
  --steam:     #171A21;
  --steam-lt:  #66C0F4;
  --email:     #6B21A8;
  --pixel:     2px;
  --border:    1px solid rgba(160, 32, 240, 0.25);
}

body {
    background: radial-gradient(circle at top, #1C1030 0, #0A0612 45%, #05020A 100%);
    color: var(--white);
  
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Press2', sans-serif;
  color: var(--purple-dim);
}

.home-hero {
    width: 100%;
    height: 100vh;
    position: relative;
}

.hero-img {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  transform: translate(70%, -20%);
  width:  min(300px, 50vmin);   /* skaleerub ekraaniga, pole enam fix 400px */
  height: min(300px, 50vmin);
  background-image: url('assets/images/pfp.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0.55;
  will-change: transform, filter;
  animation:
    heroFloat 16s ease-in-out infinite,
    heroGlow   6s ease-in-out infinite;
}

/* triiv + kerge hingamine — tsentreering on keyframe'i sisse küpsetatud */
@keyframes heroFloat {
  0%, 100% { transform: translate(70%, -20%) scale(1)    rotate(0deg); }
  25%      { transform: translate(67%, -25%) scale(1.06) rotate(10deg); }
  50%      { transform: translate(70%, -22%) scale(1.1)  rotate(15deg); }
  75%      { transform: translate(73%, -18%) scale(1.06) rotate(-1deg); }
}

/* pulseeriv kuma — hägu + heledus hingavad */
@keyframes heroGlow {
  0%, 100% { filter: blur(0px) brightness(1); }
  50%      { filter: blur(1px) brightness(1.35); }
}

/* ligipääsetavus: kellel liikumine häirib, saab staatilise pildi */
@media (prefers-reduced-motion: reduce) {
  .hero-img { animation: none; }
}

 .hero-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -70%);
    text-align: center;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
 }

 .hero-buttons {
    display: flex;
    gap: 1rem;
    justify-content: center;
    align-items: center;
 }

 .hero-eyebrow {
  font-family: 'Press2', monospace;
  font-size: 0.9rem;
  color: var(--grey);
  letter-spacing: 2px;
  text-transform: uppercase;
  opacity: 0.85;
  text-shadow: 0 0 6px var(--purple-glow);
  margin-bottom: -0.5rem;
  animation: eyebrowFade 3s ease-in-out infinite alternate;
 }


 .hero-title-first {
  font-family: 'Press2', monospace;
  font-size: clamp(1.4rem, 3vw, 2rem);
  color: var(--white);
  text-transform: uppercase;
  letter-spacing: 3px;
  margin: 0;
  margin-top: 0.5rem;
  opacity: 0.95;
  text-shadow: 0 0 8px var(--purple-glow);
  transform: translateY(0);
  animation: heroTitleFirstFloat 4s ease-in-out infinite alternate;
 }


 .hero-title-second {
  font-family: 'Press2', monospace;
  font-size: clamp(2rem, 6vw, 4rem);
  color: var(--purple);
  text-transform: uppercase;
  letter-spacing: 4px;
  margin: 0;
  line-height: 1;
  text-shadow:
      0 0 6px var(--purple-glow),
      0 0 12px var(--purple-glow),
      0 0 20px var(--purple-soft);
  animation: heroTitleSecondPulse 4s ease-in-out infinite alternate;
 }


.hero-title-text {
  font-family: 'Press2', monospace;
  font-size: clamp(1rem, 2.5vw, 1.3rem) !important;
  line-height: 1.4;
  color: var(--grey);
  opacity: 0.9;
  letter-spacing: 1px;
  margin: 0.5rem 0 1.5rem 0;
  text-shadow: 0 0 4px var(--purple-glow);
  max-width: 420px;
  margin-left: auto;
  margin-right: auto;
  animation: heroTextFade 5s ease-in-out infinite alternate;
}


.button-normal {
  font-family: 'Press2', monospace;
  font-size: 1rem;
  padding: 0.75rem 1.4rem;
  color: var(--white);
  background: var(--purple-dim);
  border: var(--pixel) solid var(--purple);
  text-transform: uppercase;
  letter-spacing: 2px;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow:
    0 0 6px var(--purple-glow),
    inset 0 0 6px var(--purple-glow);
}



.button-inverted {
  font-family: 'Press2', monospace;
  font-size: 1rem;
  padding: 0.75rem 1.4rem;
  color: var(--purple);
  background: transparent;
  border: var(--pixel) solid var(--purple);
  text-transform: uppercase;
  letter-spacing: 2px;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow:
    0 0 6px var(--purple-glow),
    inset 0 0 4px rgba(160, 32, 240, 0.15);
}