.d2lux-neural-banner {
    position: relative;
    width: 100%;
    max-width: none;
    height: var(--d2lux-neural-height, 420px);
    min-height: 220px;
    overflow: hidden;
    isolation: isolate;
    background: var(--d2lux-neural-bg, #0b171d);
    color: #fff;
    cursor: crosshair;
    contain: layout paint;
}

/* Par défaut le bandeau sort du conteneur du thème et occupe tout le viewport. */
.d2lux-neural-banner.is-fullbleed {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.d2lux-neural-canvas,
.d2lux-neural-canvas canvas,
.d2lux-neural-word-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.d2lux-neural-canvas canvas {
    display: block;
    touch-action: pan-y;
}

.d2lux-neural-word-layer {
    z-index: 3;
    pointer-events: none;
    overflow: hidden;
}

.d2lux-neural-word {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: 0;
    color: #fff !important;
    font: 800 clamp(24px, 3.8vw, 64px)/.95 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: -.045em;
    text-transform: lowercase;
    white-space: nowrap;
    opacity: 0;
    transform: translate(-50%,-50%) scale(.58) rotate(var(--word-rotate,0deg));
    filter: blur(7px);
    animation: d2lux-word-birth var(--word-life,2.1s) cubic-bezier(.17,.84,.21,1) forwards;
    text-shadow: 0 0 18px rgba(255,255,255,.30), 0 0 42px rgba(255,255,255,.12);
}

.d2lux-neural-hint {
    position:absolute;
    left:24px;
    bottom:18px;
    z-index:4;
    display:flex;
    gap:7px;
    align-items:center;
    font:500 11px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    letter-spacing:.11em;
    text-transform:uppercase;
    color:rgba(244,240,232,.54);
    pointer-events:none;
    transition:opacity .4s ease;
}
.d2lux-neural-hint span:nth-child(1){color:#c85b4b}
.d2lux-neural-hint span:nth-child(2){color:#8fc4c6}
.d2lux-neural-hint span:nth-child(3){color:#e6b25f;margin-right:5px}
.d2lux-neural-banner.is-engaged .d2lux-neural-hint{opacity:.15}

.d2lux-neural-noscript{padding:40px;font:700 clamp(24px,4vw,60px)/1 system-ui,sans-serif}

@keyframes d2lux-word-birth {
    0%{opacity:0;filter:blur(9px);transform:translate(-50%,-50%) scale(.42) rotate(var(--word-rotate));letter-spacing:.08em}
    23%{opacity:1;filter:blur(0);transform:translate(-50%,-50%) scale(1.05) rotate(var(--word-rotate));letter-spacing:-.045em}
    60%{opacity:.96;transform:translate(-50%,-53%) scale(1) rotate(var(--word-rotate))}
    100%{opacity:0;filter:blur(2px);transform:translate(-50%,-76%) scale(.96) rotate(var(--word-rotate))}
}

@media(max-width:680px){
    .d2lux-neural-hint{left:14px;bottom:12px;font-size:9px}
    .d2lux-neural-word{font-size:clamp(22px,9vw,46px);max-width:92%}
}

@media(prefers-reduced-motion:reduce){
    .d2lux-neural-word{animation-duration:.01ms;animation-iteration-count:1}
    .d2lux-neural-hint{transition:none}
}

/* V1.2.2 — clic droit maintenu : orbite */
.d2lux-neural-banner.is-orbiting,
.d2lux-neural-banner.is-orbiting canvas {
    cursor: grabbing !important;
}

/* V1.2.4 — les mots sont désormais des billboards Three.js. Le calque DOM ne sert qu'à aria-live. */
.d2lux-neural-word-layer {
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
    pointer-events:none !important;
}
