#fw-section-custom-html-08d5e87e-18c3-46a4-adeb-0256d6441a53 {

/* === FIX: dynamic glow on active email field === */

/* Default (Ray / Orange leader) */
#wave-quiz.leader-orange input[type="email"].pill-input,
#wave-quiz.leader-orange input[type="email"].formkit-input {
  border-color: var(--barand-orange) !important;
  box-shadow: 0 0 14px rgba(255,153,0,.45) !important;
}
#wave-quiz.leader-orange input[type="email"].pill-input:focus,
#wave-quiz.leader-orange input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(255,153,0,.65) !important;
}

/* Flow / Blue leader */
#wave-quiz.leader-blue input[type="email"].pill-input,
#wave-quiz.leader-blue input[type="email"].formkit-input {
  border-color: var(--brand-blue) !important;
  box-shadow: 0 0 14px rgba(0,210,255,.45) !important;
}
#wave-quiz.leader-blue input[type="email"].pill-input:focus,
#wave-quiz.leader-blue input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(0,210,255,.65) !important;
}

/* Pulse / Pink leader */
#wave-quiz.leader-pink input[type="email"].pill-input,
#wave-quiz.leader-pink input[type="email"].formkit-input {
  border-color: var(--brand-pink) !important;
  box-shadow: 0 0 14px rgba(255,34,153,.45) !important;
}
#wave-quiz.leader-pink input[type="email"].pill-input:focus,
#wave-quiz.leader-pink input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(255,34,153,.65) !important;
}

/* Remove browser autofill background for the first email field */
#frontEmail:-webkit-autofill,
#frontEmail:-webkit-autofill:hover,
#frontEmail:-webkit-autofill:focus,
#frontEmail:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  -webkit-text-fill-color: var(--brand-blue) !important;
  caret-color: var(--brand-blue) !important;
  background: transparent !important;
  background-color: transparent !important;
  transition: background-color 9999s ease-in-out 0s;
}
}


















#fw-section-image-with-text-75d7a175-92de-4f56-8ad1-8d8c36061427 {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00e8ff;
--color-on-background-rgb: 0, 232, 255;
--color-product-image-background: #00e8ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}
#fw-section-links-list-ec074d16-d860-460b-a297-c4f5a9cbd1d9 {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}


#fw-section-hero-video-f64dd30a-02fd-400c-b2ea-a191f9e47a2d {
--color-primary: #ffffff;
--color-primary-rgb: 255, 255, 255;
--color-background: #ffffff;
--color-background-rgb: 255, 255, 255;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00e8ff;
--color-on-background-rgb: 0, 232, 255;
--color-product-image-background: #00e8ff;
--color-background-brightness: 255;
background-color: var(--color-background);
color: var(--color-on-background);

}

#fw-section-tiers-99bcf18e-77e1-47a5-8062-8675e47f6e71 {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}

#fw-section-rich-text-e8e65d03-7a78-471b-bb0c-752fd5a178ee {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}


#fw-section-product-product-default {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}

#fw-section-donations-30eeef7b-d92f-4cb2-8d04-8633f91a2645 {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}
#fw-section-image-with-text-955fd7eb-7603-4771-a35e-341a8287b54d {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00e8ff;
--color-on-background-rgb: 0, 232, 255;
--color-product-image-background: #00e8ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}


#fw-section-tiers-fe9e630d-9162-4116-ac4a-a35bd91a6837 {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}

#fw-section-video-with-text-475ef20d-a12d-44a2-aebd-5421a616e4d6 {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}
#fw-section-video-with-text-4c53e4c4-4566-47c2-a495-8a9ab26aeb59 {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}
#fw-section-video-with-text-47ace929-e905-488e-8fe8-c3b51541a91a {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}










#fw-section-custom-html-3097528d-ecff-4fcc-b4a0-323c87404d04 {

/* === FIX: dynamic glow on active email field === */

/* Default (Ray / Orange leader) */
#wave-quiz.leader-orange input[type="email"].pill-input,
#wave-quiz.leader-orange input[type="email"].formkit-input {
  border-color: var(--barand-orange) !important;
  box-shadow: 0 0 14px rgba(255,153,0,.45) !important;
}
#wave-quiz.leader-orange input[type="email"].pill-input:focus,
#wave-quiz.leader-orange input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(255,153,0,.65) !important;
}

/* Flow / Blue leader */
#wave-quiz.leader-blue input[type="email"].pill-input,
#wave-quiz.leader-blue input[type="email"].formkit-input {
  border-color: var(--brand-blue) !important;
  box-shadow: 0 0 14px rgba(0,210,255,.45) !important;
}
#wave-quiz.leader-blue input[type="email"].pill-input:focus,
#wave-quiz.leader-blue input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(0,210,255,.65) !important;
}

/* Pulse / Pink leader */
#wave-quiz.leader-pink input[type="email"].pill-input,
#wave-quiz.leader-pink input[type="email"].formkit-input {
  border-color: var(--brand-pink) !important;
  box-shadow: 0 0 14px rgba(255,34,153,.45) !important;
}
#wave-quiz.leader-pink input[type="email"].pill-input:focus,
#wave-quiz.leader-pink input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(255,34,153,.65) !important;
}

/* Remove browser autofill background for the first email field */
#frontEmail:-webkit-autofill,
#frontEmail:-webkit-autofill:hover,
#frontEmail:-webkit-autofill:focus,
#frontEmail:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  -webkit-text-fill-color: var(--brand-blue) !important;
  caret-color: var(--brand-blue) !important;
  background: transparent !important;
  background-color: transparent !important;
  transition: background-color 9999s ease-in-out 0s;
}
}


#fw-section-rich-text-80ced797-7e37-4a2f-b537-ecfedd03a16f {
--color-primary: #ff2299;
--color-primary-rgb: 255, 34, 153;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}
#fw-section-rich-text-4dd4b19b-47f6-4242-a3d0-94ec6f7372ec {
--color-primary: #ff2299;
--color-primary-rgb: 255, 34, 153;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}
#fw-section-rich-text-058d48e8-2c3e-454b-911c-5d7ca83b6122 {
--color-primary: #ff2299;
--color-primary-rgb: 255, 34, 153;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}
#fw-section-custom-html-a11ce14c-fc3e-4fdd-854d-ebe938629cff {

.glass-section {
  position: relative;
  overflow: hidden;
}
.glass-section::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at top left,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 70%);
  pointer-events: none;
}

/* === PROFILE HERO HEADER — GLOWING PILL HERO === */
.profile-header-hero {
  text-align: center;
  padding: 3rem 1.5rem 2.5rem;
  border-radius: 9999px;
  margin: 0 auto 2.25rem;
  width: 85%;
  background: radial-gradient(circle at top center,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 75%);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow:
    0 0 28px color-mix(in srgb, currentColor 22%, transparent),
    inset 0 0 22px color-mix(in srgb, currentColor 18%, transparent);
}

/* === HERO TITLE === */
.profile-header-hero h1 {
  font-family: 'Days One', sans-serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  line-height: 1.15;
  margin: 0;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 20%, transparent);
  animation: pulse-glow 4s ease-in-out infinite;
}

/* === HERO SUBTITLE === */
.profile-header-hero .hero-sub {
  display: block;
  font-size: 0.9em;
  opacity: 0.9;
  color: var(--leader-color, currentColor);
  text-shadow:
    0 0 5px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 30%, transparent);
}

