/* ===== BASE ===== */
:root{
  --brand: #4f8cff;
  --text: #e5e7eb;
  --muted: rgba(229,231,235,.78);

  --bg: #0b1220;
  --bg-2: #0f1a2e;

  --surface: rgba(255,255,255,.06);
  --border: rgba(255,255,255,.10);

  --brand-soft: rgba(79,140,255,.14);
  --glow-2: rgba(79,140,255,.18);

  --shadow: rgba(0,0,0,.35);

  /* circuit */
  --circuit-opacity: .22;
  --circuit-filter: drop-shadow(0 0 22px var(--glow-2));
  --c-line-stroke: rgba(255,255,255,.10);
  --c-node-fill: rgba(255,255,255,.14);
  --c-node-stroke: rgba(255,255,255,.18);
  --c-pulse-stroke: url(#cGlowDark);
}

html{ scroll-behavior: smooth; }
section{ scroll-margin-top: 88px; }

body.site{
  color: var(--text);
  background:
    radial-gradient(900px 450px at 10% 15%, var(--brand-soft), transparent 60%),
    radial-gradient(700px 400px at 92% 10%, rgba(255,193,7,.10), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg-2));
}

.page{ position: relative; z-index: 1; }

.muted{ color: var(--muted); }
body.site .text-secondary{ color: var(--muted) !important; }

body.site h1, body.site h2, body.site h3,
body.site h4, body.site h5, body.site h6{
  color: var(--text) !important;
}

/* ===== Light scheme base (NAPPALI) ===== */
body.site[data-scheme="light"]{
  --text: #0b1220;
  --muted: rgba(11,18,32,.72);

  --bg: #f6f8ff;
  --bg-2: #eef2ff;

  --surface: rgba(255,255,255,.86);
  --border: rgba(11,18,32,.12);

  --brand-soft: rgba(79,140,255,.16);
  --glow-2: rgba(79,140,255,.18);

  --shadow: rgba(0,0,0,.14);

  /* circuit: LIGHT módban sötétebb, hogy LÁTSZÓDJON */
  --circuit-opacity: .26;
  --circuit-filter: drop-shadow(0 0 16px rgba(0,0,0,.10));
  --c-line-stroke: rgba(0,0,0,.18);
  --c-node-fill: rgba(0,0,0,.12);
  --c-node-stroke: rgba(0,0,0,.18);
  --c-pulse-stroke: url(#cGlowLight);

  color: var(--text);
  background:
    radial-gradient(900px 450px at 10% 15%, rgba(79,140,255,.18), transparent 60%),
    radial-gradient(700px 400px at 92% 10%, rgba(255,193,7,.16), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg-2));
}
body.site[data-scheme="light"] .text-secondary{ color: rgba(11,18,32,.72) !important; }
body.site[data-scheme="light"] h1, body.site[data-scheme="light"] h2, body.site[data-scheme="light"] h3,
body.site[data-scheme="light"] h4, body.site[data-scheme="light"] h5, body.site[data-scheme="light"] h6{
  color: var(--text) !important;
}

/* ===== Global circuit ===== */
.bg-circuit{
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: var(--circuit-opacity);
  z-index: 0;
  filter: var(--circuit-filter);
}

