.tec{--moi:var(--color-bleu);--g:var(--tq);--d:var(--color-orange)}
.tec-bid{color:var(--color-bleu)}
.tec-evo-txt{color:var(--color-violet)}

.tec-s1{stop-color:var(--tq)}.tec-s2{stop-color:var(--color-bleu)}.tec-s3{stop-color:var(--color-violet)}
.tec-dalle{fill:var(--background-color);fill-opacity:.82;stroke:var(--color-primary);stroke-opacity:.6}
.tec-tranche{stroke:var(--color-primary);stroke-opacity:.28}
.tec-trame{stroke:var(--color-hairline-soft);stroke-dasharray:2 4}
.tec-reseau,.tec-lien,.tec-sortie,.tec-module,.tec-bloc{stroke:var(--color-primary)}
.tec-lien{stroke-opacity:.55}
.tec-sortie,.tec-lien-futur{stroke-dasharray:2 4;animation:fh-derive 7s linear infinite}
.tec-lien-futur,.tec-creux,.tec-futur .tec-dalle,.tec-futur .tec-bloc{stroke:var(--color-txt-secondary)}
.tec-pts{fill:var(--color-primary)}
.tec-anneau,.tec-creux,.tec-face{fill:var(--background-color)}
.tec-anneau{stroke:var(--color-primary)}
.tec-dessus,.tec-bloc{fill:var(--color-bleu);fill-opacity:.07;transition:fill-opacity .5s}
.tec-objet,.tec-fil{stroke:var(--color-violet)}
.tec-fil{stroke-dasharray:2 3;opacity:.8}
.tec-futur .tec-dalle{stroke-dasharray:3 5;fill-opacity:.5}
.tec-futur .tec-bloc{fill:var(--color-txt-secondary);fill-opacity:0;stroke-dasharray:2 4}
.is-actif .tec-dessus,.tec-bloc.is-actif{fill-opacity:.34}
.tec-cote{stroke:var(--color-hairline)}
.tec-spectre{stroke:url(#tec-spectre)}
.tec-routes{stroke:none}
.tec-pouls{fill:var(--color-bleu);opacity:0}
.tec-reperes{stroke:var(--color-hairline-soft)}
.tec-n{--h:0px}.tec-n1{--h:150px}.tec-n2{--h:300px}.tec-n3{--h:450px}
.js-motion .tec-n{animation:tec-leve 1.3s var(--ease) both}
.js-motion .tec-n2{animation-delay:.1s}
.js-motion .tec-n3{animation-delay:.2s}
.js-motion .tec-lien{transform-box:fill-box;transform-origin:50% 100%;animation:tec-trace .6s var(--ease) 1.2s both}
.js-motion .tec-lien-futur{animation:tec-trace .6s var(--ease) 1.2s both,fh-derive 7s linear 1.8s infinite}
.js-motion .tec-cote{animation:tec-voile .8s ease 1.1s both}
@keyframes tec-leve{from{opacity:0;transform:translateY(var(--h))}}
@keyframes tec-trace{from{transform:scaleY(0)}}
@keyframes tec-voile{from{opacity:0}}

.tec-escalier svg,.tec-relie{fill:none}
.tec-relie *{vector-effect:non-scaling-stroke}
.tec-dep{stroke:var(--color-txt-secondary);stroke-dasharray:2 4;animation:fh-derive 7s linear infinite}
.tec-bord,.tec-epars{stroke:var(--color-txt-secondary)}
.tec-epars{fill:rgba(159,176,196,.05)}
.tec-socle{stroke:var(--color-primary);stroke-opacity:.6}
.tec-bati{stroke:var(--color-primary)}
.tec-bati{fill:rgba(63,211,216,.05)}
.tec-rivets{fill:var(--color-primary)}
.fh-anim:not(.is-visible) .tec-marche{stroke-dashoffset:1}

.tec-plan{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:var(--trait) solid var(--color-hairline);border-left:var(--trait) solid var(--color-hairline)}
.tec-case{border-right:var(--trait) solid var(--color-hairline);border-bottom:var(--trait) solid var(--color-hairline)}
.tec-case::after{content:"";position:absolute;right:-5px;bottom:-5px;width:9px;height:9px;background:linear-gradient(var(--color-primary),var(--color-primary)) 50%/1px 100% no-repeat,linear-gradient(var(--color-primary),var(--color-primary)) 50%/100% 1px no-repeat}
.tec-fondation{grid-column:1/-1;background:repeating-linear-gradient(135deg,rgba(63,211,216,.06) 0 1px,transparent 1px 9px)}
.tec-mesure{max-width:22ch}

.tec-escalier{position:sticky;top:120px}
.tec-marche{stroke:var(--color-bleu);stroke-width:1.4;stroke-dasharray:1 1;transition:stroke-dashoffset 1s var(--ease)}
.tec-marche:nth-of-type(3){transition-delay:.35s}
.tec-marche:nth-of-type(4){transition-delay:.7s}
.tec-evo{stroke:var(--color-violet);stroke-dasharray:2 4;animation:fh-derive 7s linear infinite}
.tec-modules{stroke:var(--color-bleu);fill:rgba(86,166,255,.08)}
.tec-coins{fill:var(--color-bleu)}
.tec-evo-coin{fill:var(--color-violet)}
.tec-evo-objets{stroke:var(--color-violet)}
.tec-evo-date{fill:var(--color-violet);font-family:var(--font-accent);font-size:13px;letter-spacing:.14em}
.tec-bid-nom{text-decoration:underline var(--trait) var(--color-bleu);text-underline-offset:.16em}
.tec-btn-bid{--accent:var(--color-bleu)}
.tec-suivante{border:var(--trait) dashed rgba(169,140,255,.45)}

.tec-membrure,.tec-noeud{stroke:var(--color-bleu)}
.tec-treillis{stroke:var(--color-bleu);stroke-opacity:.4}
.tec-cpt,.tec-cnx{stroke-opacity:.7}
.tec-cpt,.tec-flux-cpt{stroke:var(--tq)}
.tec-cnx,.tec-flux-cnx{stroke:var(--color-orange)}
.tec-flux{stroke-dasharray:2 4;animation:fh-derive 7s linear infinite}
.tec-avenir{stroke:var(--color-txt-secondary)}
.tec-noeud{fill:var(--background-color);animation:fh-allume 12s ease-in-out infinite}
.tec-m1{--f:color-mix(in srgb,var(--tq) 40%,var(--background-color))}
.tec-m2{--f:color-mix(in srgb,var(--color-orange) 40%,var(--background-color));animation-delay:4s}
.tec-m3{--f:color-mix(in srgb,var(--color-primary) 30%,var(--background-color));stroke:var(--color-primary);animation-delay:8s}
.tec-t1{fill:var(--tq)}.tec-t2{fill:var(--color-bleu)}.tec-t3{fill:var(--color-orange)}
.tec-legende li::before{content:"";width:2rem;height:1px;background:var(--color-bleu)}
.tec-legende li:nth-child(2)::before{background:repeating-linear-gradient(90deg,var(--tq) 0 2px,transparent 2px 6px)}
.tec-legende li:nth-child(3)::before{background:repeating-linear-gradient(90deg,var(--color-orange) 0 2px,transparent 2px 6px)}

.tec-annonce{--ligne:var(--color-violet)}
.tec-annonce::before{border-style:solid}

@media (max-width:900px){
  .tec-plan{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tec-escalier{grid-row:2;position:relative;top:0}
}
@media (max-width:560px){
  .tec-plan{grid-template-columns:minmax(0,1fr)}
}