/* === HERO COLOR ANIMATION === */
@keyframes pulse-glow {
  0%, 100% {
    text-shadow:
      0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 70%, transparent),
      0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 40%, transparent);
  }
  50% {
    text-shadow:
      0 0 10px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 22px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

/* === LEADER COLOR SYNC — sets color + variable === */
.leader-orange,
.leader-orange .profile-header-hero,
.leader-orange .glass-section,
.leader-orange .glass-inner,
.leader-orange .glass-section::before {
  color: #FF9900 !important;
  --leader-color: #FF9900;
}

.leader-blue,
.leader-blue .profile-header-hero,
.leader-blue .glass-section,
.leader-blue .glass-inner,
.leader-blue .glass-section::before {
  color: #00D2FF !important;
  --leader-color: #00D2FF;
}

.leader-pink,
.leader-pink .profile-header-hero,
.leader-pink .glass-section,
.leader-pink .glass-inner,
.leader-pink .glass-section::before {
  color: #FF2299 !important;
  --leader-color: #FF2299;
}

/* === GLOW OVERLAY FOR PILLS === */
.leader .glass-section::before {
  background: radial-gradient(circle at top left,
    color-mix(in srgb, var(--leader-color, currentColor) 15%, transparent),
    transparent 70%);
  box-shadow:
    0 0 20px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent),
    inset 0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* === PILL CONTENT === */
.glass-section,
.glass-inner {
  color: var(--leader-color, currentColor);
}

/* === LAYERS BLOCK (three-layers section) === */
.layers-block {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 80%;
  margin: 0 auto 2rem;
}
.layers-block .glass-section {
  width: 100%;
  border-radius: 36px;
  background: rgba(255,255,255,0.07);
}
/* === FIX: ensure section titles (h2/h3) follow leader color === */
.glass-section h2,
.glass-section h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Optional: subtle pulse on headers, matches archetype hue */
@keyframes section-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
      0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 50%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: section-pulse 5s ease-in-out infinite;
}
/* === FINAL FIX: Archetype color priority inside profile area === */
#wr-profile .glass-section h2,
#wr-profile .glass-section h3,
#wr-profile .glass-inner h2,
#wr-profile .glass-inner h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  animation: section-pulse 5s ease-in-out infinite;
}

/* Ensure correct inheritance scope */
#wr-profile.leader-orange { --leader-color: #FF9900; }
#wr-profile.leader-blue   { --leader-color: #00D2FF; }
#wr-profile.leader-pink   { --leader-color: #FF2299; }
/* Narrower layered pills for Mind/Body/Heart */
.glass-section h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
}
.glass-section:has(h3) {
  width: 65%;
  background: rgba(255,255,255,0.05);
  border-radius: 40px;
  padding: 1.4rem 0;
}

/* === BULLET STYLING FOR PROFILE TEXT === */

/* Apply bullet rhythm to all paragraphs except headers */
#wr-profile .glass-section p {
  position: relative;
  display: block;
  padding-left: 1.5rem;
  margin: 0.6rem auto;
  width: 85%;
  max-width: 720px;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
}

/* Add glowing bullet before each line of text */
#wr-profile .glass-section p::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0;
  color: var(--leader-color);
  font-size: 1.1em;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 14px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
}

/* If the paragraph is clearly a single headline or poetic line, center it */
#wr-profile .glass-section p:only-child,
#wr-profile .glass-section p:first-child:last-child {
  text-align: center;
  padding-left: 0;
}
#wr-profile .glass-section p:only-child::before {
  content: none;
}

/* Space between bullets */
#wr-profile .glass-section p + p {
  margin-top: 0.35rem;
}

/* Slight hover shimmer for interactivity */
#wr-profile .glass-section p:hover::before {
  text-shadow:
    0 0 10px color-mix(in srgb, var(--leader-color) 90%, transparent),
    0 0 20px color-mix(in srgb, var(--leader-color) 60%, transparent);
  transform: scale(1.15);
  transition: all 0.25s ease;
}

/* Special case: paragraphs that contain <strong> headers like “Gift:” or “Lesson:” */
#wr-profile .glass-section p strong {
  display: inline-block;
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === GLOWING BULLET LISTS — perfectly aligned === */
.wave-bullet-list {
  list-style: none;
  margin: 0.75rem auto;
  padding-left: 0;
  width: 85%;
  max-width: 720px;
}

.wave-bullet-list li {
  position: relative;
  padding-left: 1.6rem;
  margin: 0.35rem 0;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
  font-weight: 450;
}

.wave-bullet-list li::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0.1em;
  color: var(--leader-color);
  font-size: 1.25em;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
  line-height: 1;
}

/* Strong keywords stay glowing */
.wave-bullet-list li strong {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === FIX: Center headers properly & restore glow === */
.glass-section h2,
.glass-section h3 {
  text-align: center;
  font-family: 'Days One', sans-serif;
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  margin: 0 0 1rem 0;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Add subtle glow pulse to headers for consistency */
@keyframes header-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 26px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: header-pulse 5s ease-in-out infinite;
}
/* === FIX: Narrow Mind/Body/Heart Layer Pills === */
.layers-block .glass-section {
  width: 65% !important;       /* narrower than the main pills */
  background: rgba(255, 255, 255, 0.05);
  border-radius: 40px;
  padding: 1.6rem 0;
  margin: 0.9rem auto;
  transition: all 0.25s ease;
}

/* Keep inner width proportional */
.layers-block .glass-inner {
  max-width: 640px;
  width: 90%;
}

/* Subtle hover glow for aesthetic consistency */
.layers-block .glass-section:hover::before {
  box-shadow:
    0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent),
    inset 0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* On mobile, let them breathe a bit more */
@media (max-width: 640px) {
  .layers-block .glass-section {
    width: 80% !important;
    border-radius: 32px;
  }
}
/* === INTERACTIVE THREE-LAYER PILL === */
.layered-pane {
  width: 70%;
  margin: 1.5rem auto;
  border-radius: 40px;
  padding: 2rem 0;
  transition: all 0.3s ease;
}
.layer-tabs {
  display: flex;
  justify-content: center;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
.layer-tab {
  background: none;
  border: none;
  color: color-mix(in srgb, var(--leader-color) 40%, white 60%);
  font-family: 'Days One', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  padding: 0.5rem 0.8rem;
  font-size: 1.1rem;
  position: relative;
  transition: all 0.25s ease;
}
.layer-tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.15rem;
  height: 2px;
  background: color-mix(in srgb, var(--leader-color) 70%, transparent);
  opacity: 0;
  transition: opacity 0.25s ease;
}
.layer-tab.active {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
}
.layer-tab.active::after {
  opacity: 1;
}
.layer-content {
  display: none;
  animation: fadeIn 0.5s ease;
}
.layer-content:not(.hidden) {
  display: block;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
}
#fw-section-custom-html-e97c4d63-37a6-4711-b874-a4dfd318bacb {

.glass-section {
  position: relative;
  overflow: hidden;
}
.glass-section::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at top left,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 70%);
  pointer-events: none;
}

/* === PROFILE HERO HEADER — GLOWING PILL HERO === */
.profile-header-hero {
  text-align: center;
  padding: 3rem 1.5rem 2.5rem;
  border-radius: 9999px;
  margin: 0 auto 2.25rem;
  width: 85%;
  background: radial-gradient(circle at top center,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 75%);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow:
    0 0 28px color-mix(in srgb, currentColor 22%, transparent),
    inset 0 0 22px color-mix(in srgb, currentColor 18%, transparent);
}

/* === HERO TITLE === */
.profile-header-hero h1 {
  font-family: 'Days One', sans-serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  line-height: 1.15;
  margin: 0;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 20%, transparent);
  animation: pulse-glow 4s ease-in-out infinite;
}

/* === HERO SUBTITLE === */
.profile-header-hero .hero-sub {
  display: block;
  font-size: 0.9em;
  opacity: 0.9;
  color: var(--leader-color, currentColor);
  text-shadow:
    0 0 5px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 30%, transparent);
}