.bg-circuit .c-line{
  fill: none;
  stroke: var(--c-line-stroke);
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.bg-circuit .c-node{
  fill: var(--c-node-fill);
  stroke: var(--c-node-stroke);
  stroke-width: 1;
}

.bg-circuit .c-pulse{
  fill: none;
  stroke: var(--c-pulse-stroke);
  stroke-width: 3.0;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 14 18;
  animation: circuitPulse 2.6s linear infinite;
}

@keyframes circuitPulse{
  0%{ stroke-dashoffset: 0; opacity: .60; }
  50%{ opacity: 1; }
  100%{ stroke-dashoffset: -160; opacity: .60; }
}

@media (max-width: 575.98px){
  .bg-circuit{ opacity: calc(var(--circuit-opacity) - 0.06); }
}

/* ===== Navbar ===== */
.nav-surface{
  background: rgba(10,16,28,.75);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(10px);
}
body.site[data-scheme="light"] .nav-surface{
  background: rgba(255,255,255,.78);
}

.navbar .nav-link{
  color: rgba(229,231,235,.85);
  transition: color .15s ease, text-shadow .15s ease;
}
body.site[data-scheme="light"] .navbar .nav-link{
  color: rgba(11,18,32,.78);
  text-shadow: none;
}
.navbar .nav-link:hover{
  color: #fff;
  text-shadow: 0 0 18px var(--glow-2);
}
body.site[data-scheme="light"] .navbar .nav-link:hover{
  color: #000;
  text-shadow: 0 0 18px rgba(0,0,0,.08);
}
.navbar .nav-link.active{
  color: #fff !important;
  position: relative;
  text-shadow: 0 0 18px var(--glow-2);
}
body.site[data-scheme="light"] .navbar .nav-link.active{
  color: #000 !important;
  text-shadow: none;
}
.navbar .nav-link.active::after{
  content:"";
  position:absolute;
  left: .5rem;
  right: .5rem;
  bottom: .25rem;
  height: 2px;
  border-radius: 2px;
  background: rgba(255,255,255,.65);
}
body.site[data-scheme="light"] .navbar .nav-link.active::after{
  background: rgba(11,18,32,.50);
}

/* toggler icon */
.navbar-toggler{ border-color: var(--border); }
.navbar-toggler-icon{ filter: invert(1) opacity(.9); }
body.site[data-scheme="light"] .navbar-toggler-icon{ filter: invert(0) opacity(.8); }

.brand-mark{
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  border: 1px solid var(--border);
  box-shadow: 0 0 18px var(--glow-2);
  color: var(--text);
}
body.site[data-scheme="light"] .brand-mark{
  background: rgba(11,18,32,.06);
}
.brand-mark i{
  color: var(--text);
  filter: drop-shadow(0 0 10px var(--glow-2));
}

/* theme select */
.theme-select{
  min-width: 220px;
  border: 1px solid var(--border) !important;
  border-radius: 14px;
  background: rgba(255,255,255,.08) !important;
  color: var(--text) !important;
}
body.site[data-scheme="light"] .theme-select{
  background: rgba(255,255,255,.90) !important;
}
.theme-select option{ color: #0b1220; }

/* ===== Surfaces ===== */
.surface-panel{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 .25rem .75rem rgba(0,0,0,.10);
}

.pill-surface{
  background: rgba(255,255,255,.08);
  border: 1px solid var(--border);
  box-shadow: 0 .25rem .75rem rgba(0,0,0,.10);
}
body.site[data-scheme="light"] .pill-surface{
  background: rgba(255,255,255,.92);
}

.hero-section{ border-bottom: 1px solid var(--border); }

.hero-mini{
  display: grid;
  grid-template-columns: 1fr;
  gap: .6rem;
}
@media (min-width: 576px){ .hero-mini{ grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px){ .hero-mini{ grid-template-columns: 1fr; } }

.mini-item{
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .65rem .85rem;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--border);
  border-radius: 14px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body.site[data-scheme="light"] .mini-item{ background: rgba(255,255,255,.92); }
.mini-item:hover{
  transform: translateY(-2px);
  border-color: rgba(79,140,255,.30);
  box-shadow: 0 0 18px var(--glow-2);
}

.icon-badge{
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: rgba(79,140,255,.18);
  border: 1px solid rgba(79,140,255,.25);
  color: #dbe8ff;
  font-size: 22px;
  flex: 0 0 auto;
}
.icon-chip{
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(79,140,255,.18);
  border: 1px solid rgba(79,140,255,.25);
  color: #dbe8ff;
  flex: 0 0 auto;
}
body.site[data-scheme="light"] .icon-badge,
body.site[data-scheme="light"] .icon-chip{
  color: #0b1220;
}

/* Cards */
.surface-card{
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px;
  box-shadow: 0 .25rem .75rem rgba(0,0,0,.10);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.surface-card:hover{
  transform: translateY(-3px);
  border-color: rgba(79,140,255,.35) !important;
  box-shadow: 0 18px 60px var(--shadow), 0 0 22px var(--glow-2);
}

/* Buttons */
.btn{ border-radius: 14px; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.btn:hover{ transform: translateY(-1px); box-shadow: 0 10px 30px rgba(0,0,0,.18), 0 0 22px var(--glow-2); }

.btn-outline-primary{
  color: rgba(229,231,235,.92);
  border-color: rgba(79,140,255,.5);
}
body.site[data-scheme="light"] .btn-outline-primary{
  color: rgba(11,18,32,.90);
}
.btn-outline-primary:hover{
  background: rgba(79,140,255,.14);
  border-color: rgba(79,140,255,.85);
}

/* Accordion */
.accordion{
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px;
  overflow: hidden;
}
.accordion-item{ background: transparent; border: 0; }
.accordion-button{
  background: rgba(255,255,255,.06) !important;
  color: var(--text) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
body.site[data-scheme="light"] .accordion-button{
  background: rgba(255,255,255,.95) !important;
}
.accordion-button:not(.collapsed){
  background: rgba(79,140,255,.10) !important;
  box-shadow: inset 0 0 0 1px rgba(79,140,255,.12) !important;
}
.accordion-button::after{ filter: invert(1) opacity(.85); }
body.site[data-scheme="light"] .accordion-button::after{ filter: none; opacity: .7; }

.accordion-body{
  background: rgba(255,255,255,.04) !important;
  color: var(--muted) !important;
}
body.site[data-scheme="light"] .accordion-body{
  background: rgba(255,255,255,.92) !important;
  color: rgba(11,18,32,.72) !important;
}

/* CTA strip */
.cta-strip{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 1rem 1.1rem;
  box-shadow: 0 .25rem .75rem rgba(0,0,0,.10);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cta-strip:hover{
  transform: translateY(-2px);
  border-color: rgba(79,140,255,.30);
  box-shadow: 0 18px 60px var(--shadow), 0 0 22px var(--glow-2);
}

/* Forms */
#kapcs .form-control{
  border-radius: 14px;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
#kapcs .form-control::placeholder{ color: rgba(229,231,235,.55) !important; }
#kapcs .form-control:focus{
  border-color: rgba(79,140,255,.6) !important;
  box-shadow: 0 0 0 .2rem rgba(79,140,255,.15) !important;
}
body.site[data-scheme="light"] #kapcs .form-control{
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(11,18,32,.14) !important;
  color: #0b1220 !important;
}
body.site[data-scheme="light"] #kapcs .form-control::placeholder{
  color: rgba(11,18,32,.45) !important;
}

#submitBtn[disabled]{ opacity: .75; cursor: not-allowed; }

/* Footer */
.footer-surface{
  background: rgba(10,16,28,.55);
  border-top: 1px solid var(--border);
}
body.site[data-scheme="light"] .footer-surface{
  background: rgba(255,255,255,.72);
}

/* ===== Service area ===== */
.badge-pill{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .55rem .85rem;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid var(--border);
  color: var(--text);
}
body.site[data-scheme="light"] .badge-pill{ background: rgba(255,255,255,.92); }

.area-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: .5rem;
}
@media (min-width: 576px){ .area-grid{ grid-template-columns: 1fr 1fr; } }

.area-item{
  padding: .6rem .75rem;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  color: var(--text);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body.site[data-scheme="light"] .area-item{
  background: rgba(255,255,255,.92);
  border-color: rgba(11,18,32,.10);
}
.area-item:hover{
  transform: translateY(-2px);
  border-color: rgba(79,140,255,.30);
  box-shadow: 0 0 18px var(--glow-2);
}

/* Map */
.map-wrap{
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
  min-height: 340px;
}
.map-iframe{
  width: 100%;
  height: 380px;
  border: 0;
  filter: grayscale(.9) contrast(1.05) brightness(.85);
  opacity: .95;
}
body.site[data-scheme="light"] .map-wrap{
  border-color: rgba(11,18,32,.12);
  background: rgba(0,0,0,.06);
}
body.site[data-scheme="light"] .map-iframe{
  filter: grayscale(.85) contrast(1.02) brightness(.95);
  opacity: .98;
}

/* ===== Reviews ===== */
.rating-badge{
  padding: .75rem 1rem;
  border-radius: 18px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 .25rem .75rem rgba(0,0,0,.10);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body.site[data-scheme="light"] .rating-badge{
  background: rgba(255,255,255,.92);
  border-color: rgba(11,18,32,.10);
}
.rating-badge:hover{
  transform: translateY(-2px);
  border-color: rgba(79,140,255,.30);
  box-shadow: 0 18px 60px var(--shadow), 0 0 22px var(--glow-2);
}

.stars{
  display: inline-flex;
  align-items: center;
  gap: .2rem;
  color: rgba(255, 205, 86, .95);
  text-shadow: 0 0 18px rgba(255, 205, 86, .12);
}

.stat-card{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body.site[data-scheme="light"] .stat-card{
  background: rgba(255,255,255,.92);
  border-color: rgba(11,18,32,.10);
}
.stat-card:hover{
  transform: translateY(-2px);
  border-color: rgba(79,140,255,.30);
  box-shadow: 0 0 18px var(--glow-2);
}

.stat-top{ display:flex; align-items:center; margin-bottom: .35rem; }
.stat-ico{
  width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px;
  background: rgba(79,140,255,.18);
  border: 1px solid rgba(79,140,255,.25);
  color: #dbe8ff;
  box-shadow: 0 0 18px var(--glow-2);
}
body.site[data-scheme="light"] .stat-ico{ color: #0b1220; }

.review-card{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  position: relative;
  overflow: hidden;
}
body.site[data-scheme="light"] .review-card{
  background: rgba(255,255,255,.92);
  border-color: rgba(11,18,32,.10);
}
.review-card::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.06));
  pointer-events:none;
}
body.site[data-scheme="light"] .review-card::before{
  background: linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.02));
}
.review-card > *{ position: relative; z-index: 1; }
.review-card:hover{
  transform: translateY(-3px);
  border-color: rgba(79,140,255,.30);
  box-shadow: 0 18px 60px var(--shadow), 0 0 22px var(--glow-2);
}

.review-head{ display:flex; gap: .75rem; align-items:center; margin-bottom: .9rem; }
.review-head > .muted.small{ white-space: nowrap; margin-left: auto; }
.review-head .fw-semibold{ display: flex; flex-wrap: wrap; gap: .35rem; align-items: baseline; }
.review-head .fw-semibold .muted.small{ white-space: nowrap; }

.avatar{
  width: 44px; height: 44px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
  font-weight: 800;
  letter-spacing: .5px;
  background: rgba(79,140,255,.18);
  border: 1px solid rgba(79,140,255,.25);
  color: #dbe8ff;
  box-shadow: 0 0 18px var(--glow-2);
}
body.site[data-scheme="light"] .avatar{ color: #0b1220; }

.review-text{ color: var(--muted); line-height: 1.55; }

/* ===== File previews (multi) ===== */
.photo-preview-list{
  margin-top: .75rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: .75rem;
  padding: .75rem;
  border-radius: 16px;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--border);
}
body.site[data-scheme="light"] .photo-preview-list{ background: rgba(255,255,255,.92); }

.photo-card{
  display: grid;
  gap: .55rem;
  padding: .6rem;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--border);
}
body.site[data-scheme="light"] .photo-card{ background: rgba(255,255,255,.96); }

.photo-card img{
  width: 100%;
  height: 120px;
  object-fit: cover;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.12);
}
body.site[data-scheme="light"] .photo-card img{ border-color: rgba(11,18,32,.12); }

