/* Футер «Форма»: широкие полупрозрачные буквы, свечение, сетка поверх фона, подсветка линий при наведении.
   Подключается после стилей темы; JS (footer-glow.js) задаёт --mx/--my и класс .is-lit. */

#end{--glow:143,124,255;--glow-warm:255,176,114}

/* буквы: шире и плотнее, градиент с прозрачностью, обводка, свечение */
#end .end-word{position:relative;font-weight:400;letter-spacing:-.01em;
  filter:drop-shadow(0 0 14px rgba(var(--glow),.16)) drop-shadow(0 0 52px rgba(var(--glow),.10));transition:filter .5s}
#end .end-word .em,#end .end-word .el{overflow:visible}
#end .end-word .em{padding-inline:.03em}
#end .end-word .el{display:inline-block;transform:scaleX(1.06);transform-origin:center;
  background:linear-gradient(175deg,rgba(245,250,255,.46) 0,rgba(205,225,240,.20) 38%,rgba(175,205,225,.10) 62%,rgba(215,235,245,.24) 100%);
  background-clip:text;-webkit-background-clip:text;color:transparent;
  -webkit-text-stroke:1px rgba(225,242,255,.36);transition:filter .35s}
#end .end-word .em:first-child .el{transform-origin:left center}
#end .end-word .em:last-child .el{transform-origin:right center}
#end .end-word .el:hover{filter:drop-shadow(0 0 10px rgba(var(--glow),.40)) drop-shadow(0 0 28px rgba(var(--glow-warm),.14))}

/* мягкий свет вокруг слова, подсвечивает пространство */
#end .end-word::before{content:"";position:absolute;z-index:-1;inset:-35% -6%;pointer-events:none;
  background:radial-gradient(55% 70% at 50% 50%,rgba(var(--glow),.12),rgba(var(--glow),.04) 55%,transparent 75%);
  filter:blur(24px);animation:endAura 9s ease-in-out infinite alternate}
@keyframes endAura{from{opacity:.7;transform:scale(.98)}to{opacity:1;transform:scale(1.03)}}

/* CRAFT.STUDIO: тот же свет, тише */
#end .end-craft{filter:drop-shadow(0 0 12px rgba(var(--glow),.10))}

