/* ==========================================================
   SITE-WIDE OVERRIDES
   Loaded last (after responsive.css) so these win over the theme.
   ========================================================== */

/* ---------- Body text: standard size & weight ---------- */
body {
  font-weight: 400;
}

/* one standard size for body copy: plain <p>, .p-md and list items all match */
p,
p.p-md,
ul.txt-list li,
ul.ico-list li {
  font-size: 1.1rem;        /* 17.6px (was 16.8px / 18px) */
  line-height: 1.8;
}

/* section intros (e.g. About BLDEA on the home page) were light grey #888 */
.section-title p {
  color: #283034;
}

@media (max-width: 991.95px) {
  p,
  p.p-md,
  ul.txt-list li,
  ul.ico-list li {
    font-size: 1.05rem;
  }
}

/* ---------- Primary button (Know More, etc.) ----------
   Same look as the home-page Library button: navy -> rose gradient
   with a sliding arrow. Applies to every .btn-rose on the site. */
.btn.btn-rose,
.scroll .btn.btn-rose,
.white-color .btn.btn-rose {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #fff !important;
  border: 0 !important;
  border-radius: 10px;
  background: linear-gradient(90deg, #253993, #ff1f59);
  box-shadow: 0 12px 24px -12px rgba(255, 31, 89, .7);
  transition: transform .25s, box-shadow .25s;
}

.btn.btn-rose::after {
  content: "\f061";                         /* Font Awesome arrow-right */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: .85em;
  transition: transform .25s;
}

/* override the theme's transparent "tra-*-hover" states */
.btn.btn-rose:hover,
.btn.btn-rose:focus,
.btn.btn-rose.tra-black-hover:hover,
.btn.btn-rose.tra-white-hover:hover {
  color: #fff !important;
  border: 0 !important;
  background: linear-gradient(90deg, #253993, #ff1f59);
  transform: translateY(-2px);
  box-shadow: 0 16px 30px -12px rgba(255, 31, 89, .8);
}

.btn.btn-rose:hover::after {
  transform: translateX(4px);
}

/* ---------- Grey section background (home page: About BLDEA, News & Events, etc.) ----------
   Theme default #f8f9fb was barely distinguishable from white. */
.bg-lightgrey {
  background-color: #e8ecf4;
}

/* ---------- Back-to-top button with scroll progress ring ----------
   --sp (0 to 1) is set by the scroll script in footer.php. */
#scrollUp {
  --sp: 0;
  width: 52px;
  height: 52px;
  right: 30px;
  bottom: 30px;
  border-radius: 50%;
  background: conic-gradient(#ff1f59 calc(var(--sp) * 360deg), #dfe4ee 0);
  box-shadow: 0 12px 26px -10px rgba(29, 42, 91, .55);
  transition: transform .25s, box-shadow .25s;
}

/* inner white disc, leaving a 4px ring of progress around it */
#scrollUp::before {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background: #fff;
  transition: background .25s;
}

/* arrow */
#scrollUp::after {
  content: "\f062";                         /* Font Awesome arrow-up */
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 1rem;
  color: #1d2a5b;
  transition: color .25s, transform .25s;
}

#scrollUp:hover {
  background: conic-gradient(#ff1f59 calc(var(--sp) * 360deg), #dfe4ee 0);
  transform: translateY(-3px);
  box-shadow: 0 16px 30px -10px rgba(255, 31, 89, .55);
}

#scrollUp:hover::before {
  background: #1d2a5b;
}

#scrollUp:hover::after {
  color: #fff;
  transform: translateY(-2px);
}

@media (max-width: 767px) {
  #scrollUp {
    width: 46px;
    height: 46px;
    right: 16px;
    bottom: 16px;
  }
}
