/* Experimental homepage only. This stylesheet is loaded by /homepage-experiment/. */
.homepage-experiment { --experiment-measure: 72rem; }
.homepage-experiment__main { overflow: clip; }
.experiment-masthead { position: relative; min-height: clamp(29rem, 62vh, 40rem); display: grid; align-items: end; isolation: isolate; border-bottom: 1px solid var(--section-border); }
.experiment-masthead__image, .experiment-masthead__veil { position: absolute; inset: 0; width: 100%; height: 100%; }
.experiment-masthead__image { object-fit: cover; object-position: center 42%; z-index: -2; filter: saturate(.7) contrast(.92) brightness(.58); }
.experiment-masthead__veil { z-index: -1; background: linear-gradient(90deg, color-mix(in srgb, var(--bg-primary) 94%, transparent), color-mix(in srgb, var(--bg-primary) 74%, transparent) 58%, color-mix(in srgb, var(--bg-primary) 35%, transparent)), linear-gradient(0deg, color-mix(in srgb, var(--bg-primary) 76%, transparent), transparent 55%); }
.experiment-masthead__inner { width: min(100% - 2rem, var(--experiment-measure)); padding: clamp(5.5rem, 12vh, 8.5rem) 0 clamp(2.5rem, 6vh, 4rem); }
.experiment-label, .experiment-section__eyebrow, .experiment-masthead__eyebrow, .experiment-card__meta { margin: 0 0 .75rem; color: var(--text-accent); font-family: var(--font-ui, inherit); font-size: .74rem; font-weight: 700; letter-spacing: .12em; line-height: 1.35; text-transform: uppercase; }
.experiment-label { display: inline-block; padding: .28rem .55rem; border: 1px solid color-mix(in srgb, var(--highlight) 56%, transparent); background: color-mix(in srgb, var(--bg-primary) 62%, transparent); }
.experiment-masthead h1 { max-width: 14ch; margin: 0; color: var(--hero-overlay-text); font-size: clamp(3rem, 8vw, 6.2rem); line-height: .94; text-wrap: balance; }
.experiment-masthead__lead { max-width: 34ch; margin: 1.2rem 0 .7rem; color: var(--hero-overlay-text); font-family: var(--font-display, inherit); font-size: clamp(1.35rem, 2.8vw, 2rem); line-height: 1.25; }
.experiment-masthead__copy { max-width: 60ch; margin: 0; color: var(--hero-overlay-subtext); font-size: clamp(1rem, 1.5vw, 1.16rem); line-height: 1.65; }
.experiment-masthead__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.experiment-masthead .hero-cta-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: clamp(9rem, 15vw, 12rem);
  min-height: 3rem;
  padding: .72rem 1.5rem;
  color: var(--hero-overlay-cta-text);
  background: rgba(0, 0, 0, .28);
  border: 1px solid var(--hero-overlay-cta-border);
  border-radius: 0;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03), 0 8px 22px rgba(0, 0, 0, .35);
  font-family: var(--page-title, "Cinzel", serif);
  font-size: clamp(.78rem, 1.2vw, 1rem);
  font-weight: 650;
  letter-spacing: .065em;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background-color .22s ease;
}
.experiment-masthead .hero-cta-button::before { content: ""; position: absolute; inset: 4px; pointer-events: none; border: 1px solid var(--hero-overlay-cta-inner-border); box-shadow: var(--hero-overlay-cta-inner-shadow); }
.experiment-masthead .hero-cta-button:hover, .experiment-masthead .hero-cta-button:focus-visible { border-color: var(--hero-overlay-cta-border-strong); box-shadow: 0 0 18px rgba(216, 181, 111, .18), 0 10px 30px rgba(0, 0, 0, .4); transform: translateY(-2px); }
.experiment-masthead .hero-cta-button:focus-visible { outline: 2px solid var(--hero-overlay-cta-border-strong); outline-offset: 4px; }
.experiment-button-secondary { background: color-mix(in srgb, var(--bg-primary) 60%, transparent); color: var(--hero-overlay-text); border-color: color-mix(in srgb, var(--highlight) 72%, transparent); }
.experiment-content { width: min(100% - 2rem, var(--experiment-measure)); padding-top: clamp(2.75rem, 7vw, 6rem); padding-bottom: clamp(3rem, 8vw, 7rem); }
.experiment-section { margin: 0 0 clamp(4rem, 9vw, 8rem); scroll-margin-top: 2rem; }
.homepage-experiment .home-pathway-heading { width: 100%; max-width: none; margin: 0 0 clamp(1.5rem, 3vw, 2.25rem); text-align: left; }
.homepage-experiment .home-pathway-heading .section-heading { width: 100%; max-width: none; margin: 0 0 clamp(.65rem, 1.5vw, 1rem); font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.05; text-wrap: balance; }
.experiment-membership h2 { margin: 0 0 .6rem; font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.05; text-wrap: balance; }
.experiment-section__header .lead, .experiment-explanation .lead { margin: 0; line-height: 1.55; }
.experiment-card-grid .pillar-grid { margin: 0; }
.homepage-experiment .experiment-card-grid .gnostic-card:has(.card-media) .badge-bl {
  right: clamp(1.35rem, 2.8vw, 2rem);
  bottom: clamp(1.35rem, 2.8vw, 2rem);
  left: auto;
  margin: 0;
}
.homepage-experiment .experiment-card-grid .gnostic-card:has(.card-media) .badge-bl .read-time-badge {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--text-accent);
  font-family: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1;
  text-transform: uppercase;
  opacity: 0.82;
}
.experiment-start-card { border: 1px solid color-mix(in srgb, var(--section-border) 80%, var(--highlight) 20%); background: color-mix(in srgb, var(--bg-primary) 86%, var(--section-bg-top) 14%); }
.experiment-start-card h3 { margin: 0 0 .65rem; font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1.16; }
.experiment-start-card p:not(.experiment-card__meta) { margin: 0; color: var(--text-secondary); line-height: 1.6; }
.experiment-pathways { display: grid; gap: clamp(2.5rem, 6vw, 5rem); }
.experiment-pathways__group > h3 { margin: 0 0 .5rem; font-size: clamp(1.35rem, 2.4vw, 2rem); }
.experiment-pathways__group > p { max-width: 70ch; margin: 0 0 1.5rem; color: var(--text-secondary); line-height: 1.65; }
.experiment-start-card h3 a, .experiment-start-card > a, .experiment-text-link { color: inherit; text-decoration-color: var(--highlight); text-underline-offset: .18em; }
.experiment-start-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.experiment-start-card { padding: 1.35rem; }
.experiment-start-card > a { display: inline-block; margin-top: 1.1rem; color: var(--text-accent); font-weight: 700; }
.experiment-explanation { max-width: 68ch; }
.experiment-explanation > p { line-height: 1.7; }
.experiment-text-link { display: inline-block; margin-top: .5rem; font-weight: 700; }
.experiment-membership { display: flex; align-items: end; justify-content: space-between; gap: 2rem; padding: clamp(1.5rem, 4vw, 3rem); border: 1px solid color-mix(in srgb, var(--highlight) 44%, var(--section-border) 56%); background: linear-gradient(135deg, color-mix(in srgb, var(--highlight) 11%, transparent), transparent 62%); }
.experiment-membership > div { max-width: 52rem; }
.experiment-membership p { margin: 0; color: var(--text-secondary); line-height: 1.65; }
@media (max-width: 840px) { .experiment-start-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .experiment-masthead { min-height: 31rem; } .experiment-masthead__inner, .experiment-content { width: min(100% - 1.25rem, var(--experiment-measure)); } .experiment-masthead__veil { background: linear-gradient(90deg, color-mix(in srgb, var(--bg-primary) 94%, transparent), color-mix(in srgb, var(--bg-primary) 66%, transparent)), linear-gradient(0deg, color-mix(in srgb, var(--bg-primary) 84%, transparent), transparent 60%); } .experiment-masthead__image { object-position: 62% center; } .experiment-start-grid { grid-template-columns: 1fr; } .experiment-membership { align-items: flex-start; flex-direction: column; } .experiment-membership .btn { width: 100%; text-align: center; } }