/* Digi-Market floating hub: one button for WhatsApp, phone, accessibility and cookie settings.
   Closed it is an aperture; it opens, and the actions rise out of it as liquid that settles into buttons.
   It sits on the LEFT of the screen (Tom, 4.11.26); the chat bot keeps the right corner to itself.
   The class "dm-fab dmr" stays on the box: the WhatsApp lead widget and the header menu key on it. */
.dm-fab:not(.dmr){visibility:hidden!important}
.dm-fab.dmhub{--s:64px;--ic:46px;--navy:#0B1F45;--blue:#2E5FD1;--hot:#F26522;--ease:cubic-bezier(.19,1,.22,1);--spring:cubic-bezier(.34,1.45,.55,1);position:fixed;inset-inline-start:auto;inset-inline-end:22px;z-index:60;display:none;width:var(--s);height:var(--s);font-family:'Rubik',var(--font,sans-serif);-webkit-tap-highlight-color:transparent;pointer-events:none!important}
/* theme.css lifts .dm-fab above the bot (82px); on the left there is no bot, so it sits low */
html body .dm-fab.dmhub{bottom:22px!important}
/* the cookie bar opens bottom-left: rise above it (its height is measured into --pvlift by the site) */
.pv-open .dm-fab.dmhub{transform:translateY(calc(-1 * var(--pvlift,0px)));transition:transform .3s}
/* printed on every page, shown only where the page has the old floats */
body:has(.dm-fab:not(.dmr)) .dm-fab.dmhub{display:block}
/* the other floats live inside the hub now (only where the hub shows: offers keep their cookie button) */
body:has(.dm-fab:not(.dmr)) .pv-float{display:none!important}

/* ---------- the trigger: an aperture in a glass orb ---------- */
.dmhub-go{all:unset;box-sizing:border-box;position:absolute;inset:0;border-radius:50%;cursor:pointer;pointer-events:auto;z-index:3;display:grid;place-items:center;isolation:isolate;
  background:radial-gradient(circle at 34% 26%,#2C4C93 0%,#122B5C 46%,#071433 100%);
  box-shadow:0 22px 44px -18px rgba(11,31,69,.85),0 0 0 1px rgba(255,255,255,.12) inset,0 10px 24px -14px rgba(242,101,34,.55);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
/* slow aurora ring around the orb */
.dmhub-go::before{content:"";position:absolute;inset:-3px;border-radius:50%;z-index:-1;padding:2px;
  background:conic-gradient(from var(--dmhub-a,0deg),#F26522,#E8457A,#2E5FD1,#22C1EE,#25D366,#F26522);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:dmhub-aurora 7s linear infinite;opacity:.95}
@property --dmhub-a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes dmhub-aurora{to{--dmhub-a:360deg}}
.dmhub-go:hover{transform:scale(1.06)}
.dmhub-go:focus-visible{outline:3px solid #2E5FD1;outline-offset:5px}
.dmhub-iris{position:absolute;inset:7px;width:calc(100% - 14px);height:calc(100% - 14px);overflow:visible;pointer-events:none}
.dmhub-iris .bl{transform:rotate(calc(var(--k) * 60deg));transition:transform .62s var(--ease),opacity .4s}
.dmhub-iris .bl path{fill:url(#dmhub-blade);stroke:rgba(255,255,255,.22);stroke-width:.8}
.dmhub-iris .rim{fill:none;stroke:rgba(255,255,255,.16);stroke-width:1.2}
.dmhub-core{position:absolute;width:22px;height:22px;border-radius:50%;z-index:2;display:grid;place-items:center;color:#fff;
  background:radial-gradient(circle at 35% 30%,#FFB27D,#F26522 55%,#C2410C);box-shadow:0 0 18px 4px rgba(242,101,34,.55);
  transition:transform .55s var(--spring),background .4s}
.dmhub-core svg{width:13px;height:13px;transition:opacity .25s,transform .45s var(--ease)}
.dmhub-core .x{position:absolute;opacity:0;transform:rotate(-90deg) scale(.5)}
/* hover: the aperture breathes open a little */
@media (hover:hover) and (pointer:fine){
  .dm-fab.dmhub:not(.on) .dmhub-go:hover .bl{transform:rotate(calc(var(--k) * 60deg + 14deg))}
}
.dmhub-live{position:absolute;top:3px;inset-inline-start:3px;width:12px;height:12px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 2.5px #fff;z-index:4;pointer-events:none;transition:opacity .3s}

/* ---------- the liquid: blobs under a goo filter ---------- */
.dmhub-goo{position:absolute;left:50%;top:50%;width:0;height:0;filter:url(#dmhub-goo);pointer-events:none;z-index:1}
.dmhub-blob{position:absolute;left:0;top:0;width:var(--ic);height:var(--ic);margin:calc(var(--ic) / -2) 0 0 calc(var(--ic) / -2);border-radius:50%;background:var(--c,#16306A);
  transform:translate(0,0) scale(.35);opacity:0;transition:transform .7s var(--spring),opacity .2s}
.dmhub-blob.c{width:var(--s);height:var(--s);margin:calc(var(--s) / -2) 0 0 calc(var(--s) / -2);transform:none;opacity:1;background:#0E2350}
.dmhub-blob.t{--c:#F26522;width:28px;height:28px;margin:-14px 0 0 -14px}

/* ---------- the actions (sharp layer, same positions as the blobs) ---------- */
.dmhub-acts{list-style:none;margin:0;padding:0;position:absolute;left:50%;top:50%;width:0;height:0;z-index:2}
.dmhub-acts li{position:absolute;left:0;top:0;margin:0;padding:0}
/* icon on the left, label to its right (toward the page) */
.dmhub-it{all:unset;box-sizing:border-box;position:absolute;top:calc(var(--ic) / -2);inset-inline-end:calc(var(--ic) / -2);display:flex;align-items:center;gap:10px;flex-direction:row-reverse;cursor:pointer;
  transform:translate(var(--x),var(--y));pointer-events:none;white-space:nowrap}
[dir=rtl] .dmhub-it,.dmhub-it{direction:rtl}
.dmhub-ic{flex:none;width:var(--ic);height:var(--ic);border-radius:50%;display:grid;place-items:center;color:#fff;
  box-shadow:0 14px 28px -12px rgba(11,31,69,.8),inset 0 1px 0 rgba(255,255,255,.35),inset 0 0 0 1px rgba(255,255,255,.14);
  opacity:0;transform:scale(.4);transition:opacity .3s,transform .5s var(--spring)}
.dmhub-ic svg{width:21px;height:21px}
.dmhub-wa .dmhub-ic{background:radial-gradient(circle at 35% 28%,#5BEA92,#25D366 52%,#128C4E)}
.dmhub-ph .dmhub-ic{background:radial-gradient(circle at 35% 28%,#FFB27D,#F26522 52%,#B9400E)}
.dmhub-ax .dmhub-ic{background:radial-gradient(circle at 35% 28%,#7FA4FF,#2E5FD1 52%,#1A3C93)}
.dmhub-ck .dmhub-ic{background:radial-gradient(circle at 35% 28%,#C8A27C,#8A5A2B 55%,#5B3613)}
.dmhub-lb{padding-block:9px;padding-inline:14px;border-radius:999px;font-weight:800;font-size:.86rem;line-height:1;color:#0B1F45;letter-spacing:-.01em;
  background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(14px) saturate(1.5);backdrop-filter:blur(14px) saturate(1.5);
  box-shadow:0 16px 32px -16px rgba(11,31,69,.6),inset 0 0 0 1px rgba(255,255,255,.95),0 0 0 1px rgba(11,31,69,.06);
  opacity:0;clip-path:inset(0 100% 0 0 round 999px);transform:translateX(-10px);transition:opacity .25s,clip-path .5s var(--ease),transform .5s var(--ease)}
.dmhub-it:hover .dmhub-ic{transform:scale(1.08)}
.dmhub-it:hover .dmhub-lb{box-shadow:0 18px 34px -14px rgba(11,31,69,.7),inset 0 0 0 1px #fff,0 0 0 1px rgba(46,95,209,.35)}
.dmhub-it:focus-visible .dmhub-ic{outline:3px solid #2E5FD1;outline-offset:3px}

/* ---------- soft spotlight behind the open hub ---------- */
.dmhub-veil{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .5s var(--ease);
  background:radial-gradient(circle at 54px calc(100% - 140px),rgba(11,31,69,.28),rgba(11,31,69,.08) 340px,transparent 560px)}

/* ---------- open ---------- */
.dm-fab.dmhub.on .dmhub-veil{opacity:1}
.dm-fab.dmhub.on .bl{transform:rotate(calc(var(--k) * 60deg + 52deg)) scale(.62);opacity:.55}
.dm-fab.dmhub.on .dmhub-core{transform:scale(1.45)}
.dm-fab.dmhub.on .dmhub-core .ic{opacity:0;transform:rotate(90deg) scale(.5)}
.dm-fab.dmhub.on .dmhub-core .x{opacity:1;transform:none}
.dm-fab.dmhub.on .dmhub-live{opacity:0}
.dm-fab.dmhub.on .dmhub-blob:not(.c){opacity:1;transform:translate(var(--x),var(--y)) scale(1);transition-delay:calc(var(--i) * 70ms)}
.dm-fab.dmhub.on .dmhub-it{pointer-events:auto}
.dm-fab.dmhub.on .dmhub-ic{opacity:1;transform:none;transition-delay:calc(var(--i) * 70ms + 330ms)}
.dm-fab.dmhub.on .dmhub-lb{opacity:1;clip-path:inset(0 0 0 0 round 999px);transform:none;transition-delay:calc(var(--i) * 70ms + 420ms)}
/* closing runs faster and in reverse order */
.dm-fab.dmhub:not(.on) .dmhub-blob{transition-duration:.42s;transition-timing-function:var(--ease);transition-delay:calc((3 - var(--i)) * 40ms + 120ms)}
.dm-fab.dmhub:not(.on) .dmhub-ic,.dm-fab.dmhub:not(.on) .dmhub-lb{transition-duration:.18s;transition-delay:0s}

/* ---------- one quiet teaser: a single drop rises and falls back ---------- */
.dmhub-blob.t{opacity:0}
.dm-fab.dmhub.hey .dmhub-blob.t{animation:dmhub-drip 1.5s var(--ease) 1}
@keyframes dmhub-drip{0%{opacity:1;transform:translate(0,0) scale(.4)}45%{opacity:1;transform:translate(0,-52px) scale(.55)}100%{opacity:1;transform:translate(0,0) scale(.3)}}

@media (max-width:640px){
  .dm-fab.dmhub{--s:58px;--ic:44px;inset-inline-end:16px}
  .dmhub-lb{font-size:.82rem;padding-inline:12px}
}
@media (prefers-reduced-motion:reduce){
  .dmhub-go::before{animation:none}
  .dmhub-goo{display:none}
  .dmhub-iris .bl,.dmhub-core,.dmhub-ic,.dmhub-lb,.dmhub-veil{transition:opacity .01s!important}
  .dmhub-lb{clip-path:none;transform:none}
  .dmhub-ic{transform:none}
}
@media print{.dm-fab{display:none!important}}
