/*
Theme Name: Nightride
Theme URI: https://akanthit.com
Author: AKANTHIT
Author URI: https://akanthit.com
Description: Jednostránková landing page – fotografie vozu ve tmě se svítícími a problikávajícími světlomety. Vše nastavitelné přes Přizpůsobit (Customizer): vlastní fotka, pozice světel, rychlost a styl blikání.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: nightride
*/

* { margin: 0; padding: 0; box-sizing: border-box; }

html, body {
  height: 100%;
  background: #000;
  overflow: hidden;
}

/* Admin bar nesmí rozbít fullscreen */
body.admin-bar { height: calc(100% - 32px); }

/* ---- scéna: obraz drží poměr stran, glow vrstvy jsou vázané na % obrazu ---- */
.nr-scene {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  aspect-ratio: var(--nr-ratio, 1536 / 1024);
  width: max(100vw, calc(100vh * var(--nr-ratio-num, 1.5)));
}

.nr-scene img {
  width: 100%;
  height: 100%;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}

/* ---- světla ---- */
.nr-lamp {
  position: absolute;
  width: var(--nr-lamp-size, 10%);
  aspect-ratio: 1 / 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
  mix-blend-mode: screen;
  background: radial-gradient(circle,
    rgba(255,255,255,0.95) 0%,
    rgba(230,238,255,0.55) 30%,
    rgba(180,200,255,0.18) 55%,
    rgba(140,170,255,0.0) 72%);
  filter: blur(2px);
}

.nr-lamp::before {
  content: "";
  position: absolute;
  inset: -90%;
  border-radius: 50%;
  background: radial-gradient(circle,
    rgba(200,215,255,0.28) 0%,
    rgba(160,185,255,0.10) 45%,
    rgba(120,150,255,0.0) 70%);
  filter: blur(14px);
}

.nr-lamp:nth-child(3) { animation-delay: .12s; }
.nr-lamp:nth-child(4) { animation-delay: .05s; }
.nr-lamp:nth-child(5) { animation-delay: .18s; }

/* jemný odlesk světla na podlaze */
.nr-floor {
  position: absolute;
  left: 50%;
  top: 84%;
  transform: translateX(-50%);
  width: 78%;
  height: 26%;
  pointer-events: none;
  mix-blend-mode: screen;
  background: radial-gradient(ellipse at 50% 0%,
    rgba(170,190,230,0.16) 0%,
    rgba(140,160,210,0.06) 45%,
    rgba(0,0,0,0) 75%);
  filter: blur(10px);
}

/* ---- animace ---- */

/* start – zapalování jako výbojka */
@keyframes nr-ignite {
  0%   { opacity: 0; }
  6%   { opacity: .85; }
  9%   { opacity: .05; }
  14%  { opacity: .6; }
  17%  { opacity: 0; }
  24%  { opacity: .9; }
  27%  { opacity: .15; }
  34%  { opacity: 1; }
  38%  { opacity: .4; }
  46%  { opacity: 1; }
  100% { opacity: 1; }
}

/* smyčka – dýchání s občasným probliknutím */
@keyframes nr-flicker {
  0%    { opacity: 1; }
  41%   { opacity: .93; }
  42%   { opacity: .55; }
  43%   { opacity: 1; }
  58%   { opacity: .95; }
  71%   { opacity: 1; }
  72.5% { opacity: .45; }
  73%   { opacity: .9; }
  74%   { opacity: .6; }
  75%   { opacity: 1; }
  100%  { opacity: 1; }
}

.nr-lamp, .nr-floor {
  animation:
    nr-ignite 2.4s ease-out 1 both,
    nr-flicker var(--nr-loop, 6.5s) steps(1, end) 2.4s infinite;
}

/* režim bez blikání – světla jen svítí */
body.nr-static .nr-lamp,
body.nr-static .nr-floor {
  animation: none;
  opacity: 1;
}

/* režim bez startovacího zapalování */
body.nr-no-ignite .nr-lamp,
body.nr-no-ignite .nr-floor {
  animation: nr-flicker var(--nr-loop, 6.5s) steps(1, end) 0s infinite;
}

/* ---- mobil / portrét: fotka na šířku, vycentrovaná, okolí splyne s černou ---- */
@media (orientation: portrait) {
  .nr-scene {
    width: 100vw;
  }

  /* na úzkém displeji zvětšit záři, aby světla nezanikla */
  .nr-lamp {
    filter: blur(1px);
  }
}

/* pojistka pro velmi nízká landscape okna (mobil naležato s lištou prohlížeče) */
@media (orientation: landscape) and (max-height: 480px) {
  .nr-scene {
    width: max(100vw, calc(100vh * var(--nr-ratio-num, 1.5)));
  }
}

@media (prefers-reduced-motion: reduce) {
  .nr-lamp, .nr-floor {
    animation: none !important;
    opacity: 1;
  }
}