.elementor-6944 .elementor-element.elementor-element-2fd6c96:hover > .elementor-background-overlay{opacity:0.5;}.elementor-6944 .elementor-element.elementor-element-cad1eb3{text-align:center;}.elementor-6944 .elementor-element.elementor-element-cad1eb3 .elementor-heading-title{color:var( --e-global-color-4827640 );}/* Start custom CSS *//* Page background + default typography */
body {
  background: #f5f6f8;
}

/* Makes Elementor canvas look centered + premium spacing */
.donate-page {
  max-width: 1100px;
  margin: 0 auto;
  padding: 48px 16px;
}

/* A “card” wrapper look for sections */
.donate-card {
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
  border: 1px solid rgba(0,0,0,0.06);
}

/* Hero section with background image overlay */
.donate-hero {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  min-height: 420px;
  display: flex;
  align-items: center;
}

/* Put your hero image URL here */
.donate-hero {
  background-image: url(https://topteff.com/wp-content/uploads/2026/02/generated-image.jpeg); 
  background-size: cover;
  background-position: center;
}

/* Dark overlay so text is readable */
.donate-hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,0.70) 0%, rgba(0,0,0,0.35) 55%, rgba(0,0,0,0.15) 100%);
}

/* Hero content sits above overlay */
.donate-hero .elementor-container,
.donate-hero .elementor-widget-wrap {
  position: relative;
  z-index: 2;
}

/* Hero text styling */
.donate-hero h1,
.donate-hero h2,
.donate-hero p,
.donate-hero span {
  color: #fff !important;
}

.donate-hero h1 {
  letter-spacing: -0.02em;
  line-height: 1.05;
}

/* Buttons look consistent */
.donate-btn .elementor-button {
  border-radius: 14px !important;
  padding: 16px 18px !important;
  font-weight: 700 !important;
}

.donate-btn.primary .elementor-button {
  background: #111 !important;
  color: #fff !important;
  border: 1px solid #111 !important;
}

.donate-btn.secondary .elementor-button {
  background: rgba(255,255,255,0.12) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.35) !important;
  backdrop-filter: blur(6px);
}

/* Section titles */
.donate-section-title h2 {
  letter-spacing: -0.01em;
  line-height: 1.15;
}

/* 3 “amount” buttons grid – looks like donation UI */
.donate-amounts .elementor-button {
  width: 100% !important;
}
.donate-amounts .elementor-button-wrapper {
  width: 100%;
}
.donate-amounts .elementor-button {
  border-radius: 14px !important;
  padding: 18px 18px !important;
  font-weight: 750 !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
  background: #ffffff !important;
  color: #111 !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06);
}
.donate-amounts .elementor-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(0,0,0,0.10);
}

/* Carousel section spacing + subtle framing */
.donate-carousel {
  margin-top: 22px;
}
.donate-carousel .swiper,
.donate-carousel .elementor-swiper {
  border-radius: 18px;
  overflow: hidden;
}
.donate-carousel img {
  border-radius: 18px;
}

/* Simple info cards */
.donate-info .elementor-widget-wrap {
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  padding: 22px;
}/* End custom CSS */