/* Scene foto cu lumini care se aprind pe rând (includes/lights.php). Folosit în hero și în cardul din footer. Încărcat doar pe designul nou. */
.lx{position:relative;overflow:hidden;background:#0b0e10}
.lx .lx-scene{position:absolute;inset:0;width:100%;height:100%;display:block}
.lx .lx-dim{fill:#070a0f;opacity:.86}

/* Până pornește animația, sursele sunt stinse (rx/ry = 0). Fără JS, totul e aprins. */
.has-js .lx:not(.is-on) .lx-light{rx:0;ry:0}
.has-js .lx.is-on .lx-light{rx:0;ry:0;animation:lx-on var(--t,.8s) cubic-bezier(.2,.7,.3,1) forwards;animation-delay:var(--d,0s)}
@keyframes lx-on{0%{rx:0;ry:0}18%{rx:calc(var(--rx) * .45px);ry:calc(var(--ry) * .45px)}30%{rx:calc(var(--rx) * .2px);ry:calc(var(--ry) * .2px)}100%{rx:calc(var(--rx) * 1px);ry:calc(var(--ry) * 1px)}}
.lx.is-still .lx-light,.lx.is-still .lx-light{animation:none!important;rx:calc(var(--rx) * 1px)!important;ry:calc(var(--ry) * 1px)!important}

/* Hero */
.av-hero-scene.lx{min-height:530px}
.av-hero-scene .lx-tags{position:absolute;left:24px;bottom:24px;z-index:2;display:flex;flex-wrap:wrap;gap:8px;max-width:calc(100% - 110px)}
.lx-tag{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border-radius:999px;background:#0f1316cc;border:1px solid #ffffff2e;color:#f3f1e8;font-size:12px;font-weight:600;letter-spacing:.01em;text-decoration:none;backdrop-filter:blur(6px);transition:background .2s,border-color .2s,color .2s}
.lx-tag:hover,.lx-tag:focus-visible{background:#ffcf32;border-color:#ffcf32;color:#202322}
.lx-switch{position:absolute;right:24px;bottom:24px;z-index:2;width:46px;height:46px;border-radius:50%;border:1px solid #ffffff2e;background:#0f1316cc;color:#ffd84d;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(6px);transition:background .2s,transform .2s}
.lx-switch svg{width:22px;height:22px}
.lx-switch:hover,.lx-switch:focus-visible{background:#ffcf32;color:#202322;transform:rotate(-12deg)}
.has-js .lx:not(.is-on) .lx-switch{color:#9aa39c}

/* Cardul din footer */
.alf .alf-glow.lx{padding:0;min-height:340px;border-radius:24px;border:1px solid #ffffff1a;display:flex;align-items:flex-end}
.alf .alf-glow.lx::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#0b0e10f2 0%,#0b0e10c8 38%,#0b0e1000 72%)}
.alf .alf-glow.lx .alf-glow-body{position:relative;z-index:2;width:100%;padding:36px 40px;grid-template-columns:minmax(0,1fr);gap:22px;align-items:start}
.alf .alf-glow.lx .alf-glow-title{max-width:520px;text-shadow:0 2px 24px #000a}
.alf .alf-glow.lx .lx-switch{right:22px;top:22px;bottom:auto}

@media (max-width:1100px){
    .av-hero-scene.lx{min-height:480px}
}
@media (max-width:760px){
    .av-hero-scene.lx{min-height:360px}
    .av-hero-scene .lx-tags{left:14px;bottom:14px;max-width:calc(100% - 84px)}
    .lx-tag{min-height:34px;padding:0 11px;font-size:11px}
    .lx-switch{right:14px;bottom:14px;width:42px;height:42px}
    .alf .alf-glow.lx{min-height:420px;border-radius:20px}
    .alf .alf-glow.lx::before{background:linear-gradient(180deg,#0b0e1000 0%,#0b0e10b0 45%,#0b0e10f4 100%)}
    .alf .alf-glow.lx .alf-glow-body{padding:26px 18px 22px}
    .alf .alf-glow.lx .lx-switch{right:14px;top:14px}
}
@media (prefers-reduced-motion:reduce){
    .lx .lx-light{animation:none!important;rx:calc(var(--rx) * 1px)!important;ry:calc(var(--ry) * 1px)!important}
    .lx-switch{display:none}
}
