/*
Theme Name: HyperX Child
Template: hyperx
Theme URI: http://themeforester.net/
Description: The Portfolio Website Designer.
Author: Royal-Flush
Author URI: http://themeforest.net/user/Royal-Flush
Version: 1.9
Tags: light, dark, left-sidebar, custom-menu, post-formats, theme-options, translation-ready
License: See in Zip Package
License URI: See in Zip Package
*/


/* Theme customization starts here
-------------------------------------------------------------- */

:root {
  --surface: #0c0d10;
  --surface-alt: #151822;
  --accent: #ff6f61;
  --accent-2: #6ee7ff;
  --text: #f5f7fb;
  --muted: #aeb7cc;
  --glow: 0 20px 60px rgba(255, 111, 97, 0.25);
}

body {
  background: radial-gradient(circle at 20% 20%, rgba(110, 231, 255, 0.08), transparent 35%),
              radial-gradient(circle at 80% 0%, rgba(255, 111, 97, 0.08), transparent 35%),
              var(--surface);
  color: var(--text);
}

a,
a:visited {
  color: var(--accent);
}

a:hover,
a:focus-visible {
  color: var(--accent-2);
}

button,
.btn,
.rf-button,
input[type="submit"] {
  background: #f4f4f4;
  color: #111;
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 12px 18px;
  border-radius: 8px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
  transition: transform 120ms ease, box-shadow 120ms ease, background-color 120ms ease, color 120ms ease;
}

button:hover,
.btn:hover,
.rf-button:hover,
input[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
  background: #e7e7e7;
}

button:active,
.btn:active,
.rf-button:active,
input[type="submit"]:active {
  transform: translateY(0);
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
}

.portfolio-post,
.royal_portfolio,
.post {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
  transition: transform 200ms ease, box-shadow 200ms ease;
}

.portfolio-post:hover,
.royal_portfolio:hover,
.post:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45), var(--glow);
}

.post-media img,
.portfolio-post img,
.royal_portfolio img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

.royal-navigation .menu > li > a {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
}

.page-title,
.post-title,
.entry-title {
  letter-spacing: -0.02em;
}

/* Reveal animations */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 450ms ease, transform 450ms ease;
}

.reveal-visible {
  opacity: 1;
  transform: translateY(0);
}

.hero-ambient {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(1200px circle at 15% 20%, rgba(255, 111, 97, 0.08), transparent 45%),
              radial-gradient(900px circle at 85% 10%, rgba(110, 231, 255, 0.08), transparent 45%),
              radial-gradient(800px circle at 50% 80%, rgba(255, 255, 255, 0.04), transparent 50%);
  z-index: 0;
  mix-blend-mode: screen;
}

#page-wrap,
#main-wrap,
body > .royal-main-wrapper {
  position: relative;
  z-index: 1;
}

.single-content-wrap.inner-content {
  padding-left: 5vw;
  padding-right: 5vw;
}

.project-details-wrap.no-project-desc {
  padding-left: 5vw;
  padding-right: 5vw;
}

.inner-content-wrap {
  position: relative;
  top: 5px;
}

.single-title {
  padding-left: 5vw;
}

.nxt-prev-post .next-post img,
.nxt-prev-post .previous-post img {
  display: none;
}

.nxt-prev-post .next-post,
.nxt-prev-post .previous-post {
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.nxt-prev-post .next-post:hover,
.nxt-prev-post .previous-post:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}

/* Kapcsoljuk ki a side-nxt-prev hover képanimációját */
.side-nxt-prev-p .portfolio-single > .previous-post:hover img,
.side-nxt-prev-p .portfolio-single > .next-post:hover img {
  transform: none !important;
  opacity: 1 !important;
}

/* Oldalsó lapozó: rejtsük el teljesen a hover képeket */
.side-nxt-prev-p .portfolio-single > .previous-post img,
.side-nxt-prev-p .portfolio-single > .next-post img {
  display: none !important;
  visibility: hidden !important;
}

/* Vissza a tetejére gomb 60%-osra zsugorítva az ikonhoz igazítva */
.back-to-top {
  transform: scale(0.6);
  transform-origin: center;
}
.back-to-top .fa {
  font-size: 100%; /* hagyjuk az eredeti ikont, csak a konténert skálázzuk */
}


/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-visible,
  .portfolio-post,
  .royal_portfolio,
  .post,
  button,
  .btn,
  .rf-button {
    transition: none !important;
    transform: none !important;
  }
}