/* === HERO COLOR ANIMATION === */
@keyframes pulse-glow {
  0%, 100% {
    text-shadow:
      0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 70%, transparent),
      0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 40%, transparent);
  }
  50% {
    text-shadow:
      0 0 10px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 22px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

/* === LEADER COLOR SYNC — sets color + variable === */
.leader-orange,
.leader-orange .profile-header-hero,
.leader-orange .glass-section,
.leader-orange .glass-inner,
.leader-orange .glass-section::before {
  color: #FF9900 !important;
  --leader-color: #FF9900;
}

.leader-blue,
.leader-blue .profile-header-hero,
.leader-blue .glass-section,
.leader-blue .glass-inner,
.leader-blue .glass-section::before {
  color: #00D2FF !important;
  --leader-color: #00D2FF;
}

.leader-pink,
.leader-pink .profile-header-hero,
.leader-pink .glass-section,
.leader-pink .glass-inner,
.leader-pink .glass-section::before {
  color: #FF2299 !important;
  --leader-color: #FF2299;
}

/* === GLOW OVERLAY FOR PILLS === */
.leader .glass-section::before {
  background: radial-gradient(circle at top left,
    color-mix(in srgb, var(--leader-color, currentColor) 15%, transparent),
    transparent 70%);
  box-shadow:
    0 0 20px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent),
    inset 0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* === PILL CONTENT === */
.glass-section,
.glass-inner {
  color: var(--leader-color, currentColor);
}

/* === LAYERS BLOCK (three-layers section) === */
.layers-block {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 80%;
  margin: 0 auto 2rem;
}
.layers-block .glass-section {
  width: 100%;
  border-radius: 36px;
  background: rgba(255,255,255,0.07);
}
/* === FIX: ensure section titles (h2/h3) follow leader color === */
.glass-section h2,
.glass-section h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Optional: subtle pulse on headers, matches archetype hue */
@keyframes section-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
      0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 50%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: section-pulse 5s ease-in-out infinite;
}
/* === FINAL FIX: Archetype color priority inside profile area === */
#wr-profile .glass-section h2,
#wr-profile .glass-section h3,
#wr-profile .glass-inner h2,
#wr-profile .glass-inner h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  animation: section-pulse 5s ease-in-out infinite;
}

/* Ensure correct inheritance scope */
#wr-profile.leader-orange { --leader-color: #FF9900; }
#wr-profile.leader-blue   { --leader-color: #00D2FF; }
#wr-profile.leader-pink   { --leader-color: #FF2299; }
/* Narrower layered pills for Mind/Body/Heart */
.glass-section h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
}
.glass-section:has(h3) {
  width: 65%;
  background: rgba(255,255,255,0.05);
  border-radius: 40px;
  padding: 1.4rem 0;
}

/* === BULLET STYLING FOR PROFILE TEXT === */

/* Apply bullet rhythm to all paragraphs except headers */
#wr-profile .glass-section p {
  position: relative;
  display: block;
  padding-left: 1.5rem;
  margin: 0.6rem auto;
  width: 85%;
  max-width: 720px;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
}

/* Add glowing bullet before each line of text */
#wr-profile .glass-section p::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0;
  color: var(--leader-color);
  font-size: 1.1em;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 14px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
}

/* If the paragraph is clearly a single headline or poetic line, center it */
#wr-profile .glass-section p:only-child,
#wr-profile .glass-section p:first-child:last-child {
  text-align: center;
  padding-left: 0;
}
#wr-profile .glass-section p:only-child::before {
  content: none;
}

/* Space between bullets */
#wr-profile .glass-section p + p {
  margin-top: 0.35rem;
}

/* Slight hover shimmer for interactivity */
#wr-profile .glass-section p:hover::before {
  text-shadow:
    0 0 10px color-mix(in srgb, var(--leader-color) 90%, transparent),
    0 0 20px color-mix(in srgb, var(--leader-color) 60%, transparent);
  transform: scale(1.15);
  transition: all 0.25s ease;
}

/* Special case: paragraphs that contain <strong> headers like “Gift:” or “Lesson:” */
#wr-profile .glass-section p strong {
  display: inline-block;
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === GLOWING BULLET LISTS — perfectly aligned === */
.wave-bullet-list {
  list-style: none;
  margin: 0.75rem auto;
  padding-left: 0;
  width: 85%;
  max-width: 720px;
}

.wave-bullet-list li {
  position: relative;
  padding-left: 1.6rem;
  margin: 0.35rem 0;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
  font-weight: 700;
}

.wave-bullet-list li::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0.1em;
  color: var(--leader-color);
  font-size: 1.25em;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
  line-height: 1;
}

/* Strong keywords stay glowing */
.wave-bullet-list li strong {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === FIX: Center headers properly & restore glow === */
.glass-section h2,
.glass-section h3 {
  text-align: center;
  font-family: 'Days One', sans-serif;
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  margin: 0 0 1rem 0;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Add subtle glow pulse to headers for consistency */
@keyframes header-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 26px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: header-pulse 5s ease-in-out infinite;
}
/* === FIX: Narrow Mind/Body/Heart Layer Pills === */
.layers-block .glass-section {
  width: 65% !important;       /* narrower than the main pills */
  background: rgba(255, 255, 255, 0.05);
  border-radius: 40px;
  padding: 1.6rem 0;
  margin: 0.9rem auto;
  transition: all 0.25s ease;
}

/* Keep inner width proportional */
.layers-block .glass-inner {
  max-width: 640px;
  width: 90%;
}

/* Subtle hover glow for aesthetic consistency */
.layers-block .glass-section:hover::before {
  box-shadow:
    0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent),
    inset 0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* On mobile, let them breathe a bit more */
@media (max-width: 640px) {
  .layers-block .glass-section {
    width: 80% !important;
    border-radius: 32px;
  }
}
/* === INTERACTIVE THREE-LAYER PILL === */
.layered-pane {
  width: 70%;
  margin: 1.5rem auto;
  border-radius: 40px;
  padding: 2rem 0;
  transition: all 0.3s ease;
}
.layer-tabs {
  display: flex;
  justify-content: center;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
.layer-tab {
  background: none;
  border: none;
  color: color-mix(in srgb, var(--leader-color) 40%, white 60%);
  font-family: 'Days One', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  padding: 0.5rem 0.8rem;
  font-size: 1.1rem;
  position: relative;
  transition: all 0.25s ease;
}
.layer-tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.15rem;
  height: 2px;
  background: color-mix(in srgb, var(--leader-color) 70%, transparent);
  opacity: 0;
  transition: opacity 0.25s ease;
}
.layer-tab.active {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
}
.layer-tab.active::after {
  opacity: 1;
}
.layer-content {
  display: none;
  animation: fadeIn 0.5s ease;
}
.layer-content:not(.hidden) {
  display: block;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
}
#fw-section-custom-html-1a5fa261-8f47-4d9e-a2d0-96b0ac8f9952 {

/* Layout: two columns centered */
.latest-band{padding:12px 0 8px;margin:0}
.latest-wrap{
  max-width:1120px;width:92vw;margin:0 auto;
  display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;
  gap:20px;
}
.latest-slot{flex:0 1 500px;max-width:500px;text-align:center}

/* hide default headings */
.latest-h{display:none}

/* host */
.latest-card{background:transparent !important;box-shadow:none !important;padding:0 !important;border-radius:0 !important;overflow:visible !important}
.latest-card:empty{display:none}

/* pill cards */
.latest-card .post-tile{
  display:block;width:100%;
  border-radius:28px;overflow:hidden;background:transparent !important;box-shadow:none !important;
  position:relative;margin:0
}
.latest-card .post-tile__container,
.latest-card .post-tile__image-container,
.latest-card .post-tile__content{background:transparent !important}

/* remove all internal bottom gap */
.latest-card .post-tile__content,
.latest-card .post-tile__header,
.latest-card .post-tile__text--overlay p{
  margin:0 !important;padding:0 !important
}

/* readability fade */
.latest-card .post-tile__text--overlay{
  background:linear-gradient(to top,rgba(18,15,42,0.92) 0%,rgba(18,15,42,0.70) 35%,rgba(18,15,42,0.00) 70%) !important;
  color:#fff !important; padding-bottom:0 !important;
}

/* hide native long title/desc */
.latest-card .post-tile__title-post,
.latest-card .post-tile__text{display:none !important}

/* feedback color */
.latest-card .post-tile__feedback,
.latest-card .post-tile__count{color:rgba(255,255,255,0.85) !important}

/* audio visuals */
.latest-card .post-tile[data-post-type="Audio"] .post-tile__image--audio-background{filter:blur(10px) brightness(0.95);transform:scale(1.06)}
.latest-card .post-tile__image--audio-play{opacity:1;mix-blend-mode:normal}

/* spacing under cards (outside) */
.latest-slot .post-tile{margin-bottom:10px}

/* centered date */
#latest-replay-card .post-tile .post-tile__date,
#latest-audio-card  .post-tile .post-tile__date{
  position:absolute;left:50%;transform:translateX(-50%);
  bottom:5px; /* snug at bottom */
  z-index:6;text-align:center;width:auto;white-space:nowrap;font-weight:700
}
#latest-replay-card .post-tile .post-tile__date{color:#FF2299 !important }
#latest-audio-card  .post-tile .post-tile__date{ color:#FF9900 !important }

