/* DNA VISUAL MARKS — approved 07–12 family used as a four-depth spatial identity. */
:root{--mark-x:0;--mark-y:0;--mark-scroll:0}
.dna-pixel-pulse{--unit:4px;--pulse-color:#ff765f;display:inline-flex;align-items:center;gap:calc(var(--unit)*1.3);position:relative;direction:ltr;pointer-events:none}
.pulse-glyph{display:grid;grid-template-columns:repeat(5,var(--unit));grid-template-rows:repeat(5,var(--unit));gap:calc(var(--unit)*.34)}
.dna-pixel-pulse i{display:block;width:var(--unit);height:var(--unit)}.pulse-glyph .is-on{background:currentColor}.pulse-glyph .is-off{opacity:0}
.pulse-trail{position:relative;width:calc(var(--unit)*8);height:calc(var(--unit)*7)}
.pulse-trail i{position:absolute;left:calc(var(--trail-x)*var(--unit)*1.2);top:calc(var(--trail-y)*var(--unit));background:var(--pulse-color);opacity:calc(.92 - var(--trail-x)*.12)}
.brand .dna-pixel-pulse{--unit:2px;color:#f4eee2;margin-left:13px;vertical-align:middle}.brand-dot{display:none}
.dna-pixel-pulse--hero{--unit:5px;color:#f4eee2;margin-bottom:25px;filter:drop-shadow(0 8px 16px #0008)}.dna-pixel-pulse--hero .pulse-trail{width:calc(var(--unit)*10)}
.dna-pixel-pulse--corner{--unit:2px;color:#8699a1;position:absolute;right:14px;top:14px;opacity:.55;z-index:4}.card,.feature,.panel{position:relative}
.dna-pixel-pulse--panorama{--unit:3px;color:#fff;position:absolute;right:5%;top:28px;z-index:5;opacity:.82}.dna-pixel-pulse--panorama .pulse-trail i{background:var(--panorama-tint)}
.dna-pixel-pulse--footer{--unit:4px;color:#f4eee2;margin-bottom:24px}
.dna-fixed-anchor{position:fixed;right:clamp(18px,3vw,52px);top:50%;transform:translateY(-50%);z-index:18;pointer-events:none;opacity:.78;filter:drop-shadow(0 10px 24px #000b)}
.dna-fixed-anchor:before{content:"DNA VISUAL MARK";position:absolute;right:0;top:calc(100% + 12px);font:8px/1 monospace;letter-spacing:2px;color:#f4eee299;white-space:nowrap}
.dna-pixel-pulse--fixed{--unit:3px;color:#f4eee2;padding:12px;background:#07151bbb;border:1px solid #ffffff24;backdrop-filter:blur(12px)}
.hero,.music-panorama{isolation:isolate}.hero>*:not(.dna-mark-field),.music-panorama>*:not(.dna-mark-field){position:relative;z-index:2}
.dna-mark-field{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;contain:paint;opacity:.9}
.dna-mark-depth{position:absolute;will-change:transform,opacity;mix-blend-mode:screen;transform:translate3d(calc(var(--mark-x)*var(--depth)*13px),calc(var(--mark-y)*var(--depth)*9px + var(--mark-scroll)*var(--depth)*-.018px),0)}
.dna-mark-depth .dna-pixel-pulse{color:#f4eee2}.dna-mark-depth .pulse-trail i{background:var(--panorama-tint,#ff765f)}
.dna-mark-depth--1{left:-3%;top:10%;opacity:.08;filter:blur(1.5px)}.dna-mark-depth--1 .dna-pixel-pulse{--unit:15px;transform:scale(1.65)}
.dna-mark-depth--2{right:5%;top:18%;opacity:.13}.dna-mark-depth--2 .dna-pixel-pulse{--unit:9px;transform:rotate(-7deg)}
.dna-mark-depth--3{left:16%;bottom:4%;opacity:.2}.dna-mark-depth--3 .dna-pixel-pulse{--unit:5px;transform:rotate(5deg)}
.dna-mark-depth--4{right:8%;bottom:9%;opacity:.34}.dna-mark-depth--4 .dna-pixel-pulse{--unit:3px}
.dna-mark--7 .pulse-glyph .is-on{background:transparent;outline:max(1px,calc(var(--unit)*.14)) solid currentColor}
.dna-mark--8 .pulse-glyph{gap:0}.dna-mark--8 .pulse-glyph .is-on{transform:skewX(-15deg) scaleY(.7)}
.dna-mark--9 .pulse-glyph:nth-child(2){transform:translateY(calc(var(--unit)*-1.7))}.dna-mark--9 .pulse-glyph:nth-child(3){transform:translateY(calc(var(--unit)*1.7))}
.dna-mark--10 .pulse-trail{transform:scaleX(1.35);transform-origin:left}
.dna-mark--11{filter:drop-shadow(0 0 calc(var(--unit)*1.8) currentColor)}.dna-mark--11 .pulse-glyph .is-on{border-radius:50%}
.dna-mark--12 .pulse-glyph:nth-child(1){transform:rotate(-5deg)}.dna-mark--12 .pulse-glyph:nth-child(3){transform:rotate(5deg)}.dna-mark--12 .pulse-trail{transform:rotate(90deg);transform-origin:left top}
@keyframes pulse-release{0%,72%,100%{transform:translate(0,0);opacity:var(--pulse-opacity,.8)}84%{transform:translate(calc(var(--trail-x,0)*1.2px),calc((var(--trail-y,0) - 3)*1px));opacity:1}}
body:not(.reduced) .pulse-trail i{--pulse-opacity:.72;animation:pulse-release 4.8s ease-in-out infinite;animation-delay:calc(var(--pulse-order)*35ms)}
@media(prefers-reduced-motion:reduce){.pulse-trail i{animation:none!important}.dna-mark-depth{transform:none!important}}body.reduced .pulse-trail i{animation:none!important}body.reduced .dna-mark-depth{transform:none!important}
@media(max-width:640px){.brand .dna-pixel-pulse{--unit:1.5px;margin-left:8px}.dna-pixel-pulse--hero{--unit:3.4px;margin-bottom:18px}.dna-pixel-pulse--panorama{--unit:2px;top:14px}.dna-pixel-pulse--corner{--unit:1.6px}.dna-mark-depth--1 .dna-pixel-pulse{--unit:8px}.dna-mark-depth--2 .dna-pixel-pulse{--unit:5px}.dna-mark-depth--3 .dna-pixel-pulse{--unit:3px}.dna-mark-depth--4{display:none}.dna-mark-field{opacity:.7}.dna-fixed-anchor{right:8px;top:auto;bottom:18px;transform:none;opacity:.66}.dna-pixel-pulse--fixed{--unit:1.7px;padding:7px}.dna-fixed-anchor:before{display:none}}
