/* =========================================================
   DEUTSCH GO — BRANDED FLOATING WHATSAPP V2
   Default: Deutsch Go brand mark
   Hover: expands into WhatsApp action
========================================================= */

:root{
  --dg-wa2-navy:#071b28;
  --dg-wa2-petrol:#123b4a;
  --dg-wa2-yellow:#f4c542;
  --dg-wa2-paper:#fff8f1;
  --dg-wa2-green:#25d366;
}

#deutschgoWhatsappFloat{
  position:fixed;
  right:22px;
  bottom:22px;

  z-index:2147482000;

  width:64px;
  height:64px;

  direction:ltr;
}

#deutschgoWhatsappFloat .dg-wa2{
  position:absolute;
  right:0;
  bottom:0;

  width:64px;
  height:64px;

  display:flex;
  align-items:center;
  justify-content:flex-end;

  overflow:hidden;

  border:1px solid rgba(244,197,66,.32);
  border-radius:20px;

  color:var(--dg-wa2-paper);
  background:
    radial-gradient(circle at 25% 20%,rgba(244,197,66,.14),transparent 35%),
    linear-gradient(145deg,var(--dg-wa2-petrol),var(--dg-wa2-navy));

  box-shadow:
    0 18px 42px rgba(0,0,0,.26),
    0 0 0 1px rgba(255,255,255,.025) inset,
    inset 0 1px 0 rgba(255,255,255,.08);

  text-decoration:none!important;

  transition:
    width .32s cubic-bezier(.22,.8,.28,1),
    border-color .25s ease,
    background .25s ease,
    box-shadow .25s ease,
    transform .25s ease;
}

#deutschgoWhatsappFloat .dg-wa2::before{
  content:"";

  position:absolute;
  inset:-7px;

  border:1px solid rgba(244,197,66,.26);
  border-radius:26px;

  opacity:.75;

  animation:dgWa2Pulse 2.6s ease-out infinite;

  pointer-events:none;
}

/* Deutsch Go mark shown by default */
#deutschgoWhatsappFloat .dg-wa2__brand{
  position:absolute;
  right:8px;
  top:8px;

  width:46px;
  height:46px;

  display:flex;
  align-items:center;
  justify-content:center;

  flex:0 0 46px;

  border:1px solid rgba(255,255,255,.09);
  border-radius:15px;

  background:
    linear-gradient(145deg,rgba(244,197,66,.12),rgba(255,255,255,.02));

  overflow:hidden;

  transition:
    opacity .22s ease,
    transform .28s ease;
}

#deutschgoWhatsappFloat .dg-wa2__brand img{
  width:39px;
  height:39px;

  object-fit:contain;

  filter:
    drop-shadow(0 4px 9px rgba(0,0,0,.18))
    saturate(1.05);

  transform:translateY(1px);
}

/* Expanded content */
#deutschgoWhatsappFloat .dg-wa2__content{
  position:absolute;
  left:15px;
  right:68px;
  top:50%;

  display:flex;
  align-items:center;
  gap:10px;

  transform:translateY(-50%) translateX(14px);

  opacity:0;
  visibility:hidden;

  transition:
    opacity .20s ease .05s,
    visibility .20s ease .05s,
    transform .28s ease .05s;
}

#deutschgoWhatsappFloat .dg-wa2__whatsapp{
  width:31px;
  height:31px;

  flex:0 0 31px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:10px;

  color:#fff;
  background:var(--dg-wa2-green);

  box-shadow:0 8px 18px rgba(37,211,102,.28);
}

#deutschgoWhatsappFloat .dg-wa2__whatsapp svg{
  width:18px;
  height:18px;
  fill:currentColor;
}

#deutschgoWhatsappFloat .dg-wa2__copy{
  min-width:0;

  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

#deutschgoWhatsappFloat .dg-wa2__eyebrow{
  color:var(--dg-wa2-yellow);

  font-size:8px;
  line-height:1;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}

#deutschgoWhatsappFloat .dg-wa2__text{
  margin-top:5px;

  color:var(--dg-wa2-paper);

  font-size:12px;
  line-height:1.15;
  font-weight:800;

  white-space:nowrap;
}

