.dvb { --dvb-testo: #C9C7BE; --dvb-chiaro: #FFFFFF; --dvb-luce: #00E0FF; display: inline-flex; align-items: baseline; gap: .3em; color: var(--dvb-testo); text-decoration: none; white-space: nowrap; }
.dvb:focus-visible { outline: 2px solid var(--dvb-chiaro); outline-offset: 2px; }
.dvb-nome { position: relative; top: .03em; display: inline-block; font-size: .9em; font-weight: 700; background: linear-gradient(100deg, var(--dvb-testo) 38%, var(--dvb-luce) 50%, var(--dvb-testo) 62%) 100% 0 / 300% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: dvb-luce 4.4s cubic-bezier(.45, 0, .2, 1) infinite; }
.dvb-nome i { display: inline-block; width: var(--w); margin-right: .06em; font-style: normal; text-align: center; transition: margin-right 1.5s cubic-bezier(.45, 0, .2, 1); }
.dvb:is(:hover, :focus-visible) .dvb-nome i { margin-right: .18em; }
.dvb-nome .dvb-x { -webkit-text-fill-color: var(--dvb-luce); }
.dvb.resta .dvb-nome { background-image: linear-gradient(100deg, var(--dvb-chiaro) 38%, var(--dvb-luce) 50%, var(--dvb-chiaro) 62%); animation: dvb-luce-continua 2.2s cubic-bezier(.45, 0, .2, 1) infinite; }
@keyframes dvb-luce { 50%, 100% { background-position: 0 0; } }
@keyframes dvb-luce-continua { to { background-position: 0 0; } }
.dvb-scrittura .dvb-nome { font-weight: 600; letter-spacing: .08em; transition: color .6s cubic-bezier(.2, .7, .2, 1), -webkit-text-fill-color .6s cubic-bezier(.2, .7, .2, 1); }
.dvb-scrittura .dvb-nome::after { content: ""; position: absolute; left: 0; right: .08em; bottom: -.12em; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.dvb-scrittura:is(:hover, :focus-visible) .dvb-nome { color: var(--dvb-chiaro); -webkit-text-fill-color: var(--dvb-chiaro); }
.dvb-scrittura:is(:hover, :focus-visible) .dvb-nome::after { transform: none; }
.dvb-scrittura.dvb-attende .dvb-nome { clip-path: inset(-.2em 100% -.3em 0); animation: none; }
.dvb-scrittura.vu .dvb-nome { animation: dvb-scrittura 1.4s cubic-bezier(.45, 0, .2, 1) both, dvb-luce-scrittura 3.4s cubic-bezier(.45, 0, .2, 1) 1.4s infinite; }
@keyframes dvb-luce-scrittura { 76%, 100% { background-position: 0 0; } }
@keyframes dvb-scrittura { from { clip-path: inset(-.2em 100% -.3em 0); } to { clip-path: inset(-.2em 0 -.3em 0); } }