.photo-meta{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: .5rem;
}
.photo-name{
  font-size: .85rem;
  color: rgba(229,231,235,.85);
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.site[data-scheme="light"] .photo-name{ color: rgba(11,18,32,.78); }

/* ===== Spotlight ===== */
.spotlight{
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity .2s ease;
  z-index: 2;
  background: radial-gradient(
    520px circle at var(--mx, 50%) var(--my, 50%),
    var(--brand-soft),
    transparent 62%
  );
  mix-blend-mode: screen;
}
body.site:hover .spotlight{ opacity: 1; }
body.site[data-scheme="light"] .spotlight{
  mix-blend-mode: multiply;
  opacity: .35;
}
@media (pointer: coarse){ .spotlight{ display:none; } }

/* ===== Toast ===== */
body.site .toast{
  background: rgba(15, 26, 46, .92) !important;
  border: 1px solid var(--border) !important;
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 60px var(--shadow), 0 0 22px var(--glow-2);
  border-radius: 16px;
}
body.site .toast-header{ color: var(--text) !important; }
body.site .toast-body{ color: var(--muted) !important; }
body.site .toast .btn-close{ filter: invert(1); opacity: .8; }

body.site[data-scheme="light"] .toast{
  background: rgba(255,255,255,.92) !important;
  border-color: rgba(11,18,32,.12) !important;
  box-shadow: 0 18px 60px rgba(0,0,0,.12);
}
body.site[data-scheme="light"] .toast .btn-close{ filter: none; opacity: .65; }

/* ===== Mobile sticky CTA ===== */
.mobile-cta{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1070;
  padding: .75rem 0 calc(.75rem + env(safe-area-inset-bottom));
  background: rgba(10,16,28,.72);
  border-top: 1px solid var(--border);
  backdrop-filter: blur(12px);
  transform: translateY(0);
  transition: transform .25s ease, opacity .25s ease;
}
body.site[data-scheme="light"] .mobile-cta{
  background: rgba(255,255,255,.82);
}
.mobile-cta-inner{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
}
.mobile-cta-btn{
  border-radius: 16px;
  padding: .85rem 1rem;
  font-weight: 600;
}
@media (min-width: 768px){ .mobile-cta{ display: none; } }
.mobile-cta.is-hidden{ transform: translateY(110%); opacity: 0; }
@media (max-width: 767.98px){ body.site{ padding-bottom: 86px; } }

/* ===== UX: Scroll reveal ===== */
.reveal{
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .6s ease, transform .6s ease;
  will-change: opacity, transform;
}
.reveal.is-visible{ opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce){
  .reveal{ transition: none; transform: none; opacity: 1; }
}

/* ===== THEME PACK (DARK) ===== */
/* Céges */
body.site[data-theme="corp-slate"]{
  --bg: #0b1220; --bg-2: #0f1a2e;
  --surface: rgba(255,255,255,.055);
  --border: rgba(255,255,255,.10);
  --muted: rgba(229,231,235,.78);
  --brand-soft: rgba(79,140,255,.14);
  --glow-2: rgba(79,140,255,.18);
}
body.site[data-theme="corp-graphite"]{
  --bg: #0b0d12; --bg-2: #111624;
  --surface: rgba(255,255,255,.05);
  --border: rgba(255,255,255,.11);
  --muted: rgba(229,231,235,.76);
  --brand-soft: rgba(124,156,255,.12);
  --glow-2: rgba(124,156,255,.16);
}
body.site[data-theme="corp-blueprint"]{
  --bg: #071023; --bg-2: #0a1733;
  --surface: rgba(255,255,255,.055);
  --border: rgba(255,255,255,.10);
  --muted: rgba(229,231,235,.78);
  --brand-soft: rgba(79,140,255,.16);
  --glow-2: rgba(79,140,255,.18);
}

/* Gamer */
body.site[data-theme="gamer-cyber"]{
  --bg: #05070f; --bg-2: #0a1022;
  --surface: rgba(255,255,255,.06);
  --border: rgba(255,255,255,.12);
  --muted: rgba(229,231,235,.80);
  --brand-soft: rgba(79,140,255,.18);
  --glow-2: rgba(79,140,255,.25);
}
body.site[data-theme="gamer-arcade"]{
  --bg: #070511; --bg-2: #0d0720;
  --surface: rgba(255,255,255,.065);
  --border: rgba(255,255,255,.12);
  --muted: rgba(229,231,235,.80);
  --brand-soft: rgba(167,139,250,.18);
  --glow-2: rgba(167,139,250,.24);
}
body.site[data-theme="gamer-toxic"]{
  --bg: #050b07; --bg-2: #07140e;
  --surface: rgba(255,255,255,.06);
  --border: rgba(255,255,255,.12);
  --muted: rgba(229,231,235,.82);
  --brand-soft: rgba(52,211,153,.18);
  --glow-2: rgba(52,211,153,.24);
}

/* Extra sötét */
body.site[data-theme="dark-ink"]{
  --bg: #04060b; --bg-2: #060a12;
  --surface: rgba(255,255,255,.05);
  --border: rgba(255,255,255,.10);
  --muted: rgba(229,231,235,.78);
  --brand-soft: rgba(79,140,255,.12);
  --glow-2: rgba(79,140,255,.16);
}
body.site[data-theme="dark-void"]{
  --bg: #020308; --bg-2: #040611;
  --surface: rgba(255,255,255,.045);
  --border: rgba(255,255,255,.095);
  --muted: rgba(229,231,235,.76);
  --brand-soft: rgba(79,140,255,.11);
  --glow-2: rgba(79,140,255,.15);
}
body.site[data-theme="dark-oled"]{
  --bg: #000000; --bg-2: #04040a;
  --surface: rgba(255,255,255,.045);
  --border: rgba(255,255,255,.09);
  --muted: rgba(229,231,235,.76);
  --brand-soft: rgba(79,140,255,.11);
  --glow-2: rgba(79,140,255,.15);
}

/* Világosabb dark */
body.site[data-theme="corp-bright"]{
  --bg: #0e172a; --bg-2: #14203a;
  --surface: rgba(255,255,255,.095);
  --border: rgba(255,255,255,.16);
  --muted: rgba(229,231,235,.86);
  --brand-soft: rgba(79,140,255,.16);
  --glow-2: rgba(79,140,255,.20);
}
body.site[data-theme="gamer-bright"]{
  --bg: #0a1022; --bg-2: #101a33;
  --surface: rgba(255,255,255,.10);
  --border: rgba(255,255,255,.18);
  --muted: rgba(229,231,235,.88);
  --brand-soft: rgba(167,139,250,.22);
  --glow-2: rgba(167,139,250,.28);
}
body.site[data-theme="glass-bright"]{
  --bg: #0f172a; --bg-2: #1a2a4a;
  --surface: rgba(255,255,255,.12);
  --border: rgba(255,255,255,.20);
  --muted: rgba(229,231,235,.90);
  --brand-soft: rgba(79,140,255,.18);
  --glow-2: rgba(79,140,255,.24);
}

/* ===== Light variants (csak brand hangulat) ===== */
body.site[data-theme="light-corp"]{
  --brand-soft: rgba(79,140,255,.16);
}
body.site[data-theme="light-warm"]{
  --brand-soft: rgba(255,193,7,.18);
  --glow-2: rgba(255,193,7,.16);
}
body.site[data-theme="light-clean"]{
  --brand-soft: rgba(99,102,241,.16);
  --glow-2: rgba(99,102,241,.16);
}

/* --- FIX: logo + navbar tisztább (főleg day theme) --- */

/* Logo igazítás */
.navbar-brand {
  padding-top: 0;
  padding-bottom: 0;
  line-height: 1;
}

.brand-badge{
  width: 32px;
  height: 32px;
  border-radius: 10px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
}

.brand-badge i{
  font-size: 1.05rem;
  line-height: 1;
}

/* Navbar legyen kicsit opákabb, ne üssön át a circuit */
.nav-surface{
  background: color-mix(in srgb, var(--panel2) 92%, transparent);
}

/* Nappali témáknál még opákabb + rendes border */
body[data-theme^="day-"] .nav-surface{
  background: rgba(255,255,255,0.88);
  border-bottom: 1px solid rgba(11,18,32,0.12);
}

/* Nappaliban a badge kapjon normális keretet (ne tűnjön “koszosnak”) */
body[data-theme^="day-"] .brand-badge{
  background: rgba(11,18,32,0.06);
  border: 1px solid rgba(11,18,32,0.14);
}
/* =========================
   NAV + LOGO FIX (no bleed)
   ========================= */

/* A nav legyen tényleg "fedő", ne üssön át a circuit/spotlight */
.nav-surface{
  position: sticky;
  top: 0;
  z-index: 1050;

  /* fontos: teljesen opák alap, és külön blur csak ha akarod */
  background: var(--nav-bg, rgba(10,16,28,0.92));
  border-bottom: 1px solid rgba(255,255,255,0.10);
  backdrop-filter: blur(10px);
}

/* Biztosítsuk, hogy a háttér overlay-ek sose "mossák rá" a navra */
.bg-circuit,
.bg-spotlight{
  z-index: 0;
}
.navbar{
  z-index: 1050;
}
.nav-surface *{
  position: relative;
  z-index: 1;
}

/* Logo + badge stabil */
.navbar-brand{
  padding-top: 8px;
  padding-bottom: 8px;
  line-height: 1;
}

.brand-badge{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.16);
}