/* accent borders */
#latest-audio-card .post-tile{
  border:3px solid #FF9900 !important;
  box-shadow:0 0 0.65rem rgba(255,153,0,0.70),0 0 1.5rem rgba(255,153,0,0.45) !important
}
#latest-replay-card .post-tile{
  border:3px solid #FF2299 !important;
  box-shadow:0 0 0.65rem rgba(255,34,153,0.70),0 0 1.5rem rgba(255,34,153,0.45) !important
}

/* BELOW-CARD BUTTONS */
.latest-fallback{
  display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;text-decoration:none;font-weight:800;
  padding:14px 22px;border-radius:9999px;border:2px solid transparent;
  margin:12px auto 0; /* centers + lowers buttons */
  box-shadow:0 0 .55rem rgba(0,0,0,.15);
  width:auto;max-width:100%
}
.latest-fallback .btn-line-1{
  display:block;font-size:1.02rem;line-height:1.3;text-align:center
}
.latest-fallback .btn-line-2{
  display:block;font-size:.86rem;line-height:1.2;opacity:.9;margin-top:2px;text-align:center
}

/* Replay button (orange) */
#latest-audio-slot .latest-fallback{
  background:#FF9900;border-color:#FF9900;color:#120f2a
}
#latest-audio-slot .latest-fallback:hover,
#latest-audio-slot .latest-fallback:focus-visible{
  background:#e68a00;border-color:#e68a00
}

/* Audio button (pink) */
#latest-replay-slot .latest-fallback{
  background:#FF2299;border-color:#FF2299;color:#120f2a
}
#latest-replay-slot .latest-fallback:hover,
#latest-replay-slot .latest-fallback:focus-visible{
  background:#e01d88;border-color:#e01d88
}

/* mobile tweaks */
@media (max-width:768px){
  .latest-slot{max-width:100%}
  .latest-fallback{margin-top:16px} /* push buttons lower for breathing room */
  #latest-replay-card .post-tile .post-tile__date,
  #latest-audio-card  .post-tile .post-tile__date{
    bottom:8px; /* adjust so date isn’t too high */
  }
}
/* === Glow buttons by card type === */

/* Replay (Orange) */
#latest-audio-slot .latest-btn{
  background-color: #FF9900 !important;
  border: 2px solid #FF9900 !important;
  color: #120f2a !important;
  box-shadow: 0 0 0.5rem rgba(255,153,0,0.6),
              0 0 1.25rem rgba(255,153,0,0.35) !important;
}
#latest-audio-slot .latest-btn:hover,
#latest-audio-slot .latest-btn:focus-visible{
  background-color: #e68a00 !important;
  border-color: #e68a00 !important;
  box-shadow: 0 0 0.65rem rgba(255,153,0,0.8),
              0 0 1.5rem rgba(255,153,0,0.5) !important;
}

/* Audio (Pink) */
#latest-replay-slot .latest-btn{
  background-color: #FF2299 !important;
  border: 2px solid #FF2299 !important;
  color: #120f2a !important;
  box-shadow: 0 0 0.5rem rgba(255,34,153,0.6),
              0 0 1.25rem rgba(255,34,153,0.35) !important;
}
#latest-replay-slot .latest-btn:hover,
#latest-replay-slot .latest-btn:focus-visible{
  background-color: #e01d88 !important;
  border-color: #e01d88 !important;
  box-shadow: 0 0 0.65rem rgba(255,34,153,0.8),
              0 0 1.5rem rgba(255,34,153,0.5) !important;
}
.listen-links {
  text-align: center;
  font-family: "Nunito", system-ui, sans-serif;
  margin: 2rem auto;
  max-width: 900px;
}

.listen-buttons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1.2rem;
}

.btn {
  display: inline-block;
  padding: 0.8rem 1.5rem;
  border-radius: 999px;
  color: white;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.25s ease;
  box-shadow: 0 0 0.4rem rgba(0,0,0,0.25);
}

/* Platform colors */
.btn.buzzsprout { background-color: #00D2FF; }   /* Brand blue */
.btn.spotify { background-color: #1DB954; }      /* Spotify green */
.btn.apple { background-color: #A970FF; }        /* Apple Podcasts purple */

/* Hover glows */
.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 1.2rem rgba(255,255,255,0.3);
  filter: brightness(1.1);
}

/* Responsive */
@media (max-width: 600px) {
  .btn {
    width: 100%;
  }
}

/* --- Correct platform icons + black text --- */
.listen-links .btn {
  color: #120f2a !important;
}

.listen-links .btn i {
  color: #120f2a !important;
  margin-right: 0.5rem;
  font-size: 1.15rem;
  vertical-align: middle;
}

/* Buzzsprout → play circle icon */
.listen-links .btn.buzzsprout i::before {
  content: "\f144"; /* fa-solid fa-circle-play */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}

/* Spotify → official brand */
.listen-links .btn.spotify i::before {
  content: "\f1bc"; /* fa-brands fa-spotify */
  font-family: "Font Awesome 6 Brands";
}

/* Apple Podcasts → podcast-wave icon (Apple-style) */
.listen-links .btn.apple i::before {
  content: "\f2ce"; /* fa-solid fa-podcast */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}
/* === CLEAN STATIC GLOWS (match each button color) === */

/* Common transition + spacing */
.listen-links .btn {
  transition: all 0.25s ease, box-shadow 0.3s ease;
}

/* Buzzsprout (Blue) */
.listen-links .btn.buzzsprout {
  box-shadow: 0 0 0.6rem rgba(0,210,255,0.55),
              0 0 1.2rem rgba(0,210,255,0.35);
}
.listen-links .btn.buzzsprout:hover,
.listen-links .btn.buzzsprout:focus-visible {
  box-shadow: 0 0 1rem rgba(0,210,255,0.8),
              0 0 2rem rgba(0,210,255,0.6);
  transform: translateY(-2px);
}

/* Spotify (Green) */
.listen-links .btn.spotify {
  box-shadow: 0 0 0.6rem rgba(29,185,84,0.55),
              0 0 1.2rem rgba(29,185,84,0.35);
}
.listen-links .btn.spotify:hover,
.listen-links .btn.spotify:focus-visible {
  box-shadow: 0 0 1rem rgba(29,185,84,0.8),
              0 0 2rem rgba(29,185,84,0.6);
  transform: translateY(-2px);
}

/* Apple Podcasts (Purple) */
.listen-links .btn.apple {
  box-shadow: 0 0 0.6rem rgba(169,112,255,0.55),
              0 0 1.2rem rgba(169,112,255,0.35);
}
.listen-links .btn.apple:hover,
.listen-links .btn.apple:focus-visible {
  box-shadow: 0 0 1rem rgba(169,112,255,0.8),
              0 0 2rem rgba(169,112,255,0.6);
  transform: translateY(-2px);
}
}
#fw-section-tiers-e83ee077-12db-41b9-ae46-494c3608630a {
--color-primary: #ff9900;
--color-primary-rgb: 255, 153, 0;
--color-background: #120f2a;
--color-background-rgb: 18, 15, 42;
--color-on-primary: #120f2a;
--color-on-primary-rgb: 18, 15, 42;
--color-on-background: #00d2ff;
--color-on-background-rgb: 0, 210, 255;
--color-product-image-background: #00d2ff;
--color-background-brightness: 19;
background-color: var(--color-background);
color: var(--color-on-background);

}








#fw-section-image-with-text-8662c699-3346-4866-a059-2af4c5f052c0 {

/* Pill layout for the Wave Rider Discord section */
section {
  max-width: 1000px;
  margin: 2rem auto;
  padding: 2rem 3rem;

  /* same glass look you liked */
  background-color: rgba(255, 255, 255, 0.10);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  border-radius: 9999px; /* pill shape */
  box-shadow: 0 0 1.25rem rgba(0,0,0,0.25);
  text-align: center;
}

