/* ==========================================================================
   DataAuthority — signature de marque animée (BUILD SIMPLIFIÉ)
   Chargé uniquement par /index.html.
   Objectif : une signature visuelle plus simple, plus calme et plus lisible.
   - un seul grand volume filaire complet ;
   - trois petits cubes magenta comme accents ;
   - logo fixe devant la structure ;
   - aucun masque, aucune découpe, aucun effet « bizarre ».
   ========================================================================== */

.das-band{
  position:relative;
  background:var(--da-home-plate,#0D0D0D);
  color:#fff;
  overflow:hidden;
  padding-block:clamp(60px,9vh,110px);
}

.das-band::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(90% 70% at 50% 52%, rgba(240,38,143,.10), transparent 62%),
    radial-gradient(70% 60% at 50% 52%, rgba(240,38,143,.06), transparent 72%);
}

.das-stage{
  position:relative;
  width:100%;
  max-width:var(--da-home-wrap,1240px);
  margin-inline:auto;
  min-height:clamp(340px,54vw,620px);
  display:grid;
  place-items:center;
}

.das-scene{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  perspective:1200px;
  perspective-origin:50% 48%;
  font-size:clamp(8px,1.35vw,15px);
  pointer-events:none;
}

.das-vol{
  position:absolute;
  left:50%;
  top:50%;
  width:0;
  height:0;
  transform-style:preserve-3d;
  animation:das-spin 32s linear infinite;
  will-change:transform;
}

@keyframes das-spin{
  from{transform:translateY(.4em) rotateX(-16deg) rotateY(0deg)}
  to{transform:translateY(.4em) rotateX(-16deg) rotateY(360deg)}
}

.das-cube,
.das-mini{
  position:absolute;
  left:0;
  top:0;
  width:0;
  height:0;
  transform-style:preserve-3d;
}

.das-cube--outer{--s:22em}

.das-face{
  position:absolute;
  left:0;
  top:0;
  width:var(--s);
  height:var(--s);
  margin-left:calc(var(--s) / -2);
  margin-top:calc(var(--s) / -2);
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.25);
  background:transparent;
}

.das-face--f{transform:translateZ(calc(var(--s) / 2))}
.das-face--b{transform:rotateY(180deg) translateZ(calc(var(--s) / 2))}
.das-face--l{transform:rotateY(-90deg) translateZ(calc(var(--s) / 2))}
.das-face--r{transform:rotateY(90deg) translateZ(calc(var(--s) / 2))}
.das-face--t{transform:rotateX(90deg) translateZ(calc(var(--s) / 2))}
.das-face--d{transform:rotateX(-90deg) translateZ(calc(var(--s) / 2))}

.das-face--hi{border-color:rgba(255,255,255,.42)}

.das-mini{
  --s:1.75em;
  opacity:.88;
}

.das-mini .das-face{
  border-color:rgba(255,255,255,.08);
  background:rgba(240,38,143,.82);
  box-shadow:0 0 12px rgba(240,38,143,.10);
}

.das-mini--1{
  transform:translate3d(-8.2em,-9.6em,7em);
  animation:das-float-1 11s ease-in-out infinite;
}

.das-mini--2{
  transform:translate3d(8.6em,-8.8em,-6.4em);
  animation:das-float-2 13s ease-in-out infinite;
}

.das-mini--3{
  transform:translate3d(0em,9.4em,7.8em);
  animation:das-float-3 12s ease-in-out infinite;
}

@keyframes das-float-1{
  0%,100%{transform:translate3d(-8.2em,-9.6em,7em)}
  50%{transform:translate3d(-8.2em,-10.4em,7em)}
}

@keyframes das-float-2{
  0%,100%{transform:translate3d(8.6em,-8.8em,-6.4em)}
  50%{transform:translate3d(8.6em,-8.1em,-6.4em)}
}

@keyframes das-float-3{
  0%,100%{transform:translate3d(0em,9.4em,7.8em)}
  50%{transform:translate3d(0em,8.6em,7.8em)}
}

.das-sign{
  position:relative;
  z-index:2;
  display:grid;
  justify-items:center;
  gap:clamp(16px,2.2vw,26px);
  padding-inline:var(--da-home-pad,20px);
  text-align:center;
}

.das-logo-wrap{
  position:relative;
  display:inline-block;
  line-height:0;
  padding:0;
  border-radius:0;
  background:transparent;
  backdrop-filter:none;
}

.das-logo-wrap::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:118%;
  height:190%;
  transform:translate(-50%,-50%);
  border-radius:999px;
  background:radial-gradient(ellipse at center, rgba(13,13,13,.34) 0%, rgba(13,13,13,.18) 42%, rgba(13,13,13,0) 74%);
  filter:blur(10px);
  pointer-events:none;
  z-index:-1;
}

.das-logo{
  display:block;
  width:clamp(238px,29vw,362px);
  height:auto;
}

.das-line{
  margin:0;
  font-size:clamp(.62rem,.86vw,.76rem);
  font-weight:700;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:rgba(255,255,255,.60);
}

@media (max-width:700px){
  .das-stage{min-height:clamp(320px,96vw,420px)}
  .das-scene{font-size:clamp(7px,2.25vw,11px)}
  .das-logo{width:min(56vw,214px)}
}

@media (max-width:520px){
  .das-band{padding-block:52px}
  .das-line{letter-spacing:.22em;font-size:.62rem}
  .das-mini--2{display:none}
}

@media (prefers-reduced-motion:reduce){
  .das-vol{animation:none;transform:translateY(.4em) rotateX(-16deg) rotateY(28deg)}
  .das-mini--1,
  .das-mini--2,
  .das-mini--3{animation:none}
}