/* ============================================================
   PUBLIKUS CÉGOLDAL · GLOW-BORDER — fókuszra/hoverre KÖRBEFUTÓ KÉK CSÍK
   doc: docs/ceg-publikus-profil/10-…-2026-08-21.md §8

   ⭐ A birtsoft.com `glow-border.css` adaptációja (user kérése, 2026-08-21) — a piros helyett
   a mi kék hangsúly-színünkkel. TECHNIKA:
   1. A kártya ::before pontosan a keret helyét tölti ki (inset:-1px, padding:2px).
   2. A háttere forgó conic-gradient — nagyrészt átlátszó, a végén rövid, fényes „üstökös".
   3. A `mask` kimaszkolja a kártya BELSEJÉT (content-box exclude) → csak a 2px keret-gyűrű látszik.
   4. A `@property --glow-angle` regisztrálja a szöget animálható <angle>-ként (enélkül ugrálna).
   5. CSAK hoverre/fókuszra fut (nyugalomban nem versenyez a figyelemmel); mozgáscsökkentésnél
      látszik, de nem forog.
   ============================================================ */

@property --cp-glow-angle {
    syntax: '<angle>';
    inherits: false;
    initial-value: 0deg;
}

.cp-card,
.cp-service,
.cp-ref,
.cp-how-step {
    position: relative;
}

.cp-card::before,
.cp-service::before,
.cp-ref::before,
.cp-how-step::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 2px;
    background: conic-gradient(
        from var(--cp-glow-angle),
        transparent 0deg,
        transparent 300deg,
        var(--cp-accent-border) 330deg,
        var(--cp-primary) 345deg,
        var(--cp-accent-bright) 360deg
    );
    -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
            mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s ease;
}

.cp-card:hover::before,
.cp-card:focus-within::before,
.cp-service:hover::before,
.cp-service:focus-within::before,
.cp-ref:hover::before,
.cp-ref:focus-within::before,
.cp-how-step:hover::before,
.cp-how-step:focus-within::before {
    opacity: 1;
    animation: cp-glow-sweep 2.6s linear infinite;
}

@keyframes cp-glow-sweep {
    to { --cp-glow-angle: 360deg; }
}

/* Mozgáscsökkentést kérő beállításnál: a fény látszódjon, de ne forogjon. */
@media (prefers-reduced-motion: reduce) {
    .cp-card:hover::before, .cp-card:focus-within::before,
    .cp-service:hover::before, .cp-service:focus-within::before,
    .cp-ref:hover::before, .cp-ref:focus-within::before,
    .cp-how-step:hover::before, .cp-how-step:focus-within::before {
        animation: none;
    }
}