/* =========================================
   Weather Sponsor (Premium card)
   Uses your existing HTML structure
   ========================================= */

.wx-sponsor{
  display:block;
  width:100%;
  box-sizing:border-box;

  margin: 14px 0 18px 0;
  padding: 14px 16px;

  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.10);

  /* richer background + subtle depth */
  background: linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%);
  box-shadow: 0 6px 18px rgba(0,0,0,.08);

  text-align:left;
  font-weight: 400;

  /* subtle left accent to feel "sponsored" */
  position: relative;
}

.wx-sponsor:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  border-radius: 12px 0 0 12px;
  background: #1f6feb; /* sponsor accent */
  opacity: .9;
}

/* Give content some breathing room away from the accent bar */
.wx-sponsor-head,
.wx-sponsor-body,
.wx-sponsor-cta{
  margin-left: 6px;
}

/* Title */
.wx-sponsor-head{
  font-size: 17px;
  font-weight: 800;
  line-height: 1.2;
  color: #0f172a;
  margin-bottom: 6px;
}

/* Body copy */
.wx-sponsor-body{
  font-size: 15.5px;
  line-height: 1.35;
  color: #334155;
  margin-bottom: 12px;
  max-width: 70ch;
}

/* CTA button (real button feel) */
.wx-sponsor-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  padding: 9px 14px;
  border-radius: 10px;
  border: 0;

  background: #1f6feb;
  color: #fff !important;

  text-decoration: none;
  font-size: 15px;
  font-weight: 800;
  line-height: 1;

  box-shadow: 0 6px 14px rgba(31,111,235,.22);
  text-shadow: none !important;
}

.wx-sponsor-cta:hover,
.wx-sponsor-cta:focus{
  background: #1858c7;
  text-decoration: none;
}

/* Keep links from inheriting odd styles */
.wx-sponsor a{ text-decoration:none; }

/* Mobile */
@media (max-width: 520px){
  .wx-sponsor{
    padding: 14px 14px;
  }
  .wx-sponsor-body{
    max-width: none;
  }
  .wx-sponsor-cta{
    width: 100%;
  }
}

/* Compact (header / tight areas) */
.wx-sponsor-compact{
  display:inline-block;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:14px;
  line-height:1.2;
}

.wx-sponsor-compact a{
  font-weight:800;
  color:#0f172a;
  text-decoration:none;
}

.wx-sponsor-compact a:hover,
.wx-sponsor-compact a:focus{
  text-decoration:underline;
}

/* Branding line */
.wx-sponsor-branding{
  margin: 10px 0 12px 0;
  font-size: 15px;
  color: #475569;
}

.wx-sponsor-branding-label{
  font-weight: 700;
  color: #64748b;
}

.wx-sponsor-branding-link{
  font-weight: 900;
  color: #0f172a;
  text-decoration: none;
}

.wx-sponsor-branding-link:hover,
.wx-sponsor-branding-link:focus{
  text-decoration: underline;
}

.menu-weather-link .wx-sponsor-branding{
  display:block;
  padding-left:12px;
  font-size:11px !important;
  line-height:1.2;
}

.menu-weather-link .wx-sponsor-branding a,
.menu-weather-link .wx-sponsor-branding .wx-sponsor-branding-link{
  font-size:11px !important;
}