/* Approved dot-to-fill interaction, using each tag's editable hover colours. */
.project-tags .project-tag{
 position:relative;isolation:isolate;overflow:hidden;
 --reveal-color:var(--tag-hover-background,#245bff);
 --reveal-ink:var(--tag-hover-color,#fff);
 background:var(--tag-background,#f8f9f9);
 transition:color .22s,border-color .22s;
}
.project-tags .project-tag:after{
 content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:var(--reveal-color);clip-path:circle(0px at 17.5px 50%);
 transition:clip-path .65s cubic-bezier(.22,.75,.2,1);
}
.project-tags .project-tag>.tag-icon{color:var(--reveal-color);transition:color .22s}
.project-tags .project-tag:hover,.project-tags .project-tag:focus-visible{
 background:var(--tag-background,#f8f9f9);
}
.project-tags .project-tag:hover{color:var(--tag-color,#182943);border-color:var(--tag-border,#ced4df)}
.project-tags .project-tag:focus-visible{color:var(--reveal-ink);border-color:var(--reveal-color);outline:2px solid var(--reveal-color);outline-offset:3px}
.project-tags .project-tag:focus-visible:after{clip-path:circle(150% at 17.5px 50%)}
.project-tags .project-tag:focus-visible>.tag-icon{color:var(--reveal-ink)}
@media(min-width:501px) and (max-width:1150px){
 .project-tags .project-tag:after{clip-path:circle(0px at 15.5px 50%)}
 .project-tags .project-tag:focus-visible:after{clip-path:circle(150% at 15.5px 50%)}
}

/* Keep messenger icons and CMS text nodes intact; the fill sits behind them. */
.support-actions .button{
 position:relative;isolation:isolate;overflow:hidden;
 --reveal-color:var(--blue);--reveal-ink:#fff;--reveal-base:#f7f8fa;--reveal-origin:32px;
 background:var(--reveal-base);color:var(--reveal-rest-ink,#171d27);transition:color .22s,border-color .22s,box-shadow .25s;
}
.support-actions .button-outline{--reveal-base:transparent;--reveal-rest-ink:#fff}
.support-actions .button.support-glitch-trigger{
 --reveal-color:var(--glitch-color,#ef797d);--reveal-ink:#17191e;
 --reveal-rest-ink:var(--glitch-color,#ef797d);
 --reveal-base:color-mix(in srgb,var(--glitch-color,#ef797d) 15%,#17191e);
 --reveal-origin:18px;padding-right:36px;
}
.support-actions .button:after{
 content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:var(--reveal-color);clip-path:circle(4.5px at calc(100% - var(--reveal-origin)) 50%);
 transition:clip-path .65s cubic-bezier(.22,.75,.2,1);
}
.support-actions .button:hover,.support-actions .button.support-glitch-trigger:hover{background:var(--reveal-base);color:var(--reveal-rest-ink,#171d27);transform:none}
.support-actions .button:focus-visible{color:var(--reveal-ink);border-color:var(--reveal-color);outline:2px solid #fff;outline-offset:4px}
.support-actions .button:focus-visible:after{clip-path:circle(150% at calc(100% - var(--reveal-origin)) 50%)}
@media(min-width:801px){
 .support-actions .button>span[aria-hidden=true]{opacity:0;transform:scale(.55);transition:opacity .16s,transform .35s cubic-bezier(.16,1,.3,1)}
 .support-actions .button:focus-visible>span[aria-hidden=true]{opacity:1;transform:none}
}
@media(hover:hover) and (pointer:fine){
 .project-tags .project-tag:hover{color:var(--reveal-ink);border-color:var(--reveal-color)}
 .project-tags .project-tag:hover:after{clip-path:circle(150% at 17.5px 50%)}
 .project-tags .project-tag:hover>.tag-icon{color:var(--reveal-ink)}
 .support-actions .button:hover,.support-actions .button.support-glitch-trigger:hover{color:var(--reveal-ink);border-color:var(--reveal-color)}
 .support-actions .button:hover:after{clip-path:circle(150% at calc(100% - var(--reveal-origin)) 50%)}
 .support-actions .button:hover>span[aria-hidden=true]{opacity:1;transform:none;transition-delay:.08s}
}
@media(hover:hover) and (pointer:fine) and (min-width:501px) and (max-width:1150px){.project-tags .project-tag:hover:after{clip-path:circle(150% at 15.5px 50%)}}
@media(max-width:500px){
 .support-price .support-actions .button{--reveal-origin:14px;padding-right:26px}
 .support-price .support-actions .button.support-glitch-trigger{--reveal-origin:18px;padding-right:36px}
}
@media(max-width:360px){
 .support-price .support-actions .button{--reveal-origin:11px;font-size:11px;padding-left:8px;padding-right:21px;gap:5px}
 .support-actions .contact-telegram:before,.support-actions .contact-max-icon{width:16px;height:16px}
}
.motion-off .project-tags .project-tag:after,.motion-off .support-actions .button:after{transition:none}
.cms-no-project-motion .project-tags .project-tag:after{transition:none}
@media(prefers-reduced-motion:reduce){.project-tags .project-tag:after,.support-actions .button:after,.support-actions .button>span[aria-hidden=true]{transition:none}}