/* ===========================================================
   header.css — hero top bar (buttons + week badge)
   These live INSIDE the hero stage (campaign LP, no sticky nav).
   =========================================================== */

/* top-left action buttons cluster */
.hero__topnav {
  position: absolute;
  left: 260px;
  top: 86px;
  display: flex;
  gap: 13px;
  direction: ltr;            /* keep "קבל עדכון" right of "שתפו חבר" as in Figma */
}
.hero__topnav .btn { height: 54px; padding: 0 26px; font-size: 34px; line-height: 40px; letter-spacing: 1.02px; }
.hero__topnav .btn--update { order: 2; }   /* filled, visual right */
.hero__topnav .btn--share  { order: 1; }   /* outlined, visual left */
.hero__topnav .btn--share .btn__icon { width: 24px; height: 24px; }

/* Figma comment hovers: update→white, share→green #32D851 */
.hero__topnav .btn--update:hover { background: var(--white); color: var(--navy); }
.hero__topnav .btn--share:hover  { background: #32d851; border-color: #32d851; color: var(--white); }
.hero__topnav .btn--share:hover .btn__icon img { filter: brightness(0) invert(1); }

/* top-right week progress badge */
.hero__badge {
  position: absolute;
  left: 1407px;
  top: 28px;
  width: 250px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--blue-100);
  color: var(--navy);
  border-radius: var(--r-sm);
  font-family: var(--font-display);
  font-weight: var(--w-bold);
  font-size: 36px;
  line-height: 40px;
  letter-spacing: 0.72px;
}