/* сетка поверх реальности: едва видна, у курсора проявляется */
#end .end-bg::after,#end .end-bg::before{content:"";position:absolute;inset:0;pointer-events:none;background-size:64px 64px}
#end .end-bg::after{background-image:linear-gradient(rgba(185,169,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(185,169,255,.055) 1px,transparent 1px);
  -webkit-mask-image:radial-gradient(80% 90% at 50% 38%,#000 20%,transparent 88%);mask-image:radial-gradient(80% 90% at 50% 38%,#000 20%,transparent 88%)}
#end .end-bg::before{z-index:1;opacity:0;transition:opacity .5s;
  background-image:linear-gradient(rgba(var(--glow),.30) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--glow),.30) 1px,transparent 1px);
  -webkit-mask-image:radial-gradient(circle 240px at var(--mx,50%) var(--my,40%),#000,transparent 100%);mask-image:radial-gradient(circle 240px at var(--mx,50%) var(--my,40%),#000,transparent 100%)}
#end.is-lit .end-bg::before,#end:hover .end-bg::before{opacity:1}
#end .end-dots{opacity:.3}

/* линии: при наведении вспыхивают */
#end .end-line{height:1px;transition:transform 1.2s cubic-bezier(.2,.75,.2,1),box-shadow .5s,filter .5s}
#end .end-beam{transition:transform 1.4s cubic-bezier(.2,.75,.2,1),box-shadow .5s,filter .5s}
#end.is-lit .end-line,#end .end-inner:hover .end-line{box-shadow:0 0 14px 1px rgba(var(--glow),.28);filter:brightness(1.15)}
#end.is-lit .end-beam,#end:hover .end-beam{box-shadow:0 0 50px 8px rgba(var(--glow),.30);filter:brightness(1.15)}
#end.is-lit .end-word,#end .end-word:hover{filter:drop-shadow(0 0 16px rgba(var(--glow),.28)) drop-shadow(0 0 64px rgba(var(--glow),.18))}

@media(max-width:700px){#end .end-word .el{transform:scaleX(1.02)}#end .end-bg::after,#end .end-bg::before{background-size:40px 40px}}
@media(prefers-reduced-motion:reduce){#end .end-word::before{animation:none}}

/* далёкая галактика в правом верхнем углу: звёздное небо, подсвечивает футер */
#end .end-sky{position:absolute;inset:-16% -3% 16% 3%;pointer-events:none;background:url("../img/chrome/footer-galaxy-v3.jpg") right top/cover no-repeat;opacity:.9;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 8%,#000 70%,transparent 100%),linear-gradient(90deg,transparent 10%,rgba(0,0,0,.5) 40%,#000 70%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(180deg,transparent 0,#000 8%,#000 70%,transparent 100%),linear-gradient(90deg,transparent 10%,rgba(0,0,0,.5) 40%,#000 70%);mask-composite:intersect}
@media(max-width:700px){#end .end-sky{background-position:70% top;opacity:.7}}

/* стык с телом страницы: фон футера продолжается вверх и растворяется, без среза */
#end{position:relative;overflow:visible}
#end .end-bg{top:-14rem;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.5) 7rem,#000 14rem);mask-image:linear-gradient(180deg,transparent 0,rgba(0,0,0,.5) 7rem,#000 14rem)}
#end .end-sky{top:6rem;bottom:8rem}

/* логотип в шапке: тот же стеклянный почерк, что у слова в футере */
.site-brand{--glow:143,124,255;display:inline-flex;align-items:center;gap:.8rem}
.site-brand .forma-mark{flex:none;filter:drop-shadow(0 0 8px rgba(var(--glow),.28));transition:filter .4s}
.site-brand .forma-mark circle,.site-brand .forma-mark path:last-child{stroke:rgba(225,242,255,.78);stroke-width:1.4}
.site-brand .forma-mark path:nth-child(2){stroke:rgba(185,169,255,.8);stroke-width:1.4}
.site-brand .forma-wordmark{display:flex;flex-direction:column;gap:.18rem;font-weight:400;line-height:1;text-transform:uppercase}
.site-brand .forma-wordmark{font-size:1.28rem;letter-spacing:.34em;margin-right:-.34em;
  background:linear-gradient(175deg,rgba(250,253,255,.95) 0,rgba(205,225,240,.62) 55%,rgba(225,240,250,.8) 100%);
  background-clip:text;-webkit-background-clip:text;color:transparent;
  filter:drop-shadow(0 0 12px rgba(var(--glow),.22));transition:filter .4s}
.site-brand .forma-wordmark span{font-size:.62rem;font-weight:400;letter-spacing:.42em;margin-right:-.42em;
  background:none;-webkit-text-fill-color:rgba(170,190,205,.72);color:rgba(170,190,205,.72)}
.site-brand:hover .forma-wordmark,.site-brand:hover .forma-mark{filter:drop-shadow(0 0 10px rgba(var(--glow),.45)) drop-shadow(0 0 28px rgba(var(--glow),.2))}

/* логотип: плотнее и контрастнее, чтобы читался в шапке */
.site-brand .forma-mark circle,.site-brand .forma-mark path:last-child{stroke:#eaf4ff;stroke-width:2.2}
.site-brand .forma-mark path:nth-child(2){stroke:#b9a9ff;stroke-width:2.2}
.site-brand .forma-mark{filter:drop-shadow(0 0 10px rgba(var(--glow),.45))}
.site-brand .forma-wordmark{font-size:1.55rem;font-weight:600;letter-spacing:.24em;margin-right:-.24em;
  background:linear-gradient(175deg,#fff 0,#dcebf7 55%,#f2f8ff 100%);background-clip:text;-webkit-background-clip:text;
  filter:drop-shadow(0 0 14px rgba(var(--glow),.40))}
.site-brand .forma-wordmark span{font-size:.7rem;font-weight:500;letter-spacing:.36em;margin-right:-.36em;
  -webkit-text-fill-color:#b8cde0;color:#b8cde0}
.site-brand .forma-wordmark span{-webkit-text-fill-color:#b9a9ff;color:#b9a9ff}