/* Headline — BRAND BLUE (#00d2ff) */
section h2 {
  margin: 0 0 0.5rem 0;
  color: #00d2ff !important;
  font-weight: 700;
}

/* Body copy — BRAND BLUE (#00d2ff) */
section p {
  max-width: 60ch;
  margin: 0 auto 1rem;
  color: #00d2ff !important;
  font-size: 1.1rem;
  line-height: 1.6;
}

/* Button unchanged, just spacing */
section .Button,
section a.Button {
  margin-top: 0.25rem;
}
}
#fw-section-custom-html-80096ac5-a401-40a2-9ae5-830aa2b28266 {

/* === QUIZ CLEAN + FRONT GATE FIX — COMPLETE FINAL VERSION (SPACING ADJUSTED) === */

/* --- Color rules for leaders (keep for dynamic glow logic) --- */
#wave-quiz.leader-orange input[type="email"].pill-input,
#wave-quiz.leader-orange input[type="email"].formkit-input {
  border-color: var(--brand-orange) !important;
  box-shadow: 0 0 14px rgba(255,153,0,.45) !important;
}
#wave-quiz.leader-orange input[type="email"].pill-input:focus,
#wave-quiz.leader-orange input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(255,153,0,.65) !important;
}

#wave-quiz.leader-blue input[type="email"].pill-input,
#wave-quiz.leader-blue input[type="email"].formkit-input {
  border-color: var(--brand-blue) !important;
  box-shadow: 0 0 14px rgba(0,210,255,.45) !important;
}
#wave-quiz.leader-blue input[type="email"].pill-input:focus,
#wave-quiz.leader-blue input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(0,210,255,.65) !important;
}

#wave-quiz.leader-pink input[type="email"].pill-input,
#wave-quiz.leader-pink input[type="email"].formkit-input {
  border-color: var(--brand-pink) !important;
  box-shadow: 0 0 14px rgba(255,34,153,.45) !important;
}
#wave-quiz.leader-pink input[type="email"].pill-input:focus,
#wave-quiz.leader-pink input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(255,34,153,.65) !important;
}

/* --- Front Gate Layout --- */
#frontGate .newsletter-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
  text-align: center;
  padding-block: 0.8rem;
}

/* --- Title --- */
#frontGate .newsletter-title {
  font-size: clamp(2.8rem, 5.4vw, 3.6rem);
  line-height: 1.05;
  font-weight: 900;
  text-transform: uppercase;
  color: var(--brand-blue);
  margin-bottom: 0.4rem;
}

/* --- Subtitle (matches global body text) --- */
#frontGate .newsletter-subtitle {
  font-size: 1.16rem;
  font-weight: 600;
  line-height: 1.5;
  color: var(--brand-blue);
  max-width: 540px;
  margin: 0 auto 1.2rem;
}

/* --- CTA Button (Take Archetype Quiz) --- */
#frontGate .button-primary.button-orange {
  background: var(--brand-orange);
  border: none;
  color: #2a1600;
  font-weight: 800;
  font-size: 1.16rem;
  line-height: 1.1;
  padding: 1rem 1.25rem;
  width: 320px;
  border-radius: 9999px;
  white-space: nowrap;
  box-shadow: 0 0 16px rgba(255,153,0,0.6);
  transition: box-shadow 0.25s ease;
  margin: 0; /* tightened spacing below button */
}
#frontGate .button-primary.button-orange:hover {
  box-shadow: 0 0 22px rgba(255,153,0,0.85);
}

/* --- Input Field --- */
#frontGate input[type="email"].pill-input,
#frontGate input[type="email"].formkit-input {
  width: 320px;
  height: 55px;
  padding: 1rem 1.25rem;
  border: 2px solid var(--brand-blue) !important;
  border-radius: 9999px;
  background: transparent !important;
  color: var(--brand-blue) !important;
  caret-color: var(--brand-blue) !important;
  -webkit-text-fill-color: var(--brand-blue) !important;
  font-size: 1.16rem;
  box-shadow: 0 0 14px rgba(0,210,255,.45) inset, 0 0 14px rgba(0,210,255,.45) !important;
  transition: box-shadow 0.25s ease;
  margin-top: -2rem; /* tighten directly under button */
}
#frontGate input[type="email"].pill-input:focus,
#frontGate input[type="email"].formkit-input:focus {
  box-shadow: 0 0 22px rgba(0,210,255,.65) inset, 0 0 22px rgba(0,210,255,.65) !important;
}

/* --- Skip Quiz Button --- */
#frontGate .skip-intro {
  margin-top: 0.8rem; /* keeps rhythm consistent visually */
  padding: 1rem 1.25rem;
  height: 55px;
  border: 2px solid var(--brand-blue);
  color: var(--brand-blue);
  background: transparent;
  font-weight: 700;
  font-size: 1.16rem;
  border-radius: 9999px;
  box-shadow: 0 0 12px rgba(0,210,255,.35);
  transition: box-shadow 0.25s ease;
}
#frontGate .skip-intro:hover {
  box-shadow: 0 0 20px rgba(0,210,255,.65);
}

/* --- Unified Alignment --- */
#frontGate .front-inline {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: .55rem ; /* slightly reduced to visually match button spacing */
}

/* --- Responsive --- */
@media (max-width: 640px) {
  #frontGate .button-primary.button-orange,
  #frontGate input[type="email"].pill-input,
  #frontGate input[type="email"].formkit-input {
    width: 100%;
    max-width: 320px;
  }
}
}
#fw-section-custom-html-61f59989-4f80-4bd2-a144-8eabe836c8e2 {

/* ===== Countdown Styling (Brand Orange) ===== */
.countdown-box {
  margin-top: 10px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
}

.hero-text .countdown-box {
  margin-left: 2px;
}

.countdown-inner {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  border: 2px solid var(--orange);
  border-radius: 9999px;
  background: rgba(255, 153, 0, 0.1);
  color: var(--orange);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.5px;
  text-shadow: 0 0 8px rgba(255, 153, 0, 0.8);
  box-shadow: 0 0 12px rgba(255, 153, 0, 0.4);
  transition: all 0.3s ease;
}

/* LIVE NOW state */
.countdown-inner.live {
  background: var(--orange);
  color: var(--black);
  text-shadow: none;
  box-shadow: 0 0 14px rgba(255, 153, 0, 0.9), 0 0 24px rgba(255, 153, 0, 0.5);
  animation: pulseGlow 1.8s infinite ease-in-out;
}

/* Pulse animation for LIVE NOW */
@keyframes pulseGlow {
  0%, 100% {
    box-shadow: 0 0 12px rgba(255, 153, 0, 0.9), 0 0 26px rgba(255, 153, 0, 0.5);
  }
  50% {
    box-shadow: 0 0 18px rgba(255, 153, 0, 1), 0 0 40px rgba(255, 153, 0, 0.7);
  }
}

/* Responsive alignment */
@media (max-width: 960px) {
  .countdown-box {
    justify-content: center;
  }
}
}

#fw-section-custom-html-d4e95787-fcb9-47cc-b991-18c28a085b67 {

.glass-section {
  position: relative;
  overflow: hidden;
}
.glass-section::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at top left,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 70%);
  pointer-events: none;
}

/* === PROFILE HERO HEADER — GLOWING PILL HERO === */
.profile-header-hero {
  text-align: center;
  padding: 3rem 1.5rem 2.5rem;
  border-radius: 9999px;
  margin: 0 auto 2.25rem;
  width: 85%;
  background: radial-gradient(circle at top center,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 75%);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow:
    0 0 28px color-mix(in srgb, currentColor 22%, transparent),
    inset 0 0 22px color-mix(in srgb, currentColor 18%, transparent);
}

/* === HERO TITLE === */
.profile-header-hero h1 {
  font-family: 'Days One', sans-serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  line-height: 1.15;
  margin: 0;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 20%, transparent);
  animation: pulse-glow 4s ease-in-out infinite;
}

/* === HERO SUBTITLE === */
.profile-header-hero .hero-sub {
  display: block;
  font-size: 0.9em;
  opacity: 0.9;
  color: var(--leader-color, currentColor);
  text-shadow:
    0 0 5px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 30%, transparent);
}

