.elementor-45 .elementor-element.elementor-element-81b40b6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-3d38be9 *//* ===== Global Section ===== */
.ra-dos-donts {
  background:
    radial-gradient(circle at top, #f1f5f9 0%, #e5e7eb 40%, #e2e8f0 100%);
  padding: 110px 20px;
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  color: #0f172a;
}

/* ===== Main Container ===== */
.ra-container {
  max-width: 1240px;
  margin: auto;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 85px;
  border-radius: 28px;
  position: relative;
  box-shadow:
    0 40px 80px rgba(15, 23, 42, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

/* ===== Premium Accent Header Strip ===== */
.ra-container::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  height: 7px;
  width: 100%;
  background: linear-gradient(
    90deg,
    #16a34a 0%,
    #2563eb 50%,
    #dc2626 100%
  );
  border-radius: 28px 28px 0 0;
}

/* ===== Header ===== */
.ra-header {
  text-align: center;
  margin-bottom: 80px;
}

.ra-header h1 {
  font-size: 42px;
  font-weight: 800;
  letter-spacing: -0.8px;
  margin-bottom: 12px;
  color: #020617;
}

.ra-quote {
  font-size: 18px;
  font-style: italic;
  color: #475569;
  margin-bottom: 14px;
}

.ra-subtitle {
  font-size: 16.5px;
  color: #64748b;
  line-height: 1.75;
}

/* ===== Section Headings ===== */
.ra-content h2 {
  font-size: 25px;
  font-weight: 700;
  margin: 60px 0 22px;
  padding-left: 18px;
  position: relative;
  color: #020617;
}

.ra-content h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  width: 6px;
  height: 80%;
  background: linear-gradient(180deg, #2563eb, #60a5fa);
  border-radius: 6px;
}

/* ===== Ordered Lists ===== */
.ra-list {
  padding-left: 32px;
  margin-bottom: 45px;
  counter-reset: item;
}

.ra-list li {
  margin-bottom: 14px;
  padding-left: 10px;
  font-size: 16.2px;
  line-height: 1.9;
  color: #1f2937;
}

/* ===== DOs Styling ===== */
.ra-dos {
  background: linear-gradient(180deg, #f0fdf4, #ecfdf5);
  padding: 36px 42px;
  border-radius: 22px;
  box-shadow:
    inset 0 0 0 1px #bbf7d0,
    0 20px 40px rgba(22, 163, 74, 0.08);
}

.ra-dos li::marker {
  color: #16a34a;
  font-weight: 700;
}

/* ===== DON’Ts Styling ===== */
.ra-donts {
  background: linear-gradient(180deg, #fef2f2, #fff1f2);
  padding: 36px 42px;
  border-radius: 22px;
  box-shadow:
    inset 0 0 0 1px #fecaca,
    0 20px 40px rgba(220, 38, 38, 0.08);
}

.ra-donts li::marker {
  color: #dc2626;
  font-weight: 700;
}

/* ===== Footer Compliance Note ===== */
.ra-footer-note {
  margin-top: 70px;
  padding: 30px 34px;
  background: linear-gradient(135deg, #fffbeb, #fef3c7);
  border-left: 7px solid #ca8a04;
  border-radius: 18px;
  font-size: 16.5px;
  font-weight: 600;
  color: #854d0e;
  text-align: center;
  box-shadow: 0 20px 35px rgba(202, 138, 4, 0.12);
}

/* ===== Responsive ===== */
@media (max-width: 1024px) {
  .ra-container {
    padding: 55px 40px;
  }

  .ra-header h1 {
    font-size: 34px;
  }
}

@media (max-width: 640px) {
  .ra-container {
    padding: 40px 26px;
  }

  .ra-header h1 {
    font-size: 28px;
  }

  .ra-content h2 {
    font-size: 22px;
  }

  .ra-list li {
    font-size: 15.5px;
  }
}/* End custom CSS */