.brand-badge i{
  font-size: 1.05rem;
  line-height: 1;
}

/* Nappali témák: világos nav, de circuit maradhat sötét-finom */
body[data-theme^="day-"] .nav-surface{
  --nav-bg: rgba(255,255,255,0.92);
  border-bottom: 1px solid rgba(10,16,28,0.12);
}

body[data-theme^="day-"] .brand-badge{
  background: rgba(10,16,28,0.06);
  border: 1px solid rgba(10,16,28,0.12);
}

/* ===== NAV: ne mossa el a tartalmat (logo, menü) ===== */

/* FONTOS: ne legyen opacity/filter a teljes navon */
.nav-surface{
  opacity: 1 !important;
  filter: none !important;
}

/* A háttér áttetszősége csak a háttérből jöjjön, ne a tartalomból */
.nav-surface{
  background: rgba(10, 16, 28, 0.92) !important;
  border-bottom: 1px solid rgba(255,255,255,0.10);
  backdrop-filter: blur(10px);
}

/* Logo szöveg legyen fixen világos */
.navbar-brand,
.navbar-brand .brand-text{
  color: rgba(255,255,255,0.92) !important;
}

/* Badge kapjon erősebb kontrasztot */
.brand-badge{
  background: rgba(255,255,255,0.10) !important;
  border: 1px solid rgba(255,255,255,0.20) !important;
}