/* === HERO COLOR ANIMATION === */
@keyframes pulse-glow {
  0%, 100% {
    text-shadow:
      0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 70%, transparent),
      0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 40%, transparent);
  }
  50% {
    text-shadow:
      0 0 10px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 22px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

/* === LEADER COLOR SYNC — sets color + variable === */
.leader-orange,
.leader-orange .profile-header-hero,
.leader-orange .glass-section,
.leader-orange .glass-inner,
.leader-orange .glass-section::before {
  color: #FF9900 !important;
  --leader-color: #FF9900;
}

.leader-blue,
.leader-blue .profile-header-hero,
.leader-blue .glass-section,
.leader-blue .glass-inner,
.leader-blue .glass-section::before {
  color: #00D2FF !important;
  --leader-color: #00D2FF;
}

.leader-pink,
.leader-pink .profile-header-hero,
.leader-pink .glass-section,
.leader-pink .glass-inner,
.leader-pink .glass-section::before {
  color: #FF2299 !important;
  --leader-color: #FF2299;
}

/* === GLOW OVERLAY FOR PILLS === */
.leader .glass-section::before {
  background: radial-gradient(circle at top left,
    color-mix(in srgb, var(--leader-color, currentColor) 15%, transparent),
    transparent 70%);
  box-shadow:
    0 0 20px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent),
    inset 0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* === PILL CONTENT === */
.glass-section,
.glass-inner {
  color: var(--leader-color, currentColor);
}

/* === LAYERS BLOCK (three-layers section) === */
.layers-block {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 80%;
  margin: 0 auto 2rem;
}
.layers-block .glass-section {
  width: 100%;
  border-radius: 36px;
  background: rgba(255,255,255,0.07);
}
/* === FIX: ensure section titles (h2/h3) follow leader color === */
.glass-section h2,
.glass-section h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Optional: subtle pulse on headers, matches archetype hue */
@keyframes section-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
      0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 50%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: section-pulse 5s ease-in-out infinite;
}
/* === FINAL FIX: Archetype color priority inside profile area === */
#wr-profile .glass-section h2,
#wr-profile .glass-section h3,
#wr-profile .glass-inner h2,
#wr-profile .glass-inner h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  animation: section-pulse 5s ease-in-out infinite;
}

/* Ensure correct inheritance scope */
#wr-profile.leader-orange { --leader-color: #FF9900; }
#wr-profile.leader-blue   { --leader-color: #00D2FF; }
#wr-profile.leader-pink   { --leader-color: #FF2299; }
/* Narrower layered pills for Mind/Body/Heart */
.glass-section h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
}
.glass-section:has(h3) {
  width: 65%;
  background: rgba(255,255,255,0.05);
  border-radius: 40px;
  padding: 1.4rem 0;
}

/* === BULLET STYLING FOR PROFILE TEXT === */

/* Apply bullet rhythm to all paragraphs except headers */
#wr-profile .glass-section p {
  position: relative;
  display: block;
  padding-left: 1.5rem;
  margin: 0.6rem auto;
  width: 85%;
  max-width: 720px;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
}

/* Add glowing bullet before each line of text */
#wr-profile .glass-section p::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0;
  color: var(--leader-color);
  font-size: 1.1em;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 14px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
}

/* If the paragraph is clearly a single headline or poetic line, center it */
#wr-profile .glass-section p:only-child,
#wr-profile .glass-section p:first-child:last-child {
  text-align: center;
  padding-left: 0;
}
#wr-profile .glass-section p:only-child::before {
  content: none;
}

/* Space between bullets */
#wr-profile .glass-section p + p {
  margin-top: 0.35rem;
}

/* Slight hover shimmer for interactivity */
#wr-profile .glass-section p:hover::before {
  text-shadow:
    0 0 10px color-mix(in srgb, var(--leader-color) 90%, transparent),
    0 0 20px color-mix(in srgb, var(--leader-color) 60%, transparent);
  transform: scale(1.15);
  transition: all 0.25s ease;
}

/* Special case: paragraphs that contain <strong> headers like “Gift:” or “Lesson:” */
#wr-profile .glass-section p strong {
  display: inline-block;
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === GLOWING BULLET LISTS — perfectly aligned === */
.wave-bullet-list {
  list-style: none;
  margin: 0.75rem auto;
  padding-left: 0;
  width: 85%;
  max-width: 720px;
}

.wave-bullet-list li {
  position: relative;
  padding-left: 1.6rem;
  margin: 0.35rem 0;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
  font-weight: 450;
}

.wave-bullet-list li::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0.1em;
  color: var(--leader-color);
  font-size: 1.25em;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
  line-height: 1;
}

/* Strong keywords stay glowing */
.wave-bullet-list li strong {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === FIX: Center headers properly & restore glow === */
.glass-section h2,
.glass-section h3 {
  text-align: center;
  font-family: 'Days One', sans-serif;
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  margin: 0 0 1rem 0;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Add subtle glow pulse to headers for consistency */
@keyframes header-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 26px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: header-pulse 5s ease-in-out infinite;
}
/* === FIX: Narrow Mind/Body/Heart Layer Pills === */
.layers-block .glass-section {
  width: 65% !important;       /* narrower than the main pills */
  background: rgba(255, 255, 255, 0.05);
  border-radius: 40px;
  padding: 1.6rem 0;
  margin: 0.9rem auto;
  transition: all 0.25s ease;
}

/* Keep inner width proportional */
.layers-block .glass-inner {
  max-width: 640px;
  width: 90%;
}

/* Subtle hover glow for aesthetic consistency */
.layers-block .glass-section:hover::before {
  box-shadow:
    0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent),
    inset 0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* On mobile, let them breathe a bit more */
@media (max-width: 640px) {
  .layers-block .glass-section {
    width: 80% !important;
    border-radius: 32px;
  }
}
/* === INTERACTIVE THREE-LAYER PILL === */
.layered-pane {
  width: 70%;
  margin: 1.5rem auto;
  border-radius: 40px;
  padding: 2rem 0;
  transition: all 0.3s ease;
}
.layer-tabs {
  display: flex;
  justify-content: center;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
.layer-tab {
  background: none;
  border: none;
  color: color-mix(in srgb, var(--leader-color) 40%, white 60%);
  font-family: 'Days One', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  padding: 0.5rem 0.8rem;
  font-size: 1.1rem;
  position: relative;
  transition: all 0.25s ease;
}
.layer-tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.15rem;
  height: 2px;
  background: color-mix(in srgb, var(--leader-color) 70%, transparent);
  opacity: 0;
  transition: opacity 0.25s ease;
}
.layer-tab.active {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
}
.layer-tab.active::after {
  opacity: 1;
}
.layer-content {
  display: none;
  animation: fadeIn 0.5s ease;
}
.layer-content:not(.hidden) {
  display: block;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
}
#fw-section-custom-html-8036e0d3-a7b2-440d-af8b-c236699e5a9b {

.glass-section {
  position: relative;
  overflow: hidden;
}
.glass-section::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at top left,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 70%);
  pointer-events: none;
}

/* === PROFILE HERO HEADER — GLOWING PILL HERO === */
.profile-header-hero {
  text-align: center;
  padding: 3rem 1.5rem 2.5rem;
  border-radius: 9999px;
  margin: 0 auto 2.25rem;
  width: 85%;
  background: radial-gradient(circle at top center,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 75%);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow:
    0 0 28px color-mix(in srgb, currentColor 22%, transparent),
    inset 0 0 22px color-mix(in srgb, currentColor 18%, transparent);
}

/* === HERO TITLE === */
.profile-header-hero h1 {
  font-family: 'Days One', sans-serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  line-height: 1.15;
  margin: 0;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 20%, transparent);
  animation: pulse-glow 4s ease-in-out infinite;
}

/* === HERO SUBTITLE === */
.profile-header-hero .hero-sub {
  display: block;
  font-size: 0.9em;
  opacity: 0.9;
  color: var(--leader-color, currentColor);
  text-shadow:
    0 0 5px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 30%, transparent);
}