#deutschgoWhatsappFloat .dg-wa2:hover,
#deutschgoWhatsappFloat .dg-wa2:focus-visible{
  width:222px;

  border-color:rgba(37,211,102,.52);

  background:
    radial-gradient(circle at 18% 18%,rgba(37,211,102,.12),transparent 32%),
    linear-gradient(145deg,var(--dg-wa2-petrol),var(--dg-wa2-navy));

  box-shadow:
    0 20px 48px rgba(0,0,0,.30),
    0 12px 28px rgba(37,211,102,.14),
    inset 0 1px 0 rgba(255,255,255,.10);

  transform:translateY(-3px);
}

#deutschgoWhatsappFloat .dg-wa2:hover .dg-wa2__brand,
#deutschgoWhatsappFloat .dg-wa2:focus-visible .dg-wa2__brand{
  opacity:.16;
  transform:scale(.9) rotate(-4deg);
}

#deutschgoWhatsappFloat .dg-wa2:hover .dg-wa2__content,
#deutschgoWhatsappFloat .dg-wa2:focus-visible .dg-wa2__content{
  opacity:1;
  visibility:visible;
  transform:translateY(-50%) translateX(0);
}

#deutschgoWhatsappFloat .dg-wa2:focus-visible{
  outline:3px solid rgba(244,197,66,.76);
  outline-offset:4px;
}

@keyframes dgWa2Pulse{
  0%{
    transform:scale(.94);
    opacity:.62;
  }
  72%{
    transform:scale(1.13);
    opacity:0;
  }
  100%{
    transform:scale(1.13);
    opacity:0;
  }
}

/* Phone: compact branded mark, tap opens WhatsApp */
@media(max-width:768px){
  #deutschgoWhatsappFloat{
    right:14px;
    bottom:84px;

    width:58px;
    height:58px;
  }

  #deutschgoWhatsappFloat .dg-wa2{
    width:58px!important;
    height:58px;

    border-radius:18px;

    transform:none!important;
  }

  #deutschgoWhatsappFloat .dg-wa2__brand{
    right:7px;
    top:7px;

    width:42px;
    height:42px;

    border-radius:14px;
  }

  #deutschgoWhatsappFloat .dg-wa2__brand img{
    width:35px;
    height:35px;
  }

  #deutschgoWhatsappFloat .dg-wa2__content{
    display:none!important;
  }
}

@media(min-width:769px) and (max-width:1200px) and (orientation:portrait){
  #deutschgoWhatsappFloat{
    right:18px;
    bottom:24px;
  }
}

@media(prefers-reduced-motion:reduce){
  #deutschgoWhatsappFloat *,
  #deutschgoWhatsappFloat *::before,
  #deutschgoWhatsappFloat *::after{
    animation:none!important;
    transition:none!important;
  }
}

/* =========================================================
   CUSTOMER SUPPORT LABEL — V3
========================================================= */

#deutschgoWhatsappFloat .dg-wa2__support-tag{
  position:absolute;
  left:50%;
  bottom:3px;

  transform:translateX(-50%);

  min-width:34px;
  height:14px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:0 6px;

  border:1px solid rgba(244,197,66,.34);
  border-radius:999px;

  color:var(--dg-wa2-navy);
  background:var(--dg-wa2-yellow);

  font-size:7px;
  line-height:1;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;

  box-shadow:
    0 5px 12px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.38);

  z-index:3;
  pointer-events:none;

  transition:
    opacity .20s ease,
    transform .24s ease;
}

#deutschgoWhatsappFloat .dg-wa2:hover .dg-wa2__support-tag,
#deutschgoWhatsappFloat .dg-wa2:focus-visible .dg-wa2__support-tag{
  opacity:0;
  transform:translateX(-50%) translateY(4px) scale(.92);
}

/* Give the brand mark enough room for the ASK tag */
#deutschgoWhatsappFloat .dg-wa2__brand img{
  transform:translateY(-2px) !important;
}

/* Phone sizing */
@media(max-width:768px){
  #deutschgoWhatsappFloat .dg-wa2__support-tag{
    bottom:2px;

    min-width:31px;
    height:13px;

    padding:0 5px;

    font-size:6.5px;
  }

  #deutschgoWhatsappFloat .dg-wa2__brand img{
    transform:translateY(-2px) !important;
  }
}