/* ══════════════════════════════════════════════════════════
   Diakov · pagina «In arrivo»
   Regia: righe di avvio → il tubo catodico si accende → la foto va a fuoco →
   il titolo implode parola per parola, con lampo anamorfico → gli ambiti si
   decifrano → PRESTO ONLINE in tre lingue → il pulsante email.
   Poi la scena vive: nebbia, luce che segue il mouse, strappi di segnale.
   ══════════════════════════════════════════════════════════ */
@font-face { font-family: 'Oswald'; src: url('oswald-700.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'JetBrainsMono'; src: url('jetbrains-mono-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }

.dkv-cs, .dkv-cs *, .dkv-cs *::before, .dkv-cs *::after { margin: 0; padding: 0; box-sizing: border-box; }
html, body.dkv-arrivo { background: #050709; }
body.dkv-arrivo { margin: 0; color: #faf8f5; -webkit-font-smoothing: antialiased; }

.dkv-cs {
  --dkv-ink:    #0a0d12;
  --dkv-paper:  #faf8f5;
  --dkv-accent: #b8621a;
  --dkv-glow:   #ffd6aa;
  --dkv-mute:   rgba(250, 248, 245, 0.55);
  --dkv-font-display: 'Oswald', 'Arial Narrow', sans-serif;
  --dkv-font-mono:    'JetBrainsMono', ui-monospace, 'Courier New', monospace;
  --dkv-ease: cubic-bezier(0.16, 0.84, 0.44, 1);
  --dkv-title-size: clamp(27px, 5.8vw, 76px);   /* il JS lo sostituisce misurando la riga più lunga */
  --dkv-soon-size:  clamp(11px, 2vw, 26px);
  --hud: clamp(18px, 4vw, 46px);                /* distanza dei testi HUD dai bordi */

  position: relative;
  min-height: 100vh; min-height: 100dvh;
  overflow: hidden; isolation: isolate;
  background: #050709;
  font-family: var(--dkv-font-display);
}

/* ═══════════════ SFONDO ═══════════════ */
/* il contenitore segue il mouse (parallasse), l'immagine dentro respira e va a fuoco */
.dkv-cs__bg {
  position: absolute; inset: -4%; z-index: 0; overflow: hidden;
  transform: translate3d(calc(var(--px, 0) * -22px), calc(var(--py, 0) * -14px), 0);
  transition: transform 1.2s var(--dkv-ease);
}
.dkv-cs__img {
  position: absolute; inset: 0;
  display: block !important; width: 100% !important; height: 100% !important;
  max-width: none !important; max-height: none !important; border-radius: 0 !important; box-shadow: none !important;
  object-fit: cover !important; object-position: 50% 42%;
  filter: brightness(0.92) contrast(1.04) saturate(0.92) grayscale(0.1);
  animation: dkvBreathe 26s ease-in-out infinite alternate;
}
@keyframes dkvBreathe { 0% { transform: scale(1.03); } 100% { transform: scale(1.12); } }
/* messa a fuoco all'accensione: dalla sovraesposizione sfocata alla foto nitida */
html.js .dkv-cs:not(.is-live) .dkv-cs__img { filter: blur(22px) brightness(1.9) contrast(0.8) grayscale(0.4); }
html.js .dkv-cs.is-live .dkv-cs__img { transition: filter 2.2s var(--dkv-ease); }

/* nebbia: due banchi che scorrono lenti in direzioni opposte */
.dkv-cs__fog { position: absolute; inset: -30%; z-index: 1; pointer-events: none; opacity: 0.9; }
.dkv-cs__fog--a {
  background:
    radial-gradient(ellipse 38% 22% at 30% 62%, rgba(250,248,245,0.07), transparent 70%),
    radial-gradient(ellipse 30% 18% at 72% 70%, rgba(250,248,245,0.05), transparent 70%);
  animation: dkvFogA 38s ease-in-out infinite alternate;
}
.dkv-cs__fog--b {
  background:
    radial-gradient(ellipse 42% 20% at 60% 40%, rgba(250,248,245,0.05), transparent 70%),
    radial-gradient(ellipse 26% 16% at 20% 30%, rgba(250,248,245,0.04), transparent 70%);
  animation: dkvFogB 52s ease-in-out infinite alternate;
}
@keyframes dkvFogA { from { transform: translate3d(-6%, 0, 0); } to { transform: translate3d(8%, -2%, 0); } }
@keyframes dkvFogB { from { transform: translate3d(7%, 1%, 0); } to { transform: translate3d(-8%, -1%, 0); } }

.dkv-cs__darken {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(5,7,9,0.55) 0%, rgba(5,7,9,0.25) 35%, rgba(5,7,9,0.45) 65%, rgba(5,7,9,0.82) 100%),
    radial-gradient(ellipse at 50% 48%, rgba(5,7,9,0.30) 0%, rgba(5,7,9,0.55) 60%, rgba(5,7,9,0.80) 100%);
}
/* torcia: una luce nella nebbia che segue il mouse (solo dove c'è un mouse) */
.dkv-cs__torch {
  position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: 0;
  background: radial-gradient(circle 34vmax at var(--mx, 50%) var(--my, 50%), rgba(250,248,245,0.075), rgba(250,248,245,0.02) 40%, transparent 65%);
  transition: opacity 1.2s ease;
}
.dkv-cs.has-torch .dkv-cs__torch { opacity: 1; }
.dkv-cs__chroma {
  position: absolute; inset: 0; z-index: 3; pointer-events: none;
  mix-blend-mode: screen; opacity: 0.5;
  background:
    radial-gradient(ellipse at 30% 50%, rgba(255,45,45,0.05) 0%, transparent 45%),
    radial-gradient(ellipse at 70% 50%, rgba(45,209,255,0.05) 0%, transparent 45%);
  animation: dkvChroma 9s ease-in-out infinite alternate;
}
@keyframes dkvChroma { 0% { transform: translateX(-3px); opacity: 0.35; } 100% { transform: translateX(3px); opacity: 0.6; } }

/* strappo di segnale: tre fasce della foto spostate di lato per un istante */
.dkv-cs__tear { position: absolute; inset: -4%; z-index: 4; pointer-events: none; visibility: hidden; }
.dkv-cs__tear i {
  position: absolute; inset: 0;
  background: var(--dkv-photo) 50% 42% / cover no-repeat;
  filter: brightness(0.62) contrast(1.15) grayscale(0.2);
  clip-path: inset(var(--t, 40%) 0 var(--b, 50%) 0);
  transform: translate3d(var(--dx, 0), 0, 0);
}
.dkv-cs__tear i:nth-child(2) { box-shadow: inset 0 0 0 100vmax rgba(255,45,45,0.10); }
.dkv-cs__tear i:nth-child(3) { box-shadow: inset 0 0 0 100vmax rgba(45,209,255,0.10); }
.dkv-cs__tear.is-on { visibility: visible; }

.dkv-cs__grain {
  position: absolute; inset: -6%; z-index: 5; pointer-events: none; opacity: 0.16;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  background-size: 120px 120px;
  animation: dkvGrain 0.45s steps(3) infinite;
}
@keyframes dkvGrain {
  0% { transform: translate3d(0,0,0); } 33% { transform: translate3d(-4%,3%,0); }
  66% { transform: translate3d(3%,-4%,0); } 100% { transform: translate3d(-2%,-2%,0); }
}
.dkv-cs__scanlines {
  position: absolute; inset: 0; z-index: 5; pointer-events: none; opacity: 0.5;
  background-image: repeating-linear-gradient(to bottom, rgba(0,0,0,0) 0, rgba(0,0,0,0) 2px, rgba(0,0,0,0.08) 2px, rgba(0,0,0,0.08) 3px);
}
.dkv-cs__vignette {
  position: absolute; inset: 0; z-index: 6; pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 30%, rgba(0,0,0,0.5) 78%, rgba(0,0,0,0.9) 100%);
}
.dkv-cs__sweep {
  position: absolute; left: 0; right: 0; top: 0; z-index: 6; height: 35vh; pointer-events: none;
  background: linear-gradient(180deg, transparent 0%, rgba(250,248,245,0.04) 50%, transparent 100%);
  transform: translateY(-40vh); opacity: 0;
}
.dkv-cs.is-live .dkv-cs__sweep { animation: dkvSweep 9s ease-in-out 3s infinite; }
@keyframes dkvSweep {
  0% { transform: translateY(-40vh); opacity: 0; } 8% { opacity: 1; } 50% { opacity: 1; }
  60% { transform: translateY(105vh); opacity: 0; } 100% { transform: translateY(105vh); opacity: 0; }
}

/* lampo anamorfico: una riga di luce orizzontale che attraversa il titolo */
.dkv-cs__flare { position: absolute; left: 0; right: 0; top: var(--fy, 50%); z-index: 9; height: 0; pointer-events: none; }
.dkv-cs__flare::before {
  content: ''; position: absolute; left: -10%; right: -10%; top: -1px; height: 2px;
  background: linear-gradient(90deg, transparent 0%, rgba(184,98,26,0.25) 22%, rgba(255,214,170,0.95) 50%, rgba(184,98,26,0.25) 78%, transparent 100%);
  box-shadow: 0 0 18px 3px rgba(184,98,26,0.45), 0 0 60px 10px rgba(184,98,26,0.18);
  transform: scaleX(0); opacity: 0;
}
.dkv-cs__flare i {
  position: absolute; left: 50%; top: 0; width: 46vmin; height: 46vmin; margin: -23vmin 0 0 -23vmin;
  background: radial-gradient(circle, rgba(255,214,170,0.30) 0%, rgba(184,98,26,0.12) 30%, transparent 62%);
  transform: scale(0.2); opacity: 0;
}
.dkv-cs__flare.is-on::before { animation: dkvFlareLine 1.1s var(--dkv-ease) forwards; }
.dkv-cs__flare.is-on i { animation: dkvFlareBloom 1.1s ease-out forwards; }
@keyframes dkvFlareLine { 0% { transform: scaleX(0); opacity: 0; } 18% { opacity: 1; } 55% { transform: scaleX(1); opacity: 0.9; } 100% { transform: scaleX(1.15); opacity: 0; } }
@keyframes dkvFlareBloom { 0% { transform: scale(0.2); opacity: 0; } 20% { opacity: 1; } 100% { transform: scale(1.4); opacity: 0; } }

.dkv-cs__flash { position: absolute; inset: 0; z-index: 12; pointer-events: none; background: rgba(250,248,245,0); transition: background 70ms linear; }
.dkv-cs__flash.is-on { background: rgba(250,248,245,0.12); }
.dkv-cs__flash.is-big { background: rgba(250,248,245,0.32); }

/* ═══════════════ MIRINO ═══════════════ */
.dkv-cs__frame { position: absolute; inset: clamp(8px, 1.6vw, 18px); z-index: 10; pointer-events: none; }
.dkv-cs__frame i { position: absolute; width: clamp(14px, 2vw, 26px); height: clamp(14px, 2vw, 26px); border: 0 solid rgba(250,248,245,0.38); }
.dkv-cs__frame i:nth-child(1) { top: 0; left: 0;  border-top-width: 1px; border-left-width: 1px; }
.dkv-cs__frame i:nth-child(2) { top: 0; right: 0; border-top-width: 1px; border-right-width: 1px; }
.dkv-cs__frame i:nth-child(3) { bottom: 0; left: 0;  border-bottom-width: 1px; border-left-width: 1px; }
.dkv-cs__frame i:nth-child(4) { bottom: 0; right: 0; border-bottom-width: 1px; border-right-width: 1px; }
html.js .dkv-cs:not(.is-live) .dkv-cs__frame { opacity: 0; transform: scale(1.08); }
.dkv-cs.is-live .dkv-cs__frame { transition: opacity 1.2s ease, transform 1.4s var(--dkv-ease); }

/* ═══════════════ HUD ═══════════════ */
.dkv-cs__hud {
  position: absolute; z-index: 11;
  font-family: var(--dkv-font-mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--dkv-mute);
  user-select: none; pointer-events: none;
  display: flex; align-items: center; gap: 9px;
}
.dkv-cs__hud--tl { top: var(--hud); left: var(--hud); }
.dkv-cs__hud--tr { top: var(--hud); right: var(--hud); }
.dkv-cs__hud--bl { bottom: var(--hud); left: var(--hud); }
.dkv-cs__hud--br { bottom: var(--hud); right: var(--hud); }
html.js .dkv-cs:not(.is-live) .dkv-cs__hud { opacity: 0; }
.dkv-cs.is-live .dkv-cs__hud { transition: opacity 1s ease 0.4s; }
.dkv-cs.is-live .dkv-cs__hud--bl, .dkv-cs.is-live .dkv-cs__hud--br { transition-delay: 0.7s; }
.dkv-cs__hud-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--dkv-accent); box-shadow: 0 0 12px var(--dkv-accent);
  animation: dkvBlink 1.4s ease-in-out infinite;
}
@keyframes dkvBlink { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
.dkv-cs__bars { display: inline-flex; align-items: flex-end; gap: 2px; height: 10px; }
.dkv-cs__bars i { width: 3px; background: var(--dkv-mute); animation: dkvBar 2.4s steps(1) infinite; }
.dkv-cs__bars i:nth-child(1) { height: 30%; }
.dkv-cs__bars i:nth-child(2) { height: 48%; animation-delay: -0.6s; }
.dkv-cs__bars i:nth-child(3) { height: 66%; animation-delay: -1.1s; }
.dkv-cs__bars i:nth-child(4) { height: 84%; animation-delay: -1.7s; }
.dkv-cs__bars i:nth-child(5) { height: 100%; animation-delay: -0.3s; background: var(--dkv-accent); }
@keyframes dkvBar { 0%, 70% { opacity: 1; } 71%, 84% { opacity: 0.2; } 85% { opacity: 1; } }

/* ═══════════════ CONTENUTO ═══════════════ */
.dkv-cs__content {
  position: relative; z-index: 8;
  min-height: 100vh; min-height: 100dvh;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
  padding: clamp(84px, 12vh, 120px) clamp(24px, 6vw, 80px);
  gap: clamp(26px, 4.6vh, 50px);
  perspective: 900px;
}

.dkv-cs__logo { display: block !important; width: clamp(96px, 9.6vw, 136px) !important; height: auto !important; max-width: none !important; }
.dkv-cs__status {
  margin-top: calc(clamp(10px, 1.6vh, 16px) - clamp(26px, 4.6vh, 50px));
  font-family: var(--dkv-font-mono); font-size: clamp(9px, 0.82vw, 10px);
  letter-spacing: 0.42em; text-transform: uppercase; color: rgba(250,248,245,0.42);
  min-height: 1.4em;
}

/* il titolo vive in un palco 3D che si inclina appena seguendo il mouse */
.dkv-cs__stage {
  width: 100%;
  transform: rotateX(calc(var(--py, 0) * -5deg)) rotateY(calc(var(--px, 0) * 7deg));
  transition: transform 1.2s var(--dkv-ease);
  transform-style: preserve-3d;
}
.dkv-cs__title {
  font-family: var(--dkv-font-display); font-weight: 700; text-transform: uppercase;
  font-size: var(--dkv-title-size); line-height: 1.04; letter-spacing: -0.01em;
  color: var(--dkv-paper); width: 100%; max-width: 96vw; margin: 0 auto;
  text-shadow: 0 0 24px rgba(0,0,0,0.6);
}
.dkv-cs__title-line { display: block; white-space: nowrap; }
.dkv-cs__title .w { display: inline-block; position: relative; margin: 0 0.12em; }
.dkv-cs__title .w.accent { color: var(--dkv-accent); }
.dkv-cs__title .w.accent.is-lit { text-shadow: 0 0 18px rgba(184,98,26,0.55), 0 0 48px rgba(184,98,26,0.25); }

/* implosione: ogni parola arriva da lontano, enorme e sfocata, e si chiude a fuoco */
html.js .dkv-cs:not(.is-still) .dkv-cs__title .w { opacity: 0; }
.dkv-cs__title .w.is-in { animation: dkvWordImplode 560ms var(--dkv-ease) forwards; }
/* finita l'implosione la parola resta ferma: così il tremolio e i glitch non fanno ripartire l'entrata */
html.js .dkv-cs .dkv-cs__title .w.is-set { opacity: 1; }
@keyframes dkvWordImplode {
  0%   { opacity: 0; transform: scale(2.4) translateZ(0); filter: blur(22px); letter-spacing: 0.5em; }
  45%  { opacity: 1; filter: blur(3px); }
  70%  { transform: scale(0.97); }
  100% { opacity: 1; transform: scale(1); filter: blur(0); letter-spacing: -0.01em; }
}
/* scossa del palco quando cade l'ultima parola */
.dkv-cs__stage.is-hit .dkv-cs__title { animation: dkvHit 420ms steps(6) 1; }
@keyframes dkvHit {
  0% { transform: translate(0,0); } 17% { transform: translate(-6px, 2px); text-shadow: -5px 0 rgba(255,45,45,0.7), 5px 0 rgba(45,209,255,0.7); }
  34% { transform: translate(5px, -2px); } 50% { transform: translate(-3px, 1px); text-shadow: 3px 0 rgba(255,45,45,0.6), -3px 0 rgba(45,209,255,0.6); }
  67% { transform: translate(2px, 0); } 100% { transform: translate(0,0); }
}
/* durante uno strappo di segnale il titolo si sdoppia nei canali colore */
.dkv-cs__title.is-split { transform: skewX(-6deg) translateX(4px); text-shadow: -7px 0 rgba(255,45,45,0.75), 7px 0 rgba(45,209,255,0.75); }

.dkv-cs__title .w.glitch::before, .dkv-cs__title .w.glitch::after {
  content: attr(data-text); position: absolute; top: 0; left: 0; width: 100%; pointer-events: none;
}
.dkv-cs__title .w.glitch::before { color: #ff2d2d; transform: translate(-3px,0); opacity: 0.65; animation: dkvGlA 130ms steps(2) forwards; }
.dkv-cs__title .w.glitch::after  { color: #2dd1ff; transform: translate(3px,0);  opacity: 0.65; animation: dkvGlB 130ms steps(2) forwards; }
.dkv-cs__title .w.flicker { animation: dkvFlicker 1.2s steps(1) 1; }
@keyframes dkvFlicker { 0%, 100% { opacity: 1; } 10% { opacity: 0.4; } 12% { opacity: 1; } 40% { opacity: 0.7; } 42% { opacity: 1; } }
@keyframes dkvGlA { 0% { transform: translate(-7px,-2px); } 100% { transform: translate(0,0); opacity: 0; } }
@keyframes dkvGlB { 0% { transform: translate(7px,2px); } 100% { transform: translate(0,0); opacity: 0; } }

/* AMBITI: si decifrano lettera per lettera */
.dkv-cs__areas {
  font-family: var(--dkv-font-mono); text-transform: uppercase;
  font-size: clamp(9px, 0.78vw, 11px); letter-spacing: 0.28em; line-height: 1.8;
  color: rgba(250,248,245,0.5); max-width: 96vw; white-space: nowrap;
  margin-top: clamp(-16px, -1.6vh, -6px);
}
.dkv-cs__area { display: inline-block; white-space: nowrap; }
.dkv-cs__area .is-noise { color: var(--dkv-accent); opacity: 0.8; }
.dkv-cs__area-sep { color: var(--dkv-accent); margin: 0 0.55em; opacity: 0.7; }
html.js .dkv-cs:not(.is-still) .dkv-cs__areas { opacity: 0; }
.dkv-cs__areas.is-on { opacity: 1 !important; }

/* PRESTO ONLINE */
.dkv-cs__soon {
  font-family: var(--dkv-font-display); font-weight: 700; text-transform: uppercase;
  font-size: var(--dkv-soon-size); letter-spacing: 0.12em; color: var(--dkv-accent);
  min-height: 1.2em;
  text-shadow: 0 0 10px rgba(184,98,26,0.35), 0 0 30px rgba(184,98,26,0.15);
}
html.js .dkv-cs:not(.is-still) .dkv-cs__soon:not(.is-built) { opacity: 0; }
.dkv-cs__soon-char {
  display: inline-block; position: relative;
  opacity: 0; filter: blur(8px); transform: translateY(4px);
  transition: opacity 200ms cubic-bezier(0.22,1,0.36,1), filter 200ms cubic-bezier(0.22,1,0.36,1), transform 200ms cubic-bezier(0.22,1,0.36,1);
}
.dkv-cs__soon-char.is-in { opacity: 1; filter: blur(0); transform: translateY(0); }
.dkv-cs__soon-char.is-space { width: 0.32em; }
.dkv-cs__cursor {
  display: inline-block; width: 0.5em; height: 1em; margin-left: 0.12em;
  background: var(--dkv-accent); vertical-align: -0.12em; opacity: 0;
  box-shadow: 0 0 14px rgba(184,98,26,0.6);
}
.dkv-cs__cursor.is-on { animation: dkvCursor 1.1s steps(1) infinite; }
@keyframes dkvCursor { 0%, 50% { opacity: 1; } 50.01%, 100% { opacity: 0; } }
.dkv-cs__soon-char.is-glitch::before, .dkv-cs__soon-char.is-glitch::after {
  content: attr(data-char); position: absolute; top: 0; left: 0; width: 100%; pointer-events: none;
}
.dkv-cs__soon-char.is-glitch::before { color: #ff2d2d; transform: translate(-4px,0); opacity: 0.8; animation: dkvGlA 120ms steps(2) forwards; }
.dkv-cs__soon-char.is-glitch::after  { color: #2dd1ff; transform: translate(4px,0);  opacity: 0.8; animation: dkvGlB 120ms steps(2) forwards; }

/* PULSANTE EMAIL: il colore entra da sinistra, il pulsante si lascia attrarre dal puntatore */
.dkv-cs__cta {
  position: relative; overflow: hidden;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 13px 22px;
  border: 1px solid rgba(184,98,26,0.55);
  color: rgba(250,248,245,0.92);
  font-family: var(--dkv-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase;
  text-decoration: none; cursor: pointer;
  transform: translate3d(var(--cx, 0), var(--cy, 0), 0);
  transition: color 280ms ease, box-shadow 280ms ease, border-color 280ms ease, transform 400ms var(--dkv-ease);
}
.dkv-cs__cta::before {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: var(--dkv-accent);
  transform: scaleX(0); transform-origin: left center;
  transition: transform 420ms var(--dkv-ease);
}
.dkv-cs__cta:hover, .dkv-cs__cta:focus-visible { color: #fff; border-color: var(--dkv-accent); box-shadow: 0 0 28px rgba(184,98,26,0.4); }
.dkv-cs__cta:hover::before, .dkv-cs__cta:focus-visible::before { transform: scaleX(1); }
.dkv-cs__cta:focus-visible { outline: 2px solid var(--dkv-paper); outline-offset: 3px; }
.dkv-cs__cta-icon { width: 16px; height: 16px; flex-shrink: 0; color: var(--dkv-accent); transition: color 280ms ease; }
.dkv-cs__cta:hover .dkv-cs__cta-icon, .dkv-cs__cta:focus-visible .dkv-cs__cta-icon { color: #fff; }
.dkv-cs__cta-sep { opacity: 0.5; }
html.js .dkv-cs:not(.is-still) .dkv-cs__cta:not(.is-in) { opacity: 0; transform: translateY(10px); }
.dkv-cs__cta.is-in { animation: dkvCtaIn 1s cubic-bezier(0.22,1,0.36,1); }
@keyframes dkvCtaIn { 0% { opacity: 0; transform: translateY(10px); clip-path: inset(0 100% 0 0); } 60% { clip-path: inset(0 0 0 0); } 100% { opacity: 1; transform: translateY(0); } }

/* logo: si accende come un'insegna */
html.js .dkv-cs:not(.is-still) .dkv-cs__logo:not(.is-in) { opacity: 0; }
.dkv-cs__logo.is-in { animation: dkvNeon 1.3s steps(1) 1; }
@keyframes dkvNeon { 0% { opacity: 0; } 8% { opacity: 1; } 12% { opacity: 0.1; } 22% { opacity: 0.9; } 26% { opacity: 0.2; } 40%, 100% { opacity: 1; } }

/* ═══════════════ ACCENSIONE ═══════════════ */
.dkv-cs__crt, .dkv-cs__boot { display: none; }
html.js .dkv-cs__crt { display: block; position: absolute; inset: 0; z-index: 20; pointer-events: none; }
.dkv-cs__crt-top, .dkv-cs__crt-bot { position: absolute; left: 0; right: 0; height: 50.5%; background: #050709; transition: transform 900ms cubic-bezier(0.77, 0, 0.18, 1); }
.dkv-cs__crt-top { top: 0; }
.dkv-cs__crt-bot { bottom: 0; }
.dkv-cs__crt-line {
  position: absolute; left: 0; right: 0; top: 50%; height: 2px; margin-top: -1px;
  background: #fff; box-shadow: 0 0 22px 4px rgba(255,255,255,0.65), 0 0 80px 14px rgba(184,98,26,0.35);
  transform: scaleX(0); opacity: 0;
}
.dkv-cs__crt.is-line .dkv-cs__crt-line { animation: dkvCrtLine 1.1s var(--dkv-ease) forwards; }
@keyframes dkvCrtLine { 0% { transform: scaleX(0); opacity: 1; } 30% { transform: scaleX(1); opacity: 1; } 55% { opacity: 1; } 100% { transform: scaleX(1) scaleY(28); opacity: 0; } }
.dkv-cs__crt.is-open .dkv-cs__crt-top { transform: translateY(-101%); }
.dkv-cs__crt.is-open .dkv-cs__crt-bot { transform: translateY(101%); }
html.js .dkv-cs__crt.is-done { display: none; }

html.js .dkv-cs__boot {
  display: block; position: absolute; z-index: 21; pointer-events: none;
  left: var(--hud); bottom: calc(var(--hud) + 28px);
  font-family: var(--dkv-font-mono); font-size: 11px; line-height: 1.9; letter-spacing: 0.08em;
  color: rgba(250,248,245,0.55); white-space: pre; text-transform: uppercase;
  transition: opacity 400ms ease;
}
.dkv-cs__boot b { font-weight: 400; color: var(--dkv-accent); }
.dkv-cs__boot.is-out { opacity: 0; }

/* ═══════════════ ACCESSIBILITÀ ═══════════════ */
.dkv-sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ═══════════════ RESPONSIVE ═══════════════ */
@media (max-width: 760px) {
  .dkv-cs__hud { font-size: 9px; letter-spacing: 0.14em; }
  .dkv-cs__content { gap: clamp(20px, 3.5vh, 38px); }
  .dkv-cs__status { margin-top: calc(clamp(10px, 1.6vh, 16px) - clamp(20px, 3.5vh, 38px)); }
  .dkv-cs__areas { font-size: 9px; letter-spacing: 0.1em; }
  .dkv-cs__cta { padding: 12px 18px; font-size: 10.5px; letter-spacing: 0.16em; }
  html.js .dkv-cs__boot { font-size: 9px; }
}
@media (max-width: 460px) {
  .dkv-cs__hud--tr, .dkv-cs__hud--br { display: none; }
  .dkv-cs__content { padding: 14vh clamp(20px, 6vw, 40px) 12vh; gap: clamp(18px, 3vh, 30px); }
  .dkv-cs__status { margin-top: calc(clamp(12px, 2vh, 18px) - clamp(18px, 3vh, 30px)); }
  .dkv-cs__areas { font-size: clamp(6.5px, 2.4vw, 9px); letter-spacing: 0.06em; max-width: 98vw; }
  .dkv-cs__area-sep { margin: 0 0.4em; }
  .dkv-cs__cta-sep, .dkv-cs__cta span:first-of-type { display: none; }   /* sul telefono resta solo l'indirizzo */
  .dkv-cs__cta { margin-top: clamp(6px, 2vh, 20px); }
}

/* PRIVACY: minuscolo, quasi invisibile, si accende solo sotto il mouse */
.dkv-cs__privacy {
  position: absolute; z-index: 11; bottom: calc(var(--hud) - 6px); left: 50%; transform: translateX(-50%);
  font-family: var(--dkv-font-mono); font-size: 8px; letter-spacing: .22em; text-transform: uppercase;
  color: rgba(250,248,245,0.24); text-decoration: none; padding: 6px 4px;
  transition: color .3s ease;
}
.dkv-cs__privacy:hover, .dkv-cs__privacy:focus-visible { color: rgba(250,248,245,0.7); }
html.js .dkv-cs:not(.is-live) .dkv-cs__privacy { opacity: 0; }
@media (max-width: 900px) { .dkv-cs__privacy { bottom: calc(var(--hud) + 14px); } }   /* sopra la riga dell'HUD, che qui è più stretta */
@media (max-width: 460px) { .dkv-cs__privacy { bottom: calc(var(--hud) - 6px); left: auto; right: var(--hud); transform: none; } }   /* a destra, dove l'HUD è nascosto */

/* telefono che si inclina: i valori arrivano già filtrati dallo script, la transizione si accorcia
   (con 1,2 secondi la scena inseguirebbe il telefono in ritardo) */
.dkv-cs.is-tilt .dkv-cs__bg, .dkv-cs.is-tilt .dkv-cs__stage { transition-duration: .25s; }
/* sul telefono lo schermo è piccolo: il movimento è più ampio che con il mouse, se no non si vede */
/* la foto ha più margine fuori schermo (-16% sopra e sotto, -24% ai lati), così lo spostamento ampio non scopre mai i bordi */
.dkv-cs.is-tilt .dkv-cs__bg { inset: -16% -24%; transform: translate3d(calc(var(--px, 0) * -150px), calc(var(--py, 0) * -110px), 0); }
.dkv-cs.is-tilt .dkv-cs__stage { transform: translate3d(calc(var(--px, 0) * 36px), calc(var(--py, 0) * 24px), 0) rotateX(calc(var(--py, 0) * -26deg)) rotateY(calc(var(--px, 0) * 34deg)); }
.dkv-cs.is-tilt .dkv-cs__torch { background: radial-gradient(circle 46vmax at var(--mx, 50%) var(--my, 50%), rgba(250,248,245,0.11), rgba(250,248,245,0.03) 40%, transparent 65%); }

/* scheda nascosta: tutto fermo */
.dkv-cs--paused *, .dkv-cs--paused *::before, .dkv-cs--paused *::after { animation-play-state: paused !important; }

/* «riduci movimento»: nessuna accensione, niente respiro, niente grana che corre */
.dkv-cs.is-still .dkv-cs__img, .dkv-cs.is-still .dkv-cs__grain, .dkv-cs.is-still .dkv-cs__chroma,
.dkv-cs.is-still .dkv-cs__fog, .dkv-cs.is-still .dkv-cs__sweep, .dkv-cs.is-still .dkv-cs__bars i { animation: none !important; }
.dkv-cs.is-still .dkv-cs__crt, .dkv-cs.is-still .dkv-cs__boot { display: none !important; }
.dkv-cs.is-still .dkv-cs__img { filter: brightness(0.92) contrast(1.04) saturate(0.92) grayscale(0.1); }
@media (prefers-reduced-motion: reduce) {
  .dkv-cs__img, .dkv-cs__grain, .dkv-cs__chroma, .dkv-cs__fog, .dkv-cs__sweep, .dkv-cs__hud-dot, .dkv-cs__bars i { animation: none !important; }
  .dkv-cs__bg, .dkv-cs__stage, .dkv-cs__cta { transition: none !important; transform: none !important; }
}