/* === HERO COLOR ANIMATION === */
@keyframes pulse-glow {
  0%, 100% {
    text-shadow:
      0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 70%, transparent),
      0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 40%, transparent);
  }
  50% {
    text-shadow:
      0 0 10px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 22px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

/* === LEADER COLOR SYNC — sets color + variable === */
.leader-orange,
.leader-orange .profile-header-hero,
.leader-orange .glass-section,
.leader-orange .glass-inner,
.leader-orange .glass-section::before {
  color: #FF9900 !important;
  --leader-color: #FF9900;
}

.leader-blue,
.leader-blue .profile-header-hero,
.leader-blue .glass-section,
.leader-blue .glass-inner,
.leader-blue .glass-section::before {
  color: #00D2FF !important;
  --leader-color: #00D2FF;
}

.leader-pink,
.leader-pink .profile-header-hero,
.leader-pink .glass-section,
.leader-pink .glass-inner,
.leader-pink .glass-section::before {
  color: #FF2299 !important;
  --leader-color: #FF2299;
}

/* === GLOW OVERLAY FOR PILLS === */
.leader .glass-section::before {
  background: radial-gradient(circle at top left,
    color-mix(in srgb, var(--leader-color, currentColor) 15%, transparent),
    transparent 70%);
  box-shadow:
    0 0 20px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent),
    inset 0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* === PILL CONTENT === */
.glass-section,
.glass-inner {
  color: var(--leader-color, currentColor);
}

/* === LAYERS BLOCK (three-layers section) === */
.layers-block {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 80%;
  margin: 0 auto 2rem;
}
.layers-block .glass-section {
  width: 100%;
  border-radius: 36px;
  background: rgba(255,255,255,0.07);
}
/* === FIX: ensure section titles (h2/h3) follow leader color === */
.glass-section h2,
.glass-section h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Optional: subtle pulse on headers, matches archetype hue */
@keyframes section-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
      0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 50%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: section-pulse 5s ease-in-out infinite;
}
/* === FINAL FIX: Archetype color priority inside profile area === */
#wr-profile .glass-section h2,
#wr-profile .glass-section h3,
#wr-profile .glass-inner h2,
#wr-profile .glass-inner h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  animation: section-pulse 5s ease-in-out infinite;
}

/* Ensure correct inheritance scope */
#wr-profile.leader-orange { --leader-color: #FF9900; }
#wr-profile.leader-blue   { --leader-color: #00D2FF; }
#wr-profile.leader-pink   { --leader-color: #FF2299; }
/* Narrower layered pills for Mind/Body/Heart */
.glass-section h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
}
.glass-section:has(h3) {
  width: 65%;
  background: rgba(255,255,255,0.05);
  border-radius: 40px;
  padding: 1.4rem 0;
}

/* === BULLET STYLING FOR PROFILE TEXT === */

/* Apply bullet rhythm to all paragraphs except headers */
#wr-profile .glass-section p {
  position: relative;
  display: block;
  padding-left: 1.5rem;
  margin: 0.6rem auto;
  width: 85%;
  max-width: 720px;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
}

/* Add glowing bullet before each line of text */
#wr-profile .glass-section p::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0;
  color: var(--leader-color);
  font-size: 1.1em;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 14px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
}

/* If the paragraph is clearly a single headline or poetic line, center it */
#wr-profile .glass-section p:only-child,
#wr-profile .glass-section p:first-child:last-child {
  text-align: center;
  padding-left: 0;
}
#wr-profile .glass-section p:only-child::before {
  content: none;
}

/* Space between bullets */
#wr-profile .glass-section p + p {
  margin-top: 0.35rem;
}

/* Slight hover shimmer for interactivity */
#wr-profile .glass-section p:hover::before {
  text-shadow:
    0 0 10px color-mix(in srgb, var(--leader-color) 90%, transparent),
    0 0 20px color-mix(in srgb, var(--leader-color) 60%, transparent);
  transform: scale(1.15);
  transition: all 0.25s ease;
}

/* Special case: paragraphs that contain <strong> headers like “Gift:” or “Lesson:” */
#wr-profile .glass-section p strong {
  display: inline-block;
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === GLOWING BULLET LISTS — perfectly aligned === */
.wave-bullet-list {
  list-style: none;
  margin: 0.75rem auto;
  padding-left: 0;
  width: 85%;
  max-width: 720px;
}

.wave-bullet-list li {
  position: relative;
  padding-left: 1.6rem;
  margin: 0.35rem 0;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
  font-weight: 450;
}

.wave-bullet-list li::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0.1em;
  color: var(--leader-color);
  font-size: 1.25em;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
  line-height: 1;
}

/* Strong keywords stay glowing */
.wave-bullet-list li strong {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === FIX: Center headers properly & restore glow === */
.glass-section h2,
.glass-section h3 {
  text-align: center;
  font-family: 'Days One', sans-serif;
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  margin: 0 0 1rem 0;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Add subtle glow pulse to headers for consistency */
@keyframes header-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 26px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: header-pulse 5s ease-in-out infinite;
}
/* === FIX: Narrow Mind/Body/Heart Layer Pills === */
.layers-block .glass-section {
  width: 65% !important;       /* narrower than the main pills */
  background: rgba(255, 255, 255, 0.05);
  border-radius: 40px;
  padding: 1.6rem 0;
  margin: 0.9rem auto;
  transition: all 0.25s ease;
}

/* Keep inner width proportional */
.layers-block .glass-inner {
  max-width: 640px;
  width: 90%;
}

/* Subtle hover glow for aesthetic consistency */
.layers-block .glass-section:hover::before {
  box-shadow:
    0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent),
    inset 0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* On mobile, let them breathe a bit more */
@media (max-width: 640px) {
  .layers-block .glass-section {
    width: 80% !important;
    border-radius: 32px;
  }
}
/* === INTERACTIVE THREE-LAYER PILL === */
.layered-pane {
  width: 70%;
  margin: 1.5rem auto;
  border-radius: 40px;
  padding: 2rem 0;
  transition: all 0.3s ease;
}
.layer-tabs {
  display: flex;
  justify-content: center;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
.layer-tab {
  background: none;
  border: none;
  color: color-mix(in srgb, var(--leader-color) 40%, white 60%);
  font-family: 'Days One', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  padding: 0.5rem 0.8rem;
  font-size: 1.1rem;
  position: relative;
  transition: all 0.25s ease;
}
.layer-tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.15rem;
  height: 2px;
  background: color-mix(in srgb, var(--leader-color) 70%, transparent);
  opacity: 0;
  transition: opacity 0.25s ease;
}
.layer-tab.active {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
}
.layer-tab.active::after {
  opacity: 1;
}
.layer-content {
  display: none;
  animation: fadeIn 0.5s ease;
}
.layer-content:not(.hidden) {
  display: block;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
}
#fw-section-custom-html-e4b68b6f-e7c6-43bf-8349-956ced2344be {

.glass-section {
  position: relative;
  overflow: hidden;
}
.glass-section::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at top left,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 70%);
  pointer-events: none;
}

/* === PROFILE HERO HEADER — GLOWING PILL HERO === */
.profile-header-hero {
  text-align: center;
  padding: 3rem 1.5rem 2.5rem;
  border-radius: 9999px;
  margin: 0 auto 2.25rem;
  width: 85%;
  background: radial-gradient(circle at top center,
    color-mix(in srgb, currentColor 15%, transparent),
    transparent 75%);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow:
    0 0 28px color-mix(in srgb, currentColor 22%, transparent),
    inset 0 0 22px color-mix(in srgb, currentColor 18%, transparent);
}

/* === HERO TITLE === */
.profile-header-hero h1 {
  font-family: 'Days One', sans-serif;
  font-size: clamp(2rem, 4vw, 3.2rem);
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  line-height: 1.15;
  margin: 0;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 20%, transparent);
  animation: pulse-glow 4s ease-in-out infinite;
}

/* === HERO SUBTITLE === */
.profile-header-hero .hero-sub {
  display: block;
  font-size: 0.9em;
  opacity: 0.9;
  color: var(--leader-color, currentColor);
  text-shadow:
    0 0 5px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 30%, transparent);
}