.brand-badge i{
  color: rgba(255,255,255,0.95) !important;
}

/* Spotlight ne legyen a nav felett */
.bg-spotlight{
  top: 64px; /* nav magasság körül */
}

/* =========================
   DAY THEME NAV FIX (BIZTOS)
   ========================= */

/* ha a data-theme bármilyen "day..." */
body[data-theme^="day"] nav.nav-surface,
html[data-theme^="day"] nav.nav-surface {
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(15, 23, 42, 0.14) !important;
  opacity: 1 !important;
  filter: none !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

/* ha valami régi CSS a NAV-on opacity-t ad a gyerekekre */
body[data-theme^="day"] nav.nav-surface * ,
html[data-theme^="day"] nav.nav-surface * {
  opacity: 1 !important;
  filter: none !important;
}

/* menüpontok */
body[data-theme^="day"] nav.nav-surface .nav-link,
html[data-theme^="day"] nav.nav-surface .nav-link {
  color: rgba(15, 23, 42, 0.88) !important;
}

body[data-theme^="day"] nav.nav-surface .nav-link:hover,
body[data-theme^="day"] nav.nav-surface .nav-link:focus,
html[data-theme^="day"] nav.nav-surface .nav-link:hover,
html[data-theme^="day"] nav.nav-surface .nav-link:focus {
  color: rgba(15, 23, 42, 1) !important;
}

/* aktív link */
body[data-theme^="day"] nav.nav-surface .nav-link.active,
html[data-theme^="day"] nav.nav-surface .nav-link.active {
  color: rgba(15, 23, 42, 1) !important;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 8px;
  text-decoration-thickness: 2px;
}

/* logó */
body[data-theme^="day"] nav.nav-surface .navbar-brand,
body[data-theme^="day"] nav.nav-surface .navbar-brand * ,
html[data-theme^="day"] nav.nav-surface .navbar-brand,
html[data-theme^="day"] nav.nav-surface .navbar-brand * {
  color: rgba(15, 23, 42, 0.92) !important;
}

/* téma select */
body[data-theme^="day"] nav.nav-surface .theme-select,
html[data-theme^="day"] nav.nav-surface .theme-select {
  background: rgba(15, 23, 42, 0.06) !important;
  border-color: rgba(15, 23, 42, 0.18) !important;
  color: rgba(15, 23, 42, 0.92) !important;
}

/* hamburger (ha világos a háttér) */
body[data-theme^="day"] nav.nav-surface .navbar-toggler,
html[data-theme^="day"] nav.nav-surface .navbar-toggler {
  border-color: rgba(15, 23, 42, 0.25) !important;
}

body[data-theme^="day"] nav.nav-surface .navbar-toggler-icon,
html[data-theme^="day"] nav.nav-surface .navbar-toggler-icon {
  filter: invert(1) grayscale(1) contrast(1.4) !important;
}

/* === LIGHT NAV OVERRIDE (fix) === */
body.site[data-scheme="light"] .nav-surface{
  background: rgba(255,255,255,0.92) !important;
  border-bottom: 1px solid rgba(11,18,32,0.12) !important;
}

body.site[data-scheme="light"] .navbar-brand,
body.site[data-scheme="light"] .navbar-brand .brand-text{
  color: rgba(15,23,42,0.92) !important;
}

body.site[data-scheme="light"] .brand-badge{
  background: rgba(11,18,32,0.06) !important;
  border: 1px solid rgba(11,18,32,0.14) !important;
}

body.site[data-scheme="light"] .brand-badge i{
  color: rgba(15,23,42,0.92) !important;
}


/* ===== NAV CIRCUIT ===== */
:root{
  --nav-circuit-line: #f59e0b;
  --nav-circuit-node-fill: rgba(245, 158, 11, 0.55);
  --nav-circuit-node-stroke: #f59e0b;
  --nav-circuit-pulse: #f59e0b;
}

body.site[data-scheme="light"]{
  --nav-circuit-line: rgba(11, 18, 32, 0.18);
  --nav-circuit-node-fill: rgba(11, 18, 32, 0.12);
  --nav-circuit-node-stroke: rgba(11, 18, 32, 0.18);
  --nav-circuit-pulse: rgba(11, 18, 32, 0.26);
}

.nav-surface{
  position: sticky;
  top: 0;
  overflow: hidden;
}

.nav-surface > .container{
  position: relative;
  z-index: 2;
}

.nav-circuit{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0.38;
  z-index: 1;
}

.nav-circuit .nc-line{
  fill: none;
  stroke: var(--nav-circuit-line);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.65;
  vector-effect: non-scaling-stroke;
}

.nav-circuit .nc-node{
  fill: var(--nav-circuit-node-fill);
  stroke: var(--nav-circuit-node-stroke);
  stroke-width: 0.8;
  vector-effect: non-scaling-stroke;
}

.nav-circuit .nc-pulse{
  fill: none;
  stroke: var(--nav-circuit-pulse);
  stroke-width: 2.0;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 14 18;
  animation: navCircuitPulse 3s linear infinite;
  opacity: 0.85;
  vector-effect: non-scaling-stroke;
}

@keyframes navCircuitPulse{
  0%{ stroke-dashoffset: 0; }
  100%{ stroke-dashoffset: -180; }
}