/*
 * Shared treatment for the legacy .calltoact panels.
 * Kept separate from the general legacy stylesheet to avoid altering content
 * cards that happen to use the older .blocks class.
 */
.my_right_box:has(.calltoact) {
  top: 28px !important;
  width: 250px !important;
  gap: 14px;
}

.center-content:has(> .my_right_box:has(.calltoact)) {
  padding-right: 310px !important;
}

.calltoact {
  width: 100% !important;
  margin: 0 !important;
  padding: 20px !important;
  border: 1px solid rgba(148, 211, 239, 0.24) !important;
  border-radius: 18px !important;
  color: #edf7fc !important;
  background: linear-gradient(145deg, #173a55, #10283d) !important;
  box-shadow: 0 14px 30px rgba(16, 40, 61, 0.16) !important;
  cursor: pointer;
}

.calltoact:hover,
.calltoact.actover {
  border-color: rgba(125, 211, 252, 0.62) !important;
  background: linear-gradient(145deg, #1d4b6d, #13334d) !important;
  box-shadow: 0 18px 36px rgba(16, 40, 61, 0.22) !important;
}

.calltoact .icon,
.calltoact hr {
  display: none !important;
}

.calltoact .ititle {
  margin: 0 0 9px !important;
  color: #f4fbff !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

.calltoact .text {
  margin: 0 0 17px !important;
  color: #d9edf7 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

.calltoact .learn {
  display: inline-flex !important;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  padding: 0 17px !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: #0070f0 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.calltoact:hover .learn,
.calltoact.actover .learn {
  background: #169bd5 !important;
}

@media (max-width: 760px) {
  .center-content:has(> .my_right_box:has(.calltoact)) {
    padding-right: 24px !important;
  }

  .my_right_box:has(.calltoact) {
    position: static !important;
    top: auto !important;
    width: 100% !important;
    margin-top: 22px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .my_right_box:has(.calltoact) {
    grid-template-columns: 1fr;
  }
}