.elementor-1111 .elementor-element.elementor-element-a204154{--display:flex;}.elementor-1111 .elementor-element.elementor-element-a97e0eb{--spacer-size:120px;}:root{--page-title-display:none;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}/* Start custom CSS for html, class: .elementor-element-0f51708 *//* ============================
   ORAS Registration / Card Styles
   Paste into global or page CSS
   ============================ */

/* Make sure parent wrappers don't apply a background or blur */
.oras-registration,
.oras-registration .elementor-column,
.oras-registration .elementor-widget-wrap,
.oras-registration .wp-block-group,
.oras-registration .wp-block-column,
.oras-registration .wp-block-cover,
.oras-registration .elementor-section,
.oras-registration .elementor-inner-section {
  background: transparent !important;
  background-color: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Layout container */
.oras-registration {
  max-width: 1000px;
  margin: 0 auto;
  padding: 40px 20px;
  box-sizing: border-box;
  color: #eee;
}

/* Hero */
.oras-hero {
  text-align: center;
  margin-bottom: 40px;
}
.oras-hero h1 { margin: 0 0 12px; font-size: 2.1rem; line-height: 1.1; }
.oras-hero p { margin: 0; color: #ddd; max-width: 860px; margin-left: auto; margin-right: auto; }

/* Grids */
.oras-benefits,
.oras-membership-comparison {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  margin-bottom: 40px;
}

/* ============================
   CARD (Glass) - core rules
   Uses pseudo-element for localized blur,
   plus overflow:hidden and isolation to prevent bleed.
   ============================ */
.oras-card {
  position: relative;                /* needed for the pseudo-element */
  isolation: isolate;                /* create a stacking context */
  overflow: hidden;                  /* clip the pseudo-element blur to rounded corners */

  flex: 1 1 300px;
  min-width: 260px;
  max-width: 320px;

  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  color: #fff;
  box-shadow: 0 8px 22px rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  z-index: 1;                         /* ensures card content sits above pseudo-element */
}

/* Pseudo-element provides the tint + localized backdrop-filter (frosted glass).
   Because the pseudo-element is inside the card and card has overflow:hidden,
   the blur/tint are clipped to the card shape and don't blur the whole block. */
.oras-card::before{
  content: "";
  position: absolute;
  inset: 0;                            /* cover full card area */
  background: rgba(255,255,255,0.03);  /* very faint/transparent tint */
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  backdrop-filter: blur(18px) saturate(180%);
  z-index: 0;                          /* sits behind card content */
  pointer-events: none;
}

/* Ensure card content is above the pseudo-element */
.oras-card > * { position: relative; z-index: 1; }

/* Slightly larger cards used in comparison column */
.oras-card.oras-card-large {
  flex: 1 1 400px;
  max-width: 480px;
}

/* Hover lift */
.oras-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 36px rgba(0,0,0,0.45);
}

/* headings / prices */
.oras-card h3 { margin: 0 0 10px 0; font-size: 1.25rem; text-align: center; }
.oras-price, .oras-cost { font-weight: 700; margin-bottom: 12px; color: #eaeef6; text-align:center; }

/* Lists: bullets visible and nicely centered block but left-aligned content */
.oras-card ul {
  list-style: disc;
  list-style-position: inside;
  padding: 0;
  margin: 0 auto 15px auto;
  text-align: left;
  max-width: 92%;
}
.oras-card li {
  margin-bottom: 8px;
  color: #ddd;
  font-size: 15px;
  line-height: 1.5;
}

/* CTA wrapper */
.oras-cta-wrap { text-align: center; margin-top: 12px; }

/* Buttons */
.oras-button {
  display: inline-block;
  padding: 12px 24px;
  background: rgba(79,163,255,0.75);
  color: #fff;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 700;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: background 0.2s ease, transform 0.12s ease;
}
.oras-button:hover { background: rgba(79,163,255,0.95); transform: translateY(-2px); }

/* Alternate button color (use class .oras-button-alt on the element) */
.oras-button.oras-button-alt {
  background: rgba(255,159,28,0.75);
}
.oras-button.oras-button-alt:hover { background: rgba(255,159,28,0.95); }

/* small link style */
.oras-link { color: #a8d7ff; text-decoration: underline; }

/* responsive: stack nicely on small screens */
@media (max-width: 900px) {
  .oras-benefits, .oras-membership-comparison { flex-direction: column; align-items: stretch; }
  .oras-card, .oras-card.oras-card-large { max-width: 100%; flex: 1 1 100%; }
  .oras-hero h1 { font-size: 1.6rem; }
}

/* Optional: increase gap between cards to avoid visual overlap of blur edges */
.oras-benefits, .oras-membership-comparison {
  gap: 28px;
}/* End custom CSS */