/* === HERO COLOR ANIMATION === */
@keyframes pulse-glow {
  0%, 100% {
    text-shadow:
      0 0 6px color-mix(in srgb, var(--leader-color, currentColor) 70%, transparent),
      0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 40%, transparent);
  }
  50% {
    text-shadow:
      0 0 10px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 22px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

/* === LEADER COLOR SYNC — sets color + variable === */
.leader-orange,
.leader-orange .profile-header-hero,
.leader-orange .glass-section,
.leader-orange .glass-inner,
.leader-orange .glass-section::before {
  color: #FF9900 !important;
  --leader-color: #FF9900;
}

.leader-blue,
.leader-blue .profile-header-hero,
.leader-blue .glass-section,
.leader-blue .glass-inner,
.leader-blue .glass-section::before {
  color: #00D2FF !important;
  --leader-color: #00D2FF;
}

.leader-pink,
.leader-pink .profile-header-hero,
.leader-pink .glass-section,
.leader-pink .glass-inner,
.leader-pink .glass-section::before {
  color: #FF2299 !important;
  --leader-color: #FF2299;
}

/* === GLOW OVERLAY FOR PILLS === */
.leader .glass-section::before {
  background: radial-gradient(circle at top left,
    color-mix(in srgb, var(--leader-color, currentColor) 15%, transparent),
    transparent 70%);
  box-shadow:
    0 0 20px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent),
    inset 0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* === PILL CONTENT === */
.glass-section,
.glass-inner {
  color: var(--leader-color, currentColor);
}

/* === LAYERS BLOCK (three-layers section) === */
.layers-block {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 80%;
  margin: 0 auto 2rem;
}
.layers-block .glass-section {
  width: 100%;
  border-radius: 36px;
  background: rgba(255,255,255,0.07);
}
/* === FIX: ensure section titles (h2/h3) follow leader color === */
.glass-section h2,
.glass-section h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Optional: subtle pulse on headers, matches archetype hue */
@keyframes section-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 80%, transparent),
      0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 50%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: section-pulse 5s ease-in-out infinite;
}
/* === FINAL FIX: Archetype color priority inside profile area === */
#wr-profile .glass-section h2,
#wr-profile .glass-section h3,
#wr-profile .glass-inner h2,
#wr-profile .glass-inner h3 {
  color: var(--leader-color, currentColor) !important;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  animation: section-pulse 5s ease-in-out infinite;
}

/* Ensure correct inheritance scope */
#wr-profile.leader-orange { --leader-color: #FF9900; }
#wr-profile.leader-blue   { --leader-color: #00D2FF; }
#wr-profile.leader-pink   { --leader-color: #FF2299; }
/* Narrower layered pills for Mind/Body/Heart */
.glass-section h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
}
.glass-section:has(h3) {
  width: 65%;
  background: rgba(255,255,255,0.05);
  border-radius: 40px;
  padding: 1.4rem 0;
}

/* === BULLET STYLING FOR PROFILE TEXT === */

/* Apply bullet rhythm to all paragraphs except headers */
#wr-profile .glass-section p {
  position: relative;
  display: block;
  padding-left: 1.5rem;
  margin: 0.6rem auto;
  width: 85%;
  max-width: 720px;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
}

/* Add glowing bullet before each line of text */
#wr-profile .glass-section p::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0;
  color: var(--leader-color);
  font-size: 1.1em;
  text-shadow:
    0 0 6px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 14px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
}

/* If the paragraph is clearly a single headline or poetic line, center it */
#wr-profile .glass-section p:only-child,
#wr-profile .glass-section p:first-child:last-child {
  text-align: center;
  padding-left: 0;
}
#wr-profile .glass-section p:only-child::before {
  content: none;
}

/* Space between bullets */
#wr-profile .glass-section p + p {
  margin-top: 0.35rem;
}

/* Slight hover shimmer for interactivity */
#wr-profile .glass-section p:hover::before {
  text-shadow:
    0 0 10px color-mix(in srgb, var(--leader-color) 90%, transparent),
    0 0 20px color-mix(in srgb, var(--leader-color) 60%, transparent);
  transform: scale(1.15);
  transition: all 0.25s ease;
}

/* Special case: paragraphs that contain <strong> headers like “Gift:” or “Lesson:” */
#wr-profile .glass-section p strong {
  display: inline-block;
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === GLOWING BULLET LISTS — perfectly aligned === */
.wave-bullet-list {
  list-style: none;
  margin: 0.75rem auto;
  padding-left: 0;
  width: 85%;
  max-width: 720px;
}

.wave-bullet-list li {
  position: relative;
  padding-left: 1.6rem;
  margin: 0.35rem 0;
  line-height: 1.65;
  color: color-mix(in srgb, var(--leader-color) 35%, white 65%);
  font-weight: 450;
}

.wave-bullet-list li::before {
  content: "•";
  position: absolute;
  left: 0.4rem;
  top: 0.1em;
  color: var(--leader-color);
  font-size: 1.25em;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 80%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
  opacity: 0.9;
  line-height: 1;
}

/* Strong keywords stay glowing */
.wave-bullet-list li strong {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 16px color-mix(in srgb, var(--leader-color) 40%, transparent);
  font-weight: 700;
}
/* === FIX: Center headers properly & restore glow === */
.glass-section h2,
.glass-section h3 {
  text-align: center;
  font-family: 'Days One', sans-serif;
  letter-spacing: 0.025em;
  text-transform: uppercase;
  color: var(--leader-color, currentColor);
  margin: 0 0 1rem 0;
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
}

/* Add subtle glow pulse to headers for consistency */
@keyframes header-pulse {
  0%, 100% {
    text-shadow:
      0 0 8px color-mix(in srgb, var(--leader-color, currentColor) 60%, transparent),
      0 0 18px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent);
  }
  50% {
    text-shadow:
      0 0 12px color-mix(in srgb, var(--leader-color, currentColor) 85%, transparent),
      0 0 26px color-mix(in srgb, var(--leader-color, currentColor) 55%, transparent);
  }
}

.glass-section h2,
.glass-section h3 {
  animation: header-pulse 5s ease-in-out infinite;
}
/* === FIX: Narrow Mind/Body/Heart Layer Pills === */
.layers-block .glass-section {
  width: 65% !important;       /* narrower than the main pills */
  background: rgba(255, 255, 255, 0.05);
  border-radius: 40px;
  padding: 1.6rem 0;
  margin: 0.9rem auto;
  transition: all 0.25s ease;
}

/* Keep inner width proportional */
.layers-block .glass-inner {
  max-width: 640px;
  width: 90%;
}

/* Subtle hover glow for aesthetic consistency */
.layers-block .glass-section:hover::before {
  box-shadow:
    0 0 24px color-mix(in srgb, var(--leader-color, currentColor) 35%, transparent),
    inset 0 0 16px color-mix(in srgb, var(--leader-color, currentColor) 25%, transparent);
}

/* On mobile, let them breathe a bit more */
@media (max-width: 640px) {
  .layers-block .glass-section {
    width: 80% !important;
    border-radius: 32px;
  }
}
/* === INTERACTIVE THREE-LAYER PILL === */
.layered-pane {
  width: 70%;
  margin: 1.5rem auto;
  border-radius: 40px;
  padding: 2rem 0;
  transition: all 0.3s ease;
}
.layer-tabs {
  display: flex;
  justify-content: center;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
.layer-tab {
  background: none;
  border: none;
  color: color-mix(in srgb, var(--leader-color) 40%, white 60%);
  font-family: 'Days One', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  padding: 0.5rem 0.8rem;
  font-size: 1.1rem;
  position: relative;
  transition: all 0.25s ease;
}
.layer-tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.15rem;
  height: 2px;
  background: color-mix(in srgb, var(--leader-color) 70%, transparent);
  opacity: 0;
  transition: opacity 0.25s ease;
}
.layer-tab.active {
  color: var(--leader-color);
  text-shadow:
    0 0 8px color-mix(in srgb, var(--leader-color) 70%, transparent),
    0 0 18px color-mix(in srgb, var(--leader-color) 40%, transparent);
}
.layer-tab.active::after {
  opacity: 1;
}
.layer-content {
  display: none;
  animation: fadeIn 0.5s ease;
}
.layer-content:not(.hidden) {
  display: block;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
}