/* =========================================================================
   floating contact — fixed bottom-right, Figma 74:7287 (177×127 box, right 16,
   bottom 31). Desktop positions are Figma's own offsets inside that box:
     avatar 62 @ (115,0) · online dot 12 @ (116,6) · DZ 33×17 centred ·
     WhatsApp badge 29 @ (144,47) · bubble 139×30 @ (0,46) drawn above the
     avatar ring · gold phone button 172×44 @ (0,83).
   Below 1100 it becomes a 2-button bar at the bottom.
   ========================================================================= */
.float-contact{position:fixed;right:16px;bottom:31px;z-index:90;width:177px;height:127px}
.float-contact__wa{position:absolute;inset:0 0 auto;height:83px;display:block}

.float-contact__avatar{position:absolute;left:115px;top:0;width:62px;height:62px}
.float-contact__ring{position:absolute;inset:0;width:100%;height:100%}
.float-contact__dz{position:absolute;left:15px;top:21px;width:33px;height:17px}
.float-contact__online{position:absolute;left:1px;top:6px;width:12px;height:12px;border-radius:50%;background:#32d851}
.float-contact__badge{position:absolute;left:29px;top:47px;width:29px;height:29px}

/* bubble — white body 132 + 7px tip pointing at the avatar, grey 1px edge, soft shadow */
.float-contact__bubble{position:absolute;z-index:2;left:0;top:46px;width:132px;height:30px;display:flex;align-items:center;justify-content:center;background:var(--white);border:1px solid #d1d1d1;box-shadow:0 0 10px rgba(0,0,0,.1);font-size:16px;line-height:20px;color:var(--black);white-space:nowrap}
.float-contact__bubble::after{content:"";position:absolute;right:-5px;top:50%;width:9px;height:9px;background:var(--white);border:1px solid #d1d1d1;border-left:0;border-bottom:0;transform:translateY(-50%) rotate(45deg)}
.float-contact__wa:hover .float-contact__bubble,.float-contact__wa:hover .float-contact__bubble::after{background:var(--panel)}

.float-contact__call{position:absolute;left:0;top:83px;display:flex;align-items:center;justify-content:space-between;width:172px;height:44px;padding:0 10px 0 7px;background:var(--gold-dark);color:var(--white);font-family:"Heebo",var(--font);font-weight:700;font-size:21px;line-height:16px;direction:ltr}
.float-contact__call svg{width:18px;height:18px;transform:scaleX(-1)}
.float-contact__call:hover{background:var(--navy)}

/* ---------- tablet + mobile: bottom bar (WhatsApp | phone) -------------- */
@media (max-width:1100px){
  .float-contact{inset:auto 0 0;width:auto;height:auto;display:flex;box-shadow:0 -4px 18px rgba(0,0,0,.18)}
  .float-contact__wa,.float-contact__call{position:relative;inset:auto;flex:1 1 50%;height:58px;width:auto;display:flex;align-items:center;justify-content:center}
  .float-contact__wa{background:var(--navy);gap:10px;padding:0 12px}
  .float-contact__avatar{position:relative;left:auto;top:auto;width:40px;height:40px;flex:0 0 auto}
  .float-contact__dz{left:9px;top:14px;width:22px;height:11px}
  .float-contact__online{width:9px;height:9px;top:3px;left:0}
  .float-contact__badge{width:20px;height:20px;left:auto;right:-6px;top:auto;bottom:-6px}
  .float-contact__bubble{position:static;width:auto;height:auto;background:none;border:0;box-shadow:none;color:var(--white);font-size:17px;font-family:var(--font-display)}
  .float-contact__bubble::after{display:none}
  .float-contact__wa:hover .float-contact__bubble{background:none}
  .float-contact__call{justify-content:center;gap:12px;padding:0 12px;font-size:19px}
}
@media (max-width:640px){
  .float-contact__wa,.float-contact__call{height:54px}
  .float-contact__bubble{font-size:15px}
  .float-contact__call{font-size:17px}
}