/* Adult Creator Engagement Funnel page scope: keeps the traffic-to-intent section implementation isolated from shared theme templates and prevents global selector leakage. */
.adult-creator-engagement-funnel-page {
  /* ACEF section rhythm ontology: standard sections reset the narrative, compact sections continue a proof thread, and large sections open or close major page arcs within this page only. */
  --acef-section-space-standard: clamp(48px, 7vw, 96px);
  --acef-section-space-compact: clamp(32px, 5vw, 68px);
  --acef-section-space-large: clamp(56px, 8vw, 112px);
  background: var(--color-background);
  color: var(--color-foreground);
  min-height: 100vh;
  overflow-x: clip;
}



/* ACEF pain hero shell: makes the new first section feel like the page opening while keeping all styling inside the adult creator page scope. */
.adult-creator-engagement-funnel-page .acef-pain-hero {
  /* ACEF rhythm use: large-to-standard spacing opens the page while preserving the first-screen hero composition. */
  padding: var(--acef-section-space-large) 0 var(--acef-section-space-standard);
}

/* ACEF pain hero container: follows the local 1200px content rhythm without introducing a global container helper. */
.adult-creator-engagement-funnel-page .acef-pain-hero__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: calc(var(--layout-content-max-width, 1200px) + 40px);
  padding-inline: 20px;
  width: 100%;
}

/* ACEF pain hero grid: constrains the desktop proof column so screenshots support the Hero narrative instead of becoming the main layout mass, while mobile stacking remains handled by the scoped fallback below. */
.adult-creator-engagement-funnel-page .acef-pain-hero__grid {
  align-items: start;
  display: grid;
  gap: clamp(32px, 5.8vw, 72px);
  grid-template-columns: minmax(0, 0.95fr) minmax(300px, 0.68fr);
}

/* ACEF pain hero content: limits the long-form argument so the authorial paragraphs remain readable on wide screens. */
.adult-creator-engagement-funnel-page .acef-pain-hero__content {
  max-width: 690px;
}

/* ACEF pain hero title: applies the theme's Roboto Thin hero convention to the new H1 without adding an eyebrow above it. */
.adult-creator-engagement-funnel-page .acef-pain-hero__title {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(3rem, 8.4vw, 6.4rem);
  font-weight: 100;
  letter-spacing: -0.055em;
  line-height: 0.94;
  margin: 0 0 clamp(24px, 4vw, 38px);
}

/* ACEF pain hero copy: uses Raleway Regular for long reading flow and preserves the supplied tone in paragraph form without the removed Hero-only scroll highlight. */
.adult-creator-engagement-funnel-page .acef-pain-hero__copy {
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.45vw, 1.08rem);
  gap: 10px;
  line-height: 1.72;
  max-width: 660px;
}

/* ACEF pain hero paragraph reset: treats authorial Hero copy as primary content, so it keeps local paragraph rhythm and the site foreground color instead of muted evidence/helper styling. */
.adult-creator-engagement-funnel-page .acef-pain-hero__copy p {
  color: var(--color-foreground);
  margin: 0;
}

/* ACEF pain hero semantic emphasis: turns the approved strong markup into a restrained orange signal for the pain-first reading path without adding bold corporate weight or affecting route chips. */
.adult-creator-engagement-funnel-page .acef-pain-hero strong {
  color: var(--color-primary);
  font-weight: inherit;
}


/* ACEF pain hero evidence stack: holds the proof switcher and active screenshot card beside the copy, with a desktop cap that prevents the proof card from overpowering the Hero text. */
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence {
  display: grid;
  gap: 18px;
  justify-self: end;
  max-width: 440px;
  min-width: 0;
  width: 100%;
}

/* ACEF pain hero evidence note: uses restrained orange emphasis to define what the screenshots prove before the user reads individual captions. */
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence-note {
  border-left: 2px solid var(--color-primary);
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(0.94rem, 1.35vw, 1rem);
  line-height: 1.58;
  margin: 0;
  padding-left: 14px;
}

/* ACEF proof switcher: layers the Hero cue placement and slightly wider local spacing on top of the global artifact-switcher contract. */
.adult-creator-engagement-funnel-page .acef-pain-hero__switcher {
  gap: 10px;
}

/* ACEF proof switcher cue: provides the requested compact instruction while staying visually secondary to the Case A/Case B controls. */
.adult-creator-engagement-funnel-page .acef-pain-hero__switcher-cue {
  color: var(--color-foreground);
  flex-basis: 100%;
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  line-height: 1.3;
  text-transform: uppercase;
}

/* ACEF proof case tab: keeps only Hero-specific Case A/Case B typography while shared tab visuals come from .artifact-switcher-tab. */
.adult-creator-engagement-funnel-page .acef-pain-hero__case-tab {
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* ACEF pain hero evidence item: wraps each caption and screenshot in a premium surface while preserving figure/tabpanel semantics. */
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence-item {
  background: linear-gradient(145deg, var(--surface-2), var(--surface-3, var(--surface-1)));
  border: 1px solid var(--border-subtle);
  border-radius: 24px;
  box-shadow: var(--shadow-neutral-1);
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  padding: clamp(16px, 2.4vw, 22px);
}

/* ACEF enhanced proof state: once JS confirms tab support, inactive proof panels are removed from view while remaining available as no-JS source-order content. */
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence.is-enhanced .acef-pain-hero__evidence-item:not(.is-active) {
  display: none;
}

/* ACEF active proof animation: gives the newly selected panel a restrained fade-in that matches the page's existing soft Hero motion. */
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence.is-enhanced .acef-pain-hero__evidence-item.is-active {
  animation: acef-proof-panel-fade 220ms ease both;
}

/* ACEF pain hero caption: places the requested caption copy above each screenshot and gives it a compact evidence-label rhythm. */
.adult-creator-engagement-funnel-page .acef-pain-hero__caption {
  display: grid;
  gap: 6px;
  margin: 0 0 14px;
}

/* ACEF pain hero caption title: highlights each internal traffic test label with the existing orange theme variable. */
.adult-creator-engagement-funnel-page .acef-pain-hero__caption-title {
  color: var(--color-primary);
  font-family: 'Roboto Regular', sans-serif;
  font-size: 0.86rem;
  letter-spacing: 0.08em;
  line-height: 1.3;
  text-transform: uppercase;
}

/* ACEF pain hero caption copy: keeps metric-heavy caption text readable and safely wrappable inside narrow cards. */
.adult-creator-engagement-funnel-page .acef-pain-hero__caption-copy {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.92rem;
  line-height: 1.48;
  opacity: 0.78;
  overflow-wrap: anywhere;
}

/* ACEF pain hero screenshot: makes supplied webp evidence fluid, rounded, and contained within the page-scoped evidence cards. */
.adult-creator-engagement-funnel-page .acef-pain-hero__screenshot {
  border: 1px solid color-mix(in srgb, var(--border-subtle) 72%, var(--color-primary) 28%);
  border-radius: 18px;
  display: block;
  height: auto;
  max-width: 100%;
  width: 100%;
}

/* ACEF pain hero entrance motion: applies a soft CSS-only fade-up/stagger to text and evidence without adding JS animation. */
.adult-creator-engagement-funnel-page .acef-pain-hero__title,
.adult-creator-engagement-funnel-page .acef-pain-hero__copy,
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence-note,
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence-item {
  animation: acef-pain-hero-fade-up 560ms ease both;
}

/* ACEF pain hero stagger: delays the paragraph group slightly so the title remains the first perceived element. */
.adult-creator-engagement-funnel-page .acef-pain-hero__copy {
  animation-delay: 90ms;
}

/* ACEF pain hero evidence note stagger: introduces the interpretation note before the screenshots animate in. */
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence-note {
  animation-delay: 150ms;
}

/* ACEF pain hero evidence item stagger: separates screenshot cards gently so the evidence stack does not pop in at once. */
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence-item:nth-of-type(1) {
  animation-delay: 210ms;
}

/* ACEF pain hero evidence item stagger: offsets the second screenshot after the first while keeping the effect restrained. */
.adult-creator-engagement-funnel-page .acef-pain-hero__evidence-item:nth-of-type(2) {
  animation-delay: 280ms;
}

/* ACEF pain hero keyframes: defines the shared soft fade-up used only by the new page-scoped hero elements. */
@keyframes acef-pain-hero-fade-up {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ACEF route node keyframes: defines the single restrained chip reveal used by the Hero route infographic only. */
@keyframes acef-route-node-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ACEF route relay lead keyframes: combines the existing highlight intervals with a tiny transform tremble so only next step gets motion while chips keep shimmer-only behavior. */
@keyframes acef-route-relay-lead {
  0%, 10%, 33.333%, 43.333%, 66.666%, 76.666%, 100% {
    background-color: transparent;
    box-shadow: none;
    filter: none;
    transform: translateX(0) rotate(0deg);
  }

  1.5%, 34.833%, 68.166% {
    transform: translateX(-0.7px) rotate(-0.35deg);
  }

  3%, 36.333%, 69.666% {
    background-color: color-mix(in srgb, var(--color-primary) 18%, transparent);
    box-shadow: 0 0 18px color-mix(in srgb, var(--color-primary) 20%, transparent);
    filter: brightness(1.12);
    transform: translateX(0.7px) rotate(0.35deg);
  }

  4.5%, 37.833%, 71.166% {
    transform: translateX(-0.4px) rotate(-0.2deg);
  }
}

/* ACEF route relay connector keyframes: lets the decorative arrow glow after next step so the visual impulse reads as moving toward the routes. */
@keyframes acef-route-relay-connector {
  0%, 14%, 33.333%, 47.333%, 66.666%, 80.666%, 100% {
    filter: none;
    opacity: 0.82;
  }

  7%, 40.333%, 73.666% {
    filter: drop-shadow(0 0 9px color-mix(in srgb, var(--color-primary) 46%, transparent));
    opacity: 1;
  }
}

/* ACEF route relay chip keyframes: applies a short orange shimmer to one chip at a time, keeping route chips readable and non-click-like between passes. */
@keyframes acef-route-relay-chip {
  0%, 4.8%, 100% {
    background-color: color-mix(in srgb, var(--color-background) 88%, var(--color-primary) 12%);
    border-color: color-mix(in srgb, var(--color-primary) 58%, var(--border-subtle) 42%);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-primary) 10%, transparent);
    filter: none;
  }

  2.4% {
    background-color: color-mix(in srgb, var(--color-background) 72%, var(--color-primary) 28%);
    border-color: color-mix(in srgb, var(--color-primary) 82%, var(--border-subtle) 18%);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-primary) 22%, transparent), 0 0 16px color-mix(in srgb, var(--color-primary) 18%, transparent);
    filter: brightness(1.08);
  }
}


/* ACEF proof panel keyframes: limits active-panel switching to a subtle opacity change so the dossier does not feel like a marketing slider. */
@keyframes acef-proof-panel-fade {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* Traffic-to-intent shell: keeps the existing section but shifts it from hero-like split content into a page-width Solution / Mechanism module. */

/* ACEF compact hero reform: local layout styles support the shortened Hero, CTA row, proof slot, and blind-spot bridge without changing global button or artifact-tab contracts. */
.adult-creator-engagement-funnel-page .acef-pain-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  margin-top: clamp(1.25rem, 3vw, 2rem);
}

.adult-creator-engagement-funnel-page .acef-pain-hero__cta {
  width: fit-content;
}

.adult-creator-engagement-funnel-page .acef-pain-hero__evidence-title {
  color: var(--color-foreground);
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  line-height: 1.1;
  margin: 0 0 0.75rem;
}

/* ACEF blind spot bridge: introduces the new static transition between Hero and mechanism using existing surface, border, and layout tokens. */
.adult-creator-engagement-funnel-page .acef-blind-spot {
  padding: clamp(3rem, 7vw, 5.5rem) var(--layout-container-padding-inline, 1rem);
}

.adult-creator-engagement-funnel-page .acef-blind-spot__container {
  width: min(100%, var(--layout-section-max-width, 1120px));
  margin: 0 auto;
  padding: clamp(1.4rem, 3vw, 2.25rem);
  border: 1px solid var(--border-subtle);
  border-radius: 28px;
  background: linear-gradient(135deg, var(--surface-1), var(--surface-2));
  box-shadow: var(--shadow-neutral-2);
}

.adult-creator-engagement-funnel-page .acef-blind-spot__title {
  max-width: 760px;
  margin: 0 0 1rem;
  color: var(--color-foreground);
  font-size: clamp(1.75rem, 3vw, 2.7rem);
  line-height: 1.08;
}

.adult-creator-engagement-funnel-page .acef-blind-spot__copy {
  display: grid;
  gap: 0.9rem;
  max-width: 860px;
  color: var(--color-foreground);
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  line-height: 1.72;
}

.adult-creator-engagement-funnel-page .acef-blind-spot__copy p {
  margin: 0;
}

@media (max-width: 640px) {
  /* ACEF compact mobile rhythm: keeps the Hero actions full-width only on page-adult-creator-engagement-funnel.php, stacks/stretch-aligns the CTA row, and prevents narrow mobile overflow without changing desktop fit-content CTA behavior. */
  .adult-creator-engagement-funnel-page .acef-pain-hero__actions {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
  }

  /* ACEF Hero mobile CTA containment: mirrors the Services mobile box-sizing pattern so primary .cta-button and secondary .scenario-button-base labels stay centered while padding/borders remain inside the viewport. */
  .adult-creator-engagement-funnel-page .acef-pain-hero__cta {
    box-sizing: border-box;
    max-width: 100%;
    text-align: center;
    width: 100%;
  }

  .adult-creator-engagement-funnel-page .acef-blind-spot__container {
    border-radius: 22px;
  }
}

.adult-creator-engagement-funnel-page .acef-traffic-to-intent {
  /* ACEF rhythm use: standard-to-large spacing gives the mechanism section a full narrative reset before the proof demo. */
  padding: var(--acef-section-space-standard) 0 var(--acef-section-space-large);
}

/* Traffic-to-intent container: reuses the site's 1200px layout width via local sizing so global.css does not need new selectors. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: calc(var(--layout-content-max-width, 1200px) + 40px);
  padding-inline: 20px;
  width: 100%;
}

/* Traffic-to-intent stack: keeps the H2 above the card while the support copy and CTA live inside the card for the restored desktop composition. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent__stack {
  display: grid;
  gap: clamp(24px, 4vw, 42px);
  min-width: 0;
}

/* Intro area: scopes centering to the section H2 only because the support definition and CTA are now part of the card support column. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent__intro {
  margin-inline: auto;
  max-width: 900px;
  text-align: center;
  width: 100%;
}

/* Section title: preserves the existing class and visual weight while sizing it down from hero scale because the page already has one H1. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent__title {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(2.25rem, 5.8vw, 4.6rem);
  font-weight: 100;
  letter-spacing: -0.04em;
  line-height: 0.98;
  margin: 0;
}

/* Traffic-to-intent emphasis: locally highlights semantic strong text in ACEF traffic-to-intent section only, without changing the global strong contract in assets/css/global.css. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent strong {
  color: var(--color-primary);
  font-weight: inherit;
}

/* Full-width mechanism wrapper: lets the expandable card become the main content object across the content column instead of a secondary right-side visual. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent__visual {
  display: block;
  min-width: 0;
  width: 100%;
}

/* Funnel card: restores the proven two-track desktop card so mechanism content and support copy occupy sibling columns in this section. */
.adult-creator-engagement-funnel-page .acef-funnel-card {
  align-items: start;
  background: linear-gradient(145deg, var(--surface-2), var(--surface-3));
  border: 1px solid var(--border-subtle);
  border-radius: 30px;
  border-top: 3px solid color-mix(in srgb, var(--color-primary) 78%, var(--color-foreground) 22%);
  box-shadow: var(--shadow-neutral-2);
  box-sizing: border-box;
  display: grid;
  gap: clamp(28px, 4vw, 48px);
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  min-width: 0;
  padding: clamp(22px, 4vw, 38px);
  position: relative;
  width: 100%;
}

/* Mechanism stack: keeps label, helper, and disclosure cards close together so the left column reads as one compact product mechanism. */
.adult-creator-engagement-funnel-page .acef-funnel-card__mechanism {
  align-self: start;
  display: grid;
  gap: 12px;
  min-width: 0;
}


/* Support column: restores the right direct child of the desktop card so concise ACEF support copy stays visually connected to the mechanism. */
.adult-creator-engagement-funnel-page .acef-funnel-card__support {
  align-self: start;
  display: grid;
  gap: clamp(20px, 3vw, 28px);
  max-width: 34rem;
  min-width: 0;
}

/* Support explanation: keeps meaningful definition copy fully opaque and readable while using typography and spacing, not opacity, for hierarchy. */
.adult-creator-engagement-funnel-page .acef-funnel-card__explanation {
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.4vw, 1.16rem);
  gap: 14px;
  line-height: 1.62;
  min-width: 0;
  opacity: 1;
}

/* Support explanation paragraphs: removes default margins so the restored support stack owns vertical rhythm inside the card. */
.adult-creator-engagement-funnel-page .acef-funnel-card__explanation p {
  margin: 0;
  opacity: 1;
}

/* Support followup: keeps the CTA-adjacent layer visible and attached to the concise explanation inside the restored support column. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent__followup {
  display: grid;
  gap: 14px;
  justify-items: start;
  min-width: 0;
  opacity: 1;
}

/* Support actions: lays out the existing primary CTA without changing the shared button contract or analytics selector. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  min-width: 0;
  opacity: 1;
}

/* Funnel card heading: keeps the required module label and compact uppercase rhythm while the parent H2 owns the section heading. */
.adult-creator-engagement-funnel-page .acef-funnel-card__heading {
  color: var(--color-primary);
  font-family: 'Roboto Regular', sans-serif;
  font-size: 0.84rem;
  letter-spacing: 0.1em;
  line-height: 1.3;
  margin: 0;
  text-transform: uppercase;
}

/* Funnel helper: explains the disclosure behavior directly under the mechanism label before users reach the path cards. */
.adult-creator-engagement-funnel-page .acef-funnel-card__helper {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.94rem;
  line-height: 1.5;
  margin: 0;
}

/* Expandable path list: preserves the ordered path semantics while removing browser list chrome for a custom card stack. */
.adult-creator-engagement-funnel-page .acef-path-steps {
  display: grid;
  gap: 12px;
  list-style: none;
  margin: 4px 0 0;
  min-width: 0;
  padding: 0;
}

/* Path list item: keeps each disclosure card fluid so open states cannot force horizontal overflow on mobile. */
.adult-creator-engagement-funnel-page .acef-path-step {
  box-sizing: border-box;
  min-width: 0;
}

/* Path card shell: uses native details state with a premium surface, subtle border, and stable spacing for one-open-at-a-time expansion. */
.adult-creator-engagement-funnel-page .acef-path-card {
  background: color-mix(in srgb, var(--surface-1) 86%, var(--surface-2) 14%);
  border: 1px solid var(--border-subtle);
  border-radius: 20px;
  box-sizing: border-box;
  min-width: 0;
  overflow: hidden;
  transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
  width: 100%;
}

/* Open path card: highlights the active route with an accent border and restrained lift without turning the traffic-to-intent section into a flashy flipcard. */
.adult-creator-engagement-funnel-page .acef-path-card[open] {
  background: color-mix(in srgb, var(--surface-2) 78%, var(--color-primary) 7%);
  border-color: color-mix(in srgb, var(--color-primary) 38%, var(--border-subtle) 62%);
  box-shadow: var(--shadow-neutral-1);
  transform: translateY(-1px);
}

/* Path summary control: creates a comfortable full-width click target while retaining native disclosure keyboard behavior. */
.adult-creator-engagement-funnel-page .acef-path-card__summary {
  align-items: center;
  box-sizing: border-box;
  cursor: pointer;
  display: grid;
  gap: 12px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  list-style: none;
  min-height: 74px;
  min-width: 0;
  padding: 15px 16px;
  width: 100%;
}

/* Browser marker reset: hides the default triangle only inside this scoped visual because a custom indicator communicates open state. */
.adult-creator-engagement-funnel-page .acef-path-card__summary::-webkit-details-marker {
  display: none;
}

/* Focus state: gives keyboard users a clear visible outline around the native disclosure control. */
.adult-creator-engagement-funnel-page .acef-path-card__summary:focus-visible {
  border-radius: 16px;
  outline: 2px solid var(--color-primary);
  outline-offset: -4px;
}

/* Step number: anchors each phase visually and prevents the component from reading like a standard FAQ list. */
.adult-creator-engagement-funnel-page .acef-path-card__number {
  align-items: center;
  background: color-mix(in srgb, var(--surface-2) 72%, var(--color-primary) 28%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 55%, var(--color-primary) 45%);
  border-radius: 999px;
  color: var(--color-primary);
  display: inline-flex;
  flex: 0 0 auto;
  font-family: 'Roboto Regular', sans-serif;
  font-size: 0.82rem;
  height: 42px;
  justify-content: center;
  width: 42px;
}

/* Summary copy: stacks the phase name and compact visible summary with safe wrapping for narrow screens. */
.adult-creator-engagement-funnel-page .acef-path-card__copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

/* Path title: emphasizes the funnel phase while keeping the expanded explanation as secondary content. */
.adult-creator-engagement-funnel-page .acef-path-card__title {
  color: var(--color-foreground);
  font-family: 'Roboto Regular', sans-serif;
  font-size: 1rem;
  line-height: 1.2;
}

/* Visible summary: keeps the compact state informative before the card opens. */
.adult-creator-engagement-funnel-page .acef-path-card__visible {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.9rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

/* Disclosure indicator: provides a lightweight plus mark that rotates into a minus-like open state without adding image or SVG dependencies. */
.adult-creator-engagement-funnel-page .acef-path-card__indicator {
  align-items: center;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  display: inline-flex;
  height: 28px;
  justify-content: center;
  position: relative;
  transition: transform 180ms ease, border-color 180ms ease;
  width: 28px;
}

/* Disclosure indicator strokes: draws the plus icon in CSS so decorative state remains hidden from assistive technology. */
.adult-creator-engagement-funnel-page .acef-path-card__indicator::before,
.adult-creator-engagement-funnel-page .acef-path-card__indicator::after {
  background: var(--color-primary);
  content: '';
  height: 2px;
  position: absolute;
  width: 11px;
}

/* Disclosure indicator vertical stroke: rotates away on open to communicate collapse affordance without layout movement. */
.adult-creator-engagement-funnel-page .acef-path-card__indicator::after {
  transform: rotate(90deg);
  transition: transform 180ms ease;
}

/* Open indicator: changes the icon and border to mirror the active card state. */
.adult-creator-engagement-funnel-page .acef-path-card[open] .acef-path-card__indicator {
  border-color: var(--color-primary);
  transform: rotate(180deg);
}

/* Open indicator stroke: removes the vertical stroke visually so users read the control as currently expanded. */
.adult-creator-engagement-funnel-page .acef-path-card[open] .acef-path-card__indicator::after {
  transform: rotate(0deg) scaleX(0);
}

/* Expanded panel: keeps explanatory copy readable and contained, with padding separated from the clickable summary to reduce accidental taps. */
.adult-creator-engagement-funnel-page .acef-path-card__panel {
  border-top: 1px solid var(--border-subtle);
  box-sizing: border-box;
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.94rem;
  line-height: 1.58;
  min-width: 0;
  padding: 0 16px 16px 70px;
}

/* Expanded panel text: removes default paragraph margins so open cards maintain stable rhythm in the traffic-to-intent section. */
.adult-creator-engagement-funnel-page .acef-path-card__panel p {
  margin: 13px 0 0;
}

/* Traffic-to-intent CTA sizing only: keeps desktop actions content-width while preserving the shared CTA and scenario button visual behavior from global.css. */
.adult-creator-engagement-funnel-page .acef-traffic-to-intent__cta {
  box-sizing: border-box;
  text-align: center;
}


@media (max-width: 1024px) {
  /* Tablet ACEF funnel card: collapses the restored support column before the two desktop tracks become cramped. */
  .adult-creator-engagement-funnel-page .acef-funnel-card {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Tablet ACEF funnel children: keeps mechanism first and support second while both columns remain fluid after collapse. */
  .adult-creator-engagement-funnel-page .acef-funnel-card__mechanism,
  .adult-creator-engagement-funnel-page .acef-funnel-card__support {
    max-width: 100%;
    min-width: 0;
  }
}

/* ACEF live POC shell: opens the fictional Marta Vane proof-of-concept after the mechanism section with the same dark, premium page rhythm. */
.adult-creator-engagement-funnel-page .acef-live-poc {
  /* ACEF rhythm use: large spacing frames the proof-of-concept as a major page arc without changing internal cards. */
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface-2) 72%, transparent), var(--color-background));
  border-top: 1px solid var(--border-subtle);
  padding: var(--acef-section-space-large) 0;
}

/* ACEF live POC container: repeats the local 1200px-plus-padding contract instead of introducing a shared container helper. */
.adult-creator-engagement-funnel-page .acef-live-poc__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: calc(var(--layout-content-max-width, 1200px) + 40px);
  padding-inline: 20px;
  width: 100%;
}

/* ACEF live POC grid: creates the requested desktop split with Marta's portrait/copy on the left and social mockups on the right. */
.adult-creator-engagement-funnel-page .acef-live-poc__grid {
  align-items: start;
  display: grid;
  gap: clamp(28px, 5vw, 58px);
  grid-template-columns: minmax(0, 0.92fr) minmax(320px, 0.82fr);
  min-width: 0;
}

/* ACEF live POC intro: stacks heading, portrait, and first-person explanation as one fictional persona card column. */
.adult-creator-engagement-funnel-page .acef-live-poc__intro {
  display: grid;
  gap: clamp(18px, 3vw, 26px);
  min-width: 0;
}

/* ACEF live POC title: uses the page's thin display voice while staying smaller than the main pain hero H1. */
.adult-creator-engagement-funnel-page .acef-live-poc__title {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(2.35rem, 6vw, 5rem);
  font-weight: 100;
  letter-spacing: -0.05em;
  line-height: 0.98;
  margin: 0;
}

/* ACEF live POC reference tooltip: resets inherited display-heading tracking and weight so the dst_ref message remains legible at desktop and mobile widths. */
.adult-creator-engagement-funnel-page .acef-live-poc__title .dst-ref__tooltip {
  font-weight: 400;
  letter-spacing: normal;
  text-align: left;
}

/* ACEF portrait/speech card: makes Marta's portrait a positioned overlay container so her approved first-person voice attaches to the image and rebalances the desktop LIVE POC height against the social mockup. */
.adult-creator-engagement-funnel-page .acef-live-poc__portrait-card {
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface-1) 80%, #ffd5df 8%), color-mix(in srgb, var(--surface-2) 88%, var(--color-primary) 6%));
  border: 1px solid color-mix(in srgb, var(--border-subtle) 78%, #ffd5df 22%);
  border-radius: 28px;
  box-shadow: 0 22px 58px rgba(0, 0, 0, 0.24);
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  padding: clamp(14px, 2.2vw, 18px);
  position: relative;
}

/* ACEF portrait contrast gradient: adds a bottom-weighted reading surface behind the desktop speech overlay while fading before Marta's face so the portrait remains premium and identifiable. */
.adult-creator-engagement-funnel-page .acef-live-poc__portrait-card::after {
  background: linear-gradient(180deg, rgba(12, 12, 16, 0) 26%, rgba(12, 12, 16, 0.64) 58%, rgba(12, 12, 16, 0.92) 100%);
  border-radius: 20px;
  bottom: clamp(14px, 2.2vw, 18px);
  content: '';
  left: clamp(14px, 2.2vw, 18px);
  pointer-events: none;
  position: absolute;
  right: clamp(14px, 2.2vw, 18px);
  top: clamp(14px, 2.2vw, 18px);
  z-index: 1;
}

/* ACEF portrait image: keeps the provided Marta asset fluid inside the card and reserves the upper portrait area for face visibility behind the lower speech overlay. */
.adult-creator-engagement-funnel-page .acef-live-poc__portrait {
  aspect-ratio: 4 / 5;
  border-radius: 20px;
  display: block;
  max-width: 100%;
  object-fit: cover;
  width: 100%;
}

/* ACEF first-person copy: overlays Marta's speech on the lower portrait area on desktop, tightening the type rhythm to reduce left-column height while preserving comfortable readability. */
.adult-creator-engagement-funnel-page .acef-live-poc__copy {
  bottom: clamp(28px, 3.4vw, 38px);
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(0.88rem, 1.05vw, 0.98rem);
  gap: 7px;
  left: clamp(28px, 3.4vw, 38px);
  line-height: 1.5;
  max-width: min(88%, 560px);
  position: absolute;
  right: clamp(28px, 3.4vw, 38px);
  text-shadow: 0 1px 18px rgba(0, 0, 0, 0.58);
  z-index: 2;
}

/* ACEF copy paragraphs: removes default margins so the speech keeps the same compact rhythm inside the shared portrait frame. */
.adult-creator-engagement-funnel-page .acef-live-poc__copy p {
  margin: 0;
}

/* ACEF speech marker: adds a typographic opening dialogue mark before Marta's approved first line without changing the wording or introducing a separate quote component. */
.adult-creator-engagement-funnel-page .acef-live-poc__speech-mark {
  color: var(--color-primary);
  display: inline-block;
  font-family: 'Roboto Thin', sans-serif;
  font-size: 2.2em;
  line-height: 0;
  margin-right: 0.08em;
  transform: translateY(0.18em);
}

/* ACEF speech emphasis: preserves the section-local orange strong treatment inside Marta's shared portrait/speech card without affecting social mockup captions. */
.adult-creator-engagement-funnel-page .acef-live-poc__copy strong {
  color: var(--color-primary);
  font-family: 'Raleway SemiBold', sans-serif;
}

/* ACEF social card: presents the right-side profile/story mockups as a polished proof-of-concept device panel. */
.adult-creator-engagement-funnel-page .acef-live-poc__social {
  background: radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 34%), linear-gradient(145deg, var(--surface-2), color-mix(in srgb, var(--surface-3, var(--surface-1)) 90%, #ffd5df 10%));
  border: 1px solid var(--border-subtle);
  border-radius: 30px;
  box-shadow: var(--shadow-neutral-2);
  box-sizing: border-box;
  display: grid;
  gap: 18px;
  min-width: 0;
  overflow: hidden;
  padding: clamp(18px, 3vw, 28px);
}

/* ACEF social header: defines the mockups as entry-point context rather than a completed funnel or final result screen. */
.adult-creator-engagement-funnel-page .acef-live-poc__social-header {
  display: grid;
  gap: 8px;
  min-width: 0;
}

/* ACEF social eyebrow: adds the orange B2B proof label used across the ACEF visual language. */
.adult-creator-engagement-funnel-page .acef-live-poc__eyebrow {
  color: var(--color-primary);
  font-family: 'Roboto Regular', sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  line-height: 1.3;
  margin: 0;
  text-transform: uppercase;
}

/* ACEF social copy: explains the manual tab switcher before the screenshots without adding analytics-visible CTA copy. */
.adult-creator-engagement-funnel-page .acef-live-poc__social-copy {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.98rem;
  line-height: 1.55;
  margin: 0;
  opacity: 0.76;
}

/* ACEF panels stack: keeps both figures in readable source order until JS enhancement hides the inactive panel. */
.adult-creator-engagement-funnel-page .acef-live-poc__panels {
  display: grid;
  gap: 16px;
  justify-items: center;
  min-width: 0;
}

/* ACEF enhanced panels: mirrors the route evidence tab-panel contract so Profile and Story link occupy one shared mockup slot after JS validation. */
.adult-creator-engagement-funnel-page .acef-live-poc.is-enhanced .acef-live-poc__panels {
  display: block;
}

/* ACEF mockup panel: frames each social screenshot as a mobile device-like artifact with restrained shadow and safe overflow. */
.adult-creator-engagement-funnel-page .acef-live-poc__panel {
  background: color-mix(in srgb, var(--color-background) 76%, var(--surface-1) 24%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 72%, #ffffff 10%);
  border-radius: 28px;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.24);
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  margin: 0;
  max-width: 360px;
  min-width: 0;
  overflow: hidden;
  padding: 12px;
  width: min(100%, 360px);
}

/* ACEF enhanced inactive panel: removes non-selected Marta mockups from layout so Story link replaces Profile instead of stacking below it. */
.adult-creator-engagement-funnel-page .acef-live-poc.is-enhanced .acef-live-poc__panel:not(.is-active) {
  display: none;
}

/* ACEF enhanced panel state: lets JavaScript fade in the selected mockup only after it validates the complete tab/panel set. */
.adult-creator-engagement-funnel-page .acef-live-poc.is-enhanced .acef-live-poc__panel.is-active {
  animation: acef-proof-panel-fade 180ms ease both;
}

/* ACEF mockup image: makes profile/story assets read as phone screenshots and prevents images from exceeding their panel width. */
.adult-creator-engagement-funnel-page .acef-live-poc__mockup {
  aspect-ratio: 9 / 16;
  border-radius: 20px;
  display: block;
  max-width: 100%;
  object-fit: cover;
  width: 100%;
}

/* ACEF caption: documents fictional/demo context near the remaining social mockups using a quieter reusable caption treatment after the portrait caption moved into Marta's copy. */
.adult-creator-engagement-funnel-page .acef-live-poc__caption {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.84rem;
  line-height: 1.45;
  margin: 0;
  opacity: 0.68;
}

/* ACEF mockup captions: keep moved profile/story captions above screenshots with enough bottom rhythm to match the earlier proof-panel reading pattern and clarify fictional status before the mockup image. */
.adult-creator-engagement-funnel-page .acef-live-poc__panel .acef-live-poc__caption {
  margin-bottom: 2px;
}

/* Mobile creator arrow animation: adds a small rightward wobble/pulse aligned with the earlier reveal control motif. */
@keyframes acef-creator-next-wobble {
  0%,
  100% {
    opacity: 0.82;
    transform: translateX(0) scale(1);
  }

  42% {
    opacity: 1;
    transform: translateX(3px) scale(1.04);
  }

  72% {
    opacity: 0.94;
    transform: translateX(0) scale(0.98);
  }
}

/* ACEF live POC contest shell: adds the full-width Marta choice mechanic below the preserved two-column intro while staying inside the existing demo visual family. */
.adult-creator-engagement-funnel-page .acef-live-poc__contest {
  background: radial-gradient(circle at 14% 0%, color-mix(in srgb, var(--color-primary) 14%, transparent), transparent 36%), linear-gradient(145deg, color-mix(in srgb, var(--surface-2) 88%, #ffd5df 8%), color-mix(in srgb, var(--color-background) 86%, var(--color-primary) 6%));
  border: 1px solid color-mix(in srgb, var(--border-subtle) 78%, #ffd5df 22%);
  border-radius: 34px;
  box-shadow: var(--shadow-neutral-2);
  box-sizing: border-box;
  display: grid;
  gap: clamp(20px, 3vw, 30px);
  margin-top: clamp(34px, 6vw, 64px);
  padding: clamp(18px, 3vw, 32px);
}

/* ACEF live POC contest header: frames the mechanic as a small choice plan, not a loud quiz or separate lead form. */
.adult-creator-engagement-funnel-page .acef-live-poc__contest-header {
  display: grid;
  gap: 8px;
  max-width: 720px;
}


/* ACEF live POC privacy note: keeps the header in metadata mode now that Marta's direct-speech invitation lives inside the first stage. */
.adult-creator-engagement-funnel-page .acef-live-poc__privacy-note {
  color: var(--color-muted);
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.9rem;
  line-height: 1.5;
  margin: 0;
  max-width: 620px;
  opacity: 0.72;
}

/* ACEF live POC stage: uses a full-width grid so message, choices, signal, strategy, and the gated Next control keep a stable desktop hierarchy. */
.adult-creator-engagement-funnel-page .acef-live-poc__stage {
  background: color-mix(in srgb, var(--color-background) 78%, var(--surface-1) 22%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 76%, #ffffff 10%);
  border-radius: 28px;
  box-sizing: border-box;
  display: grid;
  gap: 18px;
  padding: clamp(16px, 2.5vw, 24px);
}

/* ACEF enhanced contest state: hides inactive authored stages only after JS validates the complete five-step mechanic, preserving no-JS source-order readability. */
.adult-creator-engagement-funnel-page .acef-live-poc__contest.is-enhanced .acef-live-poc__stage:not(.is-active) {
  display: none;
}

/* ACEF live POC speech strip: adds a compact one-time Marta invitation inside step 1 so the line scrolls with the active question instead of behaving like module intro copy. */
.adult-creator-engagement-funnel-page .acef-live-poc__speech {
  align-items: flex-start;
  background: color-mix(in srgb, var(--surface-1) 78%, #120811 22%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 62%, #ffd5df 38%);
  border-left: 3px solid color-mix(in srgb, var(--color-primary) 72%, #ffd5df 28%);
  border-radius: 18px;
  box-sizing: border-box;
  color: var(--color-foreground);
  display: flex;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(0.92rem, 2.4vw, 1rem);
  gap: 10px;
  line-height: 1.5;
  margin: 0 0 -2px;
  max-width: 680px;
  padding: clamp(12px, 2vw, 15px) clamp(14px, 2.4vw, 18px);
}

/* ACEF live POC speech quote mark: supplies a restrained direct-speech cue without changing the source copy or adding repeated speech strips to later steps. */
.adult-creator-engagement-funnel-page .acef-live-poc__speech::before {
  color: color-mix(in srgb, var(--color-primary) 74%, #ffd5df 26%);
  content: '“';
  flex: 0 0 auto;
  font-family: 'Roboto Thin', sans-serif;
  font-size: 1.45rem;
  line-height: 0.95;
  margin-top: 1px;
}

/* ACEF live POC message block: keeps Marta's first-person question and supporting line above choices on desktop and mobile. */
.adult-creator-engagement-funnel-page .acef-live-poc__message {
  display: grid;
  gap: 8px;
}

/* ACEF live POC progress pill: makes the five-step flow easier to scan without changing the mechanic, navigation, or no-JS source order. */
.adult-creator-engagement-funnel-page .acef-live-poc__progress-wrap {
  align-items: stretch;
  background: color-mix(in srgb, var(--surface-1) 84%, #120811 16%);
  border: 1px solid color-mix(in srgb, var(--color-primary) 54%, var(--border-subtle) 46%);
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16);
  box-sizing: border-box;
  display: inline-grid;
  gap: 7px;
  justify-self: start;
  min-width: 132px;
  padding: 7px 10px 8px;
}

/* ACEF live POC progress label: keeps the visible Step X of 5 text compact, uppercase, and higher-contrast than the previous plain text. */
.adult-creator-engagement-funnel-page .acef-live-poc__progress-wrap .acef-live-poc__progress {
  color: color-mix(in srgb, var(--color-primary) 78%, #fff0d9 22%);
  font-family: 'Roboto Regular', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  line-height: 1.1;
  margin: 0;
  opacity: 1;
  text-transform: uppercase;
}

/* ACEF live POC progress track: adds a restrained bar under the pill label so each authored stage exposes its static completion percentage. */
.adult-creator-engagement-funnel-page .acef-live-poc__progress-bar {
  background: color-mix(in srgb, var(--border-subtle) 70%, #000000 30%);
  border-radius: 999px;
  height: 4px;
  overflow: hidden;
  width: 100%;
}

/* ACEF live POC progress fill: reads the per-stage PHP custom property instead of introducing JS or analytics-affecting state logic. */
.adult-creator-engagement-funnel-page .acef-live-poc__progress-bar-fill {
  background: linear-gradient(90deg, var(--color-primary), #ffb15c);
  border-radius: inherit;
  display: block;
  height: 100%;
  width: var(--acef-step-progress, 20%);
}

/* ACEF live POC stage heading and copy: uses local display/body rhythm so the mechanic feels connected to the surrounding ACEF page. */
.adult-creator-engagement-funnel-page .acef-live-poc__message h3,
.adult-creator-engagement-funnel-page .acef-live-poc__result-copy h3 {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(2rem, 4vw, 3.8rem);
  font-weight: 100;
  letter-spacing: -0.04em;
  line-height: 1;
  margin: 0;
}

/* ACEF live POC support and reaction copy: separates Marta's selected-state response from compact methodology notes below. */
.adult-creator-engagement-funnel-page .acef-live-poc__message p,
.adult-creator-engagement-funnel-page .acef-live-poc__result-copy > p {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  line-height: 1.55;
  margin: 0;
  opacity: 0.78;
}

/* ACEF live POC reaction: highlights Marta's post-choice response without auto-advancing the step. */
.adult-creator-engagement-funnel-page .acef-live-poc__reaction {
  color: #ffd5df !important;
  font-family: 'Raleway SemiBold', sans-serif !important;
  opacity: 1 !important;
}

/* ACEF live POC choices: creates the required two large image cards on desktop and stacks them in source order on mobile. */
.adult-creator-engagement-funnel-page .acef-live-poc__choices {
  display: grid;
  gap: clamp(14px, 2vw, 20px);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* ACEF live POC choice card: implements each option as a real button with image-led affordance and restrained premium styling. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice {
  background: color-mix(in srgb, var(--surface-1) 84%, transparent);
  border: 1px solid var(--border-subtle);
  border-radius: 24px;
  color: var(--color-foreground);
  cursor: pointer;
  display: grid;
  gap: 10px;
  padding: 10px;
  text-align: left;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
  width: 100%;
}

/* ACEF live POC choice-card wrapper: separates the interactive image button from its selected-state response so the DOM stays valid and the Next action can sit below the chosen card. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-card {
  align-content: start;
  display: grid;
  gap: 10px;
}

/* ACEF live POC choice follow-up: creates a compact response/action pocket under a selected image card while hidden siblings preserve the two-card layout. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-followup {
  align-items: start;
  background: color-mix(in srgb, var(--surface-1) 80%, #120811 20%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 64%, #ffd5df 36%);
  border-left: 3px solid color-mix(in srgb, var(--color-primary) 72%, #ff8ea8 28%);
  border-radius: 16px;
  box-sizing: border-box;
  display: grid;
  gap: 10px;
  padding: clamp(11px, 1.8vw, 14px) clamp(12px, 2vw, 16px);
}

/* ACEF live POC hidden follow-up: enforces the native hidden attribute after adding grid styles so non-selected cards never show Marta response or Next. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-followup[hidden] {
  display: none;
}

/* ACEF live POC choice speech: reuses the dark direct-speech family from the opening line in a smaller card-local form for Marta's selected response. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-speech {
  align-items: flex-start;
  color: var(--color-foreground);
  display: flex;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(0.88rem, 2vw, 0.96rem);
  gap: 8px;
  line-height: 1.5;
  margin: 0;
}

/* ACEF live POC choice speech quote mark: carries the orange/pink Marta voice cue into the card-level follow-up without enlarging it to the opening speech size. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-speech::before {
  color: color-mix(in srgb, var(--color-primary) 74%, #ffd5df 26%);
  content: '“';
  flex: 0 0 auto;
  font-family: 'Roboto Thin', sans-serif;
  font-size: 1.25rem;
  line-height: 0.95;
  margin-top: 1px;
}

/* ACEF live POC selected follow-up action: centers only the Next button after Marta's card-local response so the action stays attached to the quote box without shifting the wider choice grid. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-followup .acef-live-poc__next {
  justify-self: center;
}

/* ACEF live POC choice image: standardizes Marta route asset cropping so every step reads as one coherent fictional creator mechanic. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-image {
  aspect-ratio: 4 / 5;
  border-radius: 18px;
  display: block;
  object-fit: cover;
  width: 100%;
}

/* ACEF live POC black dress crop: pins the mirror look to the top so it stays balanced inside the fixed Step 1 choice-card image frame. */
.adult-creator-engagement-funnel-page [data-choice-id="black_dress"] .acef-live-poc__choice-image {
  object-position: 50% 0%;
}

/* ACEF live POC park walk crop: adjusts only the Step 4 outdoor park card so the composition stays balanced inside the fixed choice-card image frame. */
.adult-creator-engagement-funnel-page [data-choice-id="park_walk"] .acef-live-poc__choice-image {
  object-position: 50% 25%;
}

/* ACEF live POC choice title: gives the selected preference a readable text label so the route is understandable without images. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-title {
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: 1.05rem;
  padding-inline: 4px;
}

/* ACEF live POC choice copy: keeps secondary option affordance quiet to avoid a BuzzFeed-style quiz tone. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice-copy {
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.88rem;
  opacity: 0.62;
  padding: 0 4px 4px;
}

/* ACEF live POC selected and focus states: provides visible confirmation and keyboard affordance while aria-pressed exposes state to assistive technology. */
.adult-creator-engagement-funnel-page .acef-live-poc__choice:hover,
.adult-creator-engagement-funnel-page .acef-live-poc__choice:focus-visible,
.adult-creator-engagement-funnel-page .acef-live-poc__choice[aria-pressed="true"] {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-primary) 34%, transparent), 0 18px 40px rgba(0, 0, 0, 0.24);
  outline: 2px solid transparent;
  transform: translateY(-2px);
}

/* ACEF live POC strategy note: keeps the agency explanation optional, compact, and accessible through native disclosure behavior. */
.adult-creator-engagement-funnel-page .acef-live-poc__strategy-note {
  background: color-mix(in srgb, var(--surface-1) 76%, transparent);
  border: 1px solid var(--border-subtle);
  border-radius: 16px;
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  padding: 12px 14px;
}

/* ACEF live POC strategy toggle: gives the native summary a clear control style without replacing disclosure semantics. */
.adult-creator-engagement-funnel-page .acef-live-poc__strategy-toggle {
  color: var(--color-primary);
  cursor: pointer;
  font-family: 'Raleway SemiBold', sans-serif;
}

/* ACEF live POC strategy body: keeps methodology copy short and visually secondary to Marta's interaction flow. */
.adult-creator-engagement-funnel-page .acef-live-poc__strategy-note p {
  line-height: 1.55;
  margin: 10px 0 0;
  opacity: 0.76;
}

/* ACEF live POC next controls: gates advancement until a choice exists and reuses the orange action language already present in the ACEF template. */
.adult-creator-engagement-funnel-page .acef-live-poc__next {
  align-self: start;
  background: var(--color-primary);
  border: 1px solid var(--color-primary);
  border-radius: 999px;
  color: var(--color-background);
  cursor: pointer;
  font-family: 'Raleway SemiBold', sans-serif;
  justify-self: start;
  padding: 11px 18px;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

/* ACEF live POC next focus and hover: preserves keyboard visibility without adding a focus trap or modal behavior. */
.adult-creator-engagement-funnel-page .acef-live-poc__next:hover,
.adult-creator-engagement-funnel-page .acef-live-poc__next:focus-visible {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 28%, transparent);
  outline: 2px solid transparent;
  transform: translateY(-1px);
}

/* ACEF live POC result: displays the final Marta first-person plan summary as a two-column card on desktop after all five memory-only picks are made. */
.adult-creator-engagement-funnel-page .acef-live-poc__result {
  background: color-mix(in srgb, var(--color-background) 78%, var(--surface-1) 22%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 76%, #ffd5df 18%);
  border-radius: 28px;
  box-sizing: border-box;
  display: grid;
  gap: clamp(18px, 3vw, 30px);
  grid-template-columns: minmax(220px, 0.62fr) minmax(0, 1fr);
  padding: clamp(16px, 2.5vw, 24px);
}

/* ACEF enhanced result state: lets JS reveal the final route only on completion while no-JS users keep the authored steps above. */
.adult-creator-engagement-funnel-page .acef-live-poc__contest.is-enhanced .acef-live-poc__result[hidden] {
  display: none;
}

/* ACEF live POC result image: uses the supplied wink/air-kiss closeup as the completion visual without making the summary image-dependent. */
.adult-creator-engagement-funnel-page .acef-live-poc__result-image {
  aspect-ratio: 4 / 5;
  border-radius: 22px;
  display: block;
  object-fit: cover;
  width: 100%;
}

@media (min-width: 768px) {
  /* ACEF desktop result image: relaxes the Marta crop toward the source photo ratio because the final result layout has enough vertical room for a longer photo presence inside the card. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-image {
    aspect-ratio: 941 / 1672;
  }
}

/* ACEF result memory cloud baseline: removes the decorative route fragments from mobile and tablet layout entirely so they cannot separate the result portrait from its handoff copy. */
.adult-creator-engagement-funnel-page .acef-live-poc__result-memory-cloud {
  display: none;
}

@media (min-width: 901px) {
  /* ACEF desktop result geometry: reserves the first column for Marta and her route memories while the unchanged copy continues down the full right column. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-image {
    grid-column: 1;
    grid-row: 1;
  }

  /* ACEF desktop result copy placement: prevents the newly inserted decorative sibling from entering the right column or interrupting the handoff flow. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-copy {
    grid-column: 2;
    grid-row: 1 / span 2;
  }

  /* ACEF completed-route memory cloud: creates a clipped pocket of negative space beneath Marta for a loose, secondary trail of interaction fragments. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory-cloud {
    display: block;
    grid-column: 1;
    grid-row: 2;
    height: clamp(190px, 19vw, 238px);
    min-width: 0;
    overflow: hidden;
    position: relative;
  }

  /* ACEF completed-route memory fragments: keeps every image smaller and quieter than Marta while slow drifting makes the static route feel gently retained. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory {
    animation: acef-result-memory-drift 12s ease-in-out infinite alternate;
    border-radius: 16px;
    display: block;
    height: auto;
    object-fit: cover;
    opacity: 0.42;
    position: absolute;
    width: 34%;
  }

  /* ACEF memory fragment one: starts the layered trail high on the left with restrained counter-clockwise rotation. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory--1 {
    left: 2%;
    top: 13%;
    transform: rotate(-5deg);
  }

  /* ACEF memory fragment two: offsets the drink memory toward the upper center to avoid a rigid row. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory--2 {
    animation-delay: -4s;
    left: 31%;
    top: 2%;
    transform: rotate(3deg);
  }

  /* ACEF memory fragment three: anchors the right edge without crossing into the explanatory copy column. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory--3 {
    animation-delay: -8s;
    right: 1%;
    top: 18%;
    transform: rotate(-2deg);
  }

  /* ACEF memory fragment four: places the pool memory low and partially behind the central route fragments. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory--4 {
    animation-delay: -6s;
    bottom: 1%;
    left: 8%;
    opacity: 0.34;
    transform: rotate(4deg);
    width: 30%;
  }

  /* ACEF memory fragment five: gives the lower center a lighter overlap that preserves breathing room around the cloud. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory--5 {
    animation-delay: -2s;
    bottom: 8%;
    left: 38%;
    opacity: 0.38;
    transform: rotate(-4deg);
    width: 31%;
  }

  /* ACEF memory fragment six: closes the route trail at the lower right with the quietest layer in the composition. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory--6 {
    animation-delay: -10s;
    bottom: 3%;
    opacity: 0.32;
    right: 4%;
    transform: rotate(5deg);
    width: 29%;
  }
}

/* ACEF memory drift: moves route fragments by only a few pixels so the completed interaction feels held rather than presented as a carousel UI. */
@keyframes acef-result-memory-drift {
  from {
    margin-left: -3px;
    margin-top: 2px;
  }

  to {
    margin-left: 4px;
    margin-top: -3px;
  }
}

/* ACEF live POC result copy: stacks the completion copy, readable summary, methodology note, and restart control. */
.adult-creator-engagement-funnel-page .acef-live-poc__result-copy {
  align-content: center;
  display: grid;
  gap: 14px;
}

/* ACEF live POC summary: makes all selected choices readable as text instead of relying on image memory. */
.adult-creator-engagement-funnel-page .acef-live-poc__summary {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
}

/* ACEF live POC summary rows: separates route dimensions from selected values for quick scanning in the final screen. */
.adult-creator-engagement-funnel-page .acef-live-poc__summary li {
  align-items: center;
  background: color-mix(in srgb, var(--surface-1) 78%, transparent);
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 10px 12px;
}

/* ACEF live POC handoff card: adds an explicit copy-ready next-step artifact after the unchanged result summary without turning it into a hidden conversion or external CTA. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff {
  background: color-mix(in srgb, var(--surface-1) 82%, var(--color-background) 18%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 72%, var(--color-primary) 28%);
  border-radius: 20px;
  display: grid;
  gap: 14px;
  margin-top: 2px;
  padding: clamp(14px, 2vw, 18px);
}

/* ACEF live POC handoff copy: keeps the contextual chatter explanation in the result card's existing compact vertical rhythm. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-copy {
  display: grid;
  gap: 6px;
}

/* ACEF live POC handoff title: uses the existing completion-card hierarchy while separating the portable-plan prompt from the methodology note. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-title {
  color: var(--color-text);
  font-size: clamp(1rem, 1.7vw, 1.18rem);
  margin: 0;
}

/* ACEF live POC handoff body: keeps the explanatory paragraphs at the page's full text contrast so the longer context remains readable. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-copy p {
  color: var(--color-text);
  line-height: 1.55;
  margin: 0;
}

/* ACEF live POC chatter opener: distinguishes the Park walk example with existing surface and accent tokens while keeping it subordinate to the handoff controls. */
.adult-creator-engagement-funnel-page .acef-live-poc__chatter-opener {
  background: var(--surface-2);
  border: 1px solid var(--border-subtle);
  border-left: 3px solid var(--color-primary);
  border-radius: 14px;
  box-sizing: border-box;
  color: var(--color-text);
  margin: 6px 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  padding: clamp(12px, 2vw, 16px);
}

/* ACEF live POC handoff actions: groups copy, copy-continue, and reset controls while allowing desktop wrapping instead of forcing a redesign. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* ACEF live POC handoff buttons: use global CTA/scenario semantics with ACEF-local compact sizing so inherited contracts do not become oversized inside the result card. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-action {
  border-radius: 999px;
  box-sizing: border-box;
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: 0.92rem;
  line-height: 1.2;
  padding: 10px 16px;
}

/* ACEF live POC primary handoff button: keeps the global CTA orange-fill role and white default text for copy-and-continue while reducing padding and scale for the compact result handoff card. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-action--primary {
  background-color: var(--color-primary);
  border: 1px solid var(--color-primary);
  color: var(--color-foreground);
}

/* ACEF live POC primary handoff states: mirrors CTA lift/color feedback locally because the existing ACEF next-button selector is more specific than the global CTA hover rule. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-action--primary:hover,
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-action--primary:focus-visible {
  background-color: var(--color-accent);
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 28%, transparent);
  color: var(--color-background);
  outline: 2px solid transparent;
  transform: translateY(calc(-1 * var(--cta-hover-lift))) scale(var(--cta-hover-scale));
}

/* ACEF live POC secondary handoff buttons: keeps the global scenario outline feel for copy/reset while restraining the card-local border, font, and padding. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-action--secondary {
  background-color: rgba(255, 255, 255, 0.03);
  border-color: color-mix(in srgb, var(--border-subtle) 58%, var(--color-primary) 42%);
  color: var(--color-primary);
}

/* ACEF live POC secondary handoff states: preserves scenario hover/focus feedback in the compact fork without changing clipboard or restart behavior. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-action--secondary:hover,
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-action--secondary:focus-visible {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
  box-shadow: var(--scenario-shadow-hover);
  color: var(--color-background);
  outline: 2px solid transparent;
  transform: scale(var(--scenario-hover-scale));
}

/* ACEF live POC handoff status: keeps clipboard feedback available near the action row without reserving an empty line at the bottom of the final handoff card. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-status {
  color: color-mix(in srgb, var(--color-text) 82%, var(--color-primary) 18%);
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: 0.92rem;
  margin: 0;
  min-height: 1.35em;
}

/* ACEF live POC empty status state: removes the inactive aria-live paragraph from the grid flow so only the bottom area below the handoff buttons tightens before copy feedback appears. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-status:empty {
  display: none;
}

/* ACEF live POC manual copy fallback: keeps unsupported Clipboard API users able to select the exact message text without showing the fallback during the normal success path. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-manual {
  display: grid;
  gap: 6px;
}


/* ACEF live POC manual copy hidden state: restores the semantic hidden contract after the component display rule so the fallback appears only on clipboard failure. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-manual[hidden] {
  display: none;
}

/* ACEF live POC manual fallback label: clearly names the selectable copy artifact for screen reader and keyboard users. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-manual span {
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: 0.85rem;
}

/* ACEF live POC manual fallback textarea: presents the generated plan as readonly text instead of persisting it or submitting it anywhere. */
.adult-creator-engagement-funnel-page .acef-live-poc__handoff-manual textarea {
  background: color-mix(in srgb, var(--color-background) 88%, var(--surface-1) 12%);
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  color: var(--color-text);
  min-height: 132px;
  padding: 10px 12px;
  resize: vertical;
  width: 100%;
}

/* ACEF framework bridge: adds a compact explanation after the LIVE POC without turning it into another long methodology section. */
.adult-creator-engagement-funnel-page .acef-framework {
  /* ACEF rhythm use: compact spacing keeps the framework bridge attached to the LIVE POC proof thread. */
  background: color-mix(in srgb, var(--color-background) 88%, var(--surface-1) 12%);
  border-top: 1px solid var(--border-subtle);
  padding: var(--acef-section-space-compact) 0;
}

/* ACEF framework container: mirrors the page-local 1200px rhythm used by the LIVE POC and Traffic-to-intent sections. */
.adult-creator-engagement-funnel-page .acef-framework__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: calc(var(--layout-content-max-width, 1200px) + 40px);
  padding-inline: 20px;
  width: 100%;
}

/* ACEF framework card: keeps the explanation as one compact bridge card before the future analytics proof layer. */
.adult-creator-engagement-funnel-page .acef-framework__card {
  background: color-mix(in srgb, var(--surface-1) 84%, var(--color-background) 16%);
  border: 1px solid var(--border-subtle);
  border-left: 3px solid var(--color-primary);
  border-radius: 28px;
  display: grid;
  gap: 16px;
  padding: clamp(22px, 4vw, 36px);
}


/* ACEF framework title: uses the local section-title style without recreating a hero-sized block. */
.adult-creator-engagement-funnel-page .acef-framework__title {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(2rem, 4vw, 3.8rem);
  font-weight: 100;
  letter-spacing: -0.04em;
  line-height: 1;
  margin: 0;
}

/* ACEF framework copy: spans the framework card so the desktop insight grid can use the available right-side space while the text rhythm stays stacked. */
.adult-creator-engagement-funnel-page .acef-framework__copy {
  display: grid;
  gap: 12px;
  max-width: none;
  width: 100%;
}

/* ACEF framework paragraphs: follows the page body typography and avoids helper-style opacity. */
.adult-creator-engagement-funnel-page .acef-framework__copy p {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.35vw, 1.08rem);
  line-height: 1.62;
  margin: 0;
}

/* ACEF framework emphasis: highlights only the sparse approved keywords and thesis fragments. */
.adult-creator-engagement-funnel-page .acef-framework__copy strong {
  color: color-mix(in srgb, var(--color-primary) 88%, var(--color-foreground) 12%);
  font-family: 'Raleway SemiBold', sans-serif;
  font-weight: 600;
}

/* ACEF framework insight grid: places research inputs and layer jobs side by side on desktop while keeping mobile source-order stacking. */
.adult-creator-engagement-funnel-page .acef-framework__insight-grid {
  align-items: start;
  display: grid;
  gap: clamp(16px, 2vw, 24px);
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
}

/* ACEF framework insight columns: prevents nested cards, chips, and layer stacks from forcing horizontal overflow inside the desktop grid. */
.adult-creator-engagement-funnel-page .acef-framework__insight-column {
  min-width: 0;
}

/* ACEF framework research column: stacks the research board and pattern note with controlled spacing on desktop and mobile. */
.adult-creator-engagement-funnel-page .acef-framework__insight-column--research {
  display: grid;
  gap: 14px;
}

/* ACEF framework research board: turns the dense research sentence into a compact signal board without changing the framework copy or adding JS. */
.adult-creator-engagement-funnel-page .acef-framework__research-board {
  background: color-mix(in srgb, var(--surface-1) 80%, var(--color-background) 20%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 76%, var(--color-primary) 24%);
  border-radius: 20px;
  display: grid;
  gap: 12px;
  padding: clamp(14px, 2vw, 18px);
}

/* ACEF framework ambient relay: creates a slow cyclic glow that helps users scan the three framework blocks without JS or abrupt blinking. */
@keyframes acefFrameworkAmbientRelay {
  0%,
  18%,
  100% {
    background-color: color-mix(in srgb, var(--surface-1) 80%, var(--color-background) 20%);
    border-color: color-mix(in srgb, var(--border-subtle) 76%, var(--color-primary) 24%);
    box-shadow: 0 0 0 rgba(255, 72, 0, 0);
  }

  7% {
    background-color: color-mix(in srgb, var(--surface-1) 74%, var(--color-primary) 7%);
    border-color: color-mix(in srgb, var(--border-subtle) 48%, var(--color-primary) 52%);
    box-shadow:
      0 0 0 1px color-mix(in srgb, var(--color-primary) 18%, transparent),
      0 0 28px color-mix(in srgb, var(--color-primary) 18%, transparent);
  }

  12% {
    background-color: color-mix(in srgb, var(--surface-1) 77%, var(--color-primary) 4%);
    border-color: color-mix(in srgb, var(--border-subtle) 62%, var(--color-primary) 38%);
    box-shadow:
      0 0 0 1px color-mix(in srgb, var(--color-primary) 10%, transparent),
      0 0 18px color-mix(in srgb, var(--color-primary) 10%, transparent);
  }
}

/* ACEF framework ambient targets: applies the same slow relay loop to the research, pattern, and jobs blocks. */
.adult-creator-engagement-funnel-page .acef-framework__research-board,
.adult-creator-engagement-funnel-page .acef-framework__research-timeline,
.adult-creator-engagement-funnel-page .acef-framework__pattern-note,
.adult-creator-engagement-funnel-page .acef-framework__layer-stack,
.adult-creator-engagement-funnel-page .acef-framework__jobs {
  animation-duration: 12s;
  animation-iteration-count: infinite;
  animation-name: acefFrameworkAmbientRelay;
  animation-timing-function: ease-in-out;
  will-change: background-color, border-color, box-shadow;
}

/* ACEF framework research relay timing: starts the cyclic attention pass from the creator-research inputs. */
.adult-creator-engagement-funnel-page .acef-framework__research-board,
.adult-creator-engagement-funnel-page .acef-framework__research-timeline {
  animation-delay: 0s;
}

/* ACEF framework pattern relay timing: follows the research block so the pattern note reads as the next idea. */
.adult-creator-engagement-funnel-page .acef-framework__pattern-note {
  animation-delay: 3.2s;
}

/* ACEF framework jobs relay timing: completes the cycle on the jobs/layer block after the left-column ideas are primed. */
.adult-creator-engagement-funnel-page .acef-framework__layer-stack,
.adult-creator-engagement-funnel-page .acef-framework__jobs {
  animation-delay: 6.4s;
}

/* ACEF framework research board lead: preserves the original sentence opening before the chip list begins. */
.adult-creator-engagement-funnel-page .acef-framework__research-board-lead {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.35vw, 1.08rem);
  line-height: 1.55;
  margin: 0;
}

/* ACEF framework research chips: makes each creator-research input scannable without introducing interactive behavior. */
.adult-creator-engagement-funnel-page .acef-framework__research-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ACEF framework research chips in grid: keeps long chip labels from widening the left desktop column. */
.adult-creator-engagement-funnel-page .acef-framework__insight-column--research .acef-framework__research-chips {
  min-width: 0;
}

/* ACEF framework research chip: borrows the page's rounded dark control language while remaining non-clickable static text. */
.adult-creator-engagement-funnel-page .acef-framework__research-chips li {
  background: color-mix(in srgb, var(--surface-2) 74%, transparent);
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  color: var(--color-foreground);
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: 0.9rem;
  line-height: 1.25;
  padding: 8px 11px;
}

/* ACEF framework research chip wrapping: allows long labels to wrap safely inside the two-column card. */
.adult-creator-engagement-funnel-page .acef-framework__insight-column--research .acef-framework__research-chips li {
  overflow-wrap: anywhere;
}

/* ACEF framework research chip accent: adds a small static marker so the chip board reads as measured inputs, not navigation buttons. */
.adult-creator-engagement-funnel-page .acef-framework__research-chips li::before {
  color: var(--color-primary);
  content: '•';
  margin-right: 7px;
}

/* ACEF framework pattern note: moves the final pattern sentence into the research column so the desktop framework grid has balanced visual weight. */
.adult-creator-engagement-funnel-page .acef-framework__pattern-note {
  background: color-mix(in srgb, var(--surface-1) 78%, var(--color-background) 22%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 74%, var(--color-primary) 26%);
  border-left: 3px solid var(--color-primary);
  border-radius: 20px;
  margin-top: 14px;
  padding: clamp(14px, 2vw, 18px);
}

/* ACEF framework pattern note text: keeps the closing insight compact and readable under the research inputs. */
.adult-creator-engagement-funnel-page .acef-framework__pattern-note p {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.35vw, 1.08rem);
  line-height: 1.55;
  margin: 0;
}

/* ACEF framework pattern note emphasis: preserves the approved orange thesis highlight inside the compact insight card. */
.adult-creator-engagement-funnel-page .acef-framework__pattern-note strong {
  color: color-mix(in srgb, var(--color-primary) 88%, var(--color-foreground) 12%);
  font-family: 'Raleway SemiBold', sans-serif;
  font-weight: 600;
}

/* ACEF framework layer stack: converts the three-jobs sentence into a static stacked diagram that keeps the framework bridge compact. */
.adult-creator-engagement-funnel-page .acef-framework__layer-stack {
  background: color-mix(in srgb, var(--surface-1) 80%, var(--color-background) 20%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 76%, var(--color-primary) 24%);
  border-radius: 20px;
  display: grid;
  gap: 14px;
  padding: clamp(14px, 2vw, 18px);
}

/* ACEF framework layer lead: preserves the original three-jobs sentence opening before the diagram. */
.adult-creator-engagement-funnel-page .acef-framework__layer-lead {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.35vw, 1.08rem);
  line-height: 1.55;
  margin: 0;
}

/* ACEF framework layers: stacks the jobs as connected surfaces rather than unrelated paragraphs. */
.adult-creator-engagement-funnel-page .acef-framework__layers {
  display: grid;
  gap: 10px;
}

/* ACEF framework layer: creates one visual layer for each job with a left accent similar to ACEF bridge cards. */
.adult-creator-engagement-funnel-page .acef-framework__layer {
  background: color-mix(in srgb, var(--surface-2) 72%, transparent);
  border: 1px solid var(--border-subtle);
  border-left: 3px solid color-mix(in srgb, var(--color-primary) 74%, var(--border-subtle) 26%);
  border-radius: 16px;
  display: grid;
  gap: 5px;
  padding: 12px 14px;
}

/* ACEF framework nested cards: gives inner job layers a barely visible pulse when the parent relay reaches the jobs block. */
.adult-creator-engagement-funnel-page .acef-framework__layer,
.adult-creator-engagement-funnel-page .acef-framework__job-card {
  transition: border-color 240ms ease, background-color 240ms ease;
}

/* ACEF framework nested glow: keeps the inner cards readable while the parent jobs block receives the ambient relay. */
.adult-creator-engagement-funnel-page .acef-framework__layer-stack,
.adult-creator-engagement-funnel-page .acef-framework__jobs {
  --acef-framework-nested-border: color-mix(in srgb, var(--border-subtle) 70%, var(--color-primary) 30%);
}

/* ACEF framework layer offset: creates a restrained stepped-stack feel on desktop without changing source order. */
.adult-creator-engagement-funnel-page .acef-framework__layer:nth-child(2) {
  margin-left: clamp(14px, 3vw, 34px);
}

/* ACEF framework signal layer offset: makes the final measurement layer feel like the collected output of the previous two layers. */
.adult-creator-engagement-funnel-page .acef-framework__layer:nth-child(3) {
  margin-left: clamp(28px, 6vw, 68px);
}

/* ACEF framework right-column layer offsets: tightens the stepped stack so it fits beside the research board on desktop. */
.adult-creator-engagement-funnel-page .acef-framework__insight-column--jobs .acef-framework__layer:nth-child(2) {
  margin-left: clamp(10px, 2vw, 24px);
}

/* ACEF framework right-column signal offset: keeps the final layer visibly stepped without exceeding the two-column card width. */
.adult-creator-engagement-funnel-page .acef-framework__insight-column--jobs .acef-framework__layer:nth-child(3) {
  margin-left: clamp(20px, 4vw, 48px);
}

/* ACEF framework layer kicker: labels each job as route, click, or signals without adding interaction. */
.adult-creator-engagement-funnel-page .acef-framework__layer-kicker {
  color: var(--color-primary);
  font-family: 'Roboto Regular', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  line-height: 1.2;
  text-transform: uppercase;
}

/* ACEF framework layer body: keeps each layer readable and compact inside the diagram. */
.adult-creator-engagement-funnel-page .acef-framework__layer p {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(0.95rem, 1.3vw, 1.04rem);
  line-height: 1.5;
  margin: 0;
}

/* ACEF framework layer emphasis: keeps the analytics-tool list highlighted inside the signal layer only. */
.adult-creator-engagement-funnel-page .acef-framework__layer strong {
  color: color-mix(in srgb, var(--color-primary) 88%, var(--color-foreground) 12%);
  font-family: 'Raleway SemiBold', sans-serif;
  font-weight: 600;
}

@media (max-width: 900px) {
  /* ACEF framework mobile insight grid: restores one-column reading order so research stays above jobs on tablets and phones. */
  .adult-creator-engagement-funnel-page .acef-framework__insight-grid {
    grid-template-columns: 1fr;
  }

  /* ACEF framework mobile layer offsets: removes desktop stepping once the two columns collapse. */
  .adult-creator-engagement-funnel-page .acef-framework__insight-column--jobs .acef-framework__layer:nth-child(2),
  .adult-creator-engagement-funnel-page .acef-framework__insight-column--jobs .acef-framework__layer:nth-child(3) {
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  /* ACEF live POC mobile title: centers Marta's heading and inline reference trigger so the intro stays balanced after the layout collapses to one column. */
  .adult-creator-engagement-funnel-page .acef-live-poc__title {
    text-align: center;
  }

  /* ACEF live POC mobile contest: preserves the requested order of message, progress, choices, signal, strategy, and Next in one column. */
  .adult-creator-engagement-funnel-page .acef-live-poc__choices,
  .adult-creator-engagement-funnel-page .acef-live-poc__result {
    grid-template-columns: 1fr;
  }

  /* ACEF live POC mobile handoff actions: stacks the copy and reset controls at narrow widths so each real button remains easy to tap in result flow. */
  .adult-creator-engagement-funnel-page .acef-live-poc__handoff-actions,
  .adult-creator-engagement-funnel-page .acef-live-poc__handoff-actions > button {
    width: 100%;
  }

  /* ACEF framework research mobile chips: keeps long labels readable and prevents pill overflow on narrow screens. */
  .adult-creator-engagement-funnel-page .acef-framework__research-chips {
    display: grid;
    grid-template-columns: 1fr;
  }

  /* ACEF framework research mobile chip: left-aligns each input as a compact row instead of a squeezed pill. */
  .adult-creator-engagement-funnel-page .acef-framework__research-chips li {
    border-radius: 14px;
    overflow-wrap: anywhere;
  }

  /* ACEF framework mobile layers: removes desktop offsets so the stack stays inside narrow viewports. */
  .adult-creator-engagement-funnel-page .acef-framework__layer:nth-child(2),
  .adult-creator-engagement-funnel-page .acef-framework__layer:nth-child(3) {
    margin-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  /* ACEF framework reduced motion: disables the cyclic ambient relay for users who prefer less motion. */
  .adult-creator-engagement-funnel-page .acef-framework__research-board,
  .adult-creator-engagement-funnel-page .acef-framework__research-timeline,
  .adult-creator-engagement-funnel-page .acef-framework__pattern-note,
  .adult-creator-engagement-funnel-page .acef-framework__layer-stack,
  .adult-creator-engagement-funnel-page .acef-framework__jobs {
    animation: none;
    box-shadow: none;
    will-change: auto;
  }

  /* ACEF result-memory reduced motion: freezes the decorative desktop route fragments while preserving their balanced resting composition. */
  .adult-creator-engagement-funnel-page .acef-live-poc__result-memory {
    animation: none;
  }
}

/* ACEF format comparison shell: bridges the traffic mechanism and Marta demo with a static, token-based explanation of flexible production routes. */
.adult-creator-engagement-funnel-page .acef-format-comparison {
  background: color-mix(in srgb, var(--color-background) 92%, var(--surface-1) 8%);
  border-top: 1px solid var(--border-subtle);
  padding: var(--acef-section-space-standard) 0;
}

/* ACEF format comparison container: aligns the new bridge section with the page-local 1200px content rhythm. */
.adult-creator-engagement-funnel-page .acef-format-comparison__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: calc(var(--layout-content-max-width, 1200px) + 40px);
  padding-inline: 20px;
  width: 100%;
}

/* ACEF format comparison title: uses the page display-heading convention without adding a pre-heading label. */
.adult-creator-engagement-funnel-page .acef-format-comparison__title {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(2.4rem, 5vw, 4.6rem);
  font-weight: 100;
  letter-spacing: -0.055em;
  line-height: 1;
  margin: 0;
  max-width: 900px;
}

/* ACEF format comparison intro: keeps the demonstration caveat concise, fully contrasted, and close to its heading. */
.adult-creator-engagement-funnel-page .acef-format-comparison__intro {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  line-height: 1.65;
  margin: clamp(18px, 2.8vw, 28px) 0 0;
  max-width: 780px;
}

/* ACEF format comparison emphasis: highlights supplied strong phrases while preserving the component's full-opacity text hierarchy. */
.adult-creator-engagement-funnel-page .acef-format-comparison strong {
  color: var(--color-primary);
  font-family: 'Raleway SemiBold', sans-serif;
}

/* ACEF format comparison grid: presents the demonstration and production formats as equally legible desktop alternatives. */
.adult-creator-engagement-funnel-page .acef-format-comparison__grid {
  display: grid;
  gap: clamp(16px, 2.5vw, 28px);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: clamp(28px, 4vw, 44px);
}

/* ACEF format comparison card: creates a substantial neutral surface for each route without making the Live POC option look inactive. */
.adult-creator-engagement-funnel-page .acef-format-comparison__card {
  background: linear-gradient(145deg, var(--surface-2), var(--surface-3));
  border: 1px solid var(--border-subtle);
  border-radius: 24px;
  box-shadow: var(--shadow-neutral-1);
  box-sizing: border-box;
  min-width: 0;
  padding: clamp(20px, 3vw, 32px);
}

/* ACEF production card emphasis: uses the established accent border to distinguish format flexibility without muting the demonstration card. */
.adult-creator-engagement-funnel-page .acef-format-comparison__card--production {
  border-color: var(--border-accent-strong);
  border-left: 3px solid var(--color-primary);
  box-shadow: var(--shadow-accent-1);
}

/* ACEF comparison card title: gives each route type a clear, full-contrast label inside its card. */
.adult-creator-engagement-funnel-page .acef-format-comparison__card-title {
  color: var(--color-foreground);
  font-family: 'Roboto Regular', sans-serif;
  font-size: clamp(1.3rem, 2vw, 1.65rem);
  line-height: 1.2;
  margin: 0;
}

/* ACEF comparison card copy: separates the route premise from its visual sequence through spacing and type rather than opacity. */
.adult-creator-engagement-funnel-page .acef-format-comparison__card-copy {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  line-height: 1.55;
  margin: 12px 0 0;
}

/* ACEF comparison route: lays all five semantic list items into a compact horizontal path on desktop. */
.adult-creator-engagement-funnel-page .acef-format-comparison__route {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  list-style: none;
  margin: clamp(22px, 3vw, 30px) 0 0;
  padding: 0;
}

/* ACEF comparison route step: keeps every format label readable within its route node and provides an anchor for decorative connectors. */
.adult-creator-engagement-funnel-page .acef-format-comparison__step {
  align-items: center;
  background: var(--surface-solid-2);
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  box-sizing: border-box;
  color: var(--color-foreground);
  display: flex;
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: clamp(0.72rem, 1vw, 0.86rem);
  justify-content: center;
  line-height: 1.25;
  min-height: 64px;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 10px 6px;
  position: relative;
  text-align: center;
}

/* ACEF comparison route connector: draws a lightweight left-to-right path while leaving route meaning in the ordered-list labels. */
.adult-creator-engagement-funnel-page .acef-format-comparison__step:not(:last-child)::after {
  border-top: 1px solid var(--border-accent-strong);
  content: '';
  left: calc(100% + 3px);
  position: absolute;
  top: 50%;
  width: 10px;
}

/* ACEF production route nodes: reinforces the varied production mechanics with the existing accent surface and border tokens. */
.adult-creator-engagement-funnel-page .acef-format-comparison__card--production .acef-format-comparison__step {
  background: var(--surface-solid-3);
  border-color: var(--border-accent-soft);
}

/* ACEF format explanatory copy: places the production guidance below both cards at a comfortable long-form reading width. */
.adult-creator-engagement-funnel-page .acef-format-comparison__copy {
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.35vw, 1.08rem);
  gap: 12px;
  line-height: 1.68;
  margin-top: clamp(28px, 4vw, 42px);
  max-width: 940px;
}

/* ACEF format explanatory paragraphs: preserves the supplied two-paragraph structure without browser-default margin drift. */
.adult-creator-engagement-funnel-page .acef-format-comparison__copy p {
  margin: 0;
}

@media (max-width: 767px) {
  /* Mobile ACEF format grid: stacks both comparison cards in source order at all requested narrow control widths. */
  .adult-creator-engagement-funnel-page .acef-format-comparison__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Mobile ACEF route: turns each five-node path vertical so long production labels stay readable without horizontal overflow. */
  .adult-creator-engagement-funnel-page .acef-format-comparison__route {
    gap: 22px;
    grid-template-columns: minmax(0, 1fr);
  }

  /* Mobile ACEF route connector: rotates the decorative path downward between stacked semantic steps. */
  .adult-creator-engagement-funnel-page .acef-format-comparison__step:not(:last-child)::after {
    border-left: 1px solid var(--border-accent-strong);
    border-top: 0;
    height: 14px;
    left: 50%;
    top: calc(100% + 4px);
    width: 0;
  }
}

/* ACEF measurement proof: keeps this post-framework block focused on real GA4 smoke-test screenshots for ACEF choice-level event measurement. */
.adult-creator-engagement-funnel-page .acef-measurement {
  /* ACEF rhythm use: compact spacing documents measurement as proof-continuation, not a new narrative reset. */
  background: color-mix(in srgb, var(--color-background) 92%, var(--surface-1) 8%);
  border-top: 1px solid var(--border-subtle);
  padding: var(--acef-section-space-compact) 0;
}

/* ACEF measurement proof container: follows the local ACEF content width so the GA4 screenshot cards align with the surrounding page sections. */
.adult-creator-engagement-funnel-page .acef-measurement__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: calc(var(--layout-content-max-width, 1200px) + 40px);
  padding-inline: 20px;
  width: 100%;
}

/* ACEF measurement proof title: keeps the site display font while introducing the real GA4 choice-proof section. */
.adult-creator-engagement-funnel-page .acef-measurement__title {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(2rem, 4vw, 3.6rem);
  font-weight: 100;
  letter-spacing: -0.055em;
  line-height: 1;
  margin: 0 0 clamp(12px, 2vw, 18px);
}

/* ACEF measurement proof intro: uses full body-text contrast because this explanatory proof copy validates GA4 choice-level events, not secondary metadata. */
.adult-creator-engagement-funnel-page .acef-measurement__intro {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  line-height: 1.6;
  margin: 0 0 clamp(18px, 3vw, 30px);
  max-width: 760px;
  opacity: 1;
}

/* ACEF measurement intro emphasis: highlights the requested choice-level events phrase inside this proof section only. */
.adult-creator-engagement-funnel-page .acef-measurement__intro strong {
  color: var(--color-primary);
  font-family: 'Raleway SemiBold', sans-serif;
}

/* ACEF measurement proof grid: keeps exactly two GA4 screenshot cards on desktop while staying compact. */
.adult-creator-engagement-funnel-page .acef-measurement__proof {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* ACEF measurement proof slot: presents each real GA4 smoke-test screenshot in a card without adding fake metrics or conversion claims. */
.adult-creator-engagement-funnel-page .acef-measurement__proof-slot {
  align-content: start;
  background: color-mix(in srgb, var(--surface-1) 80%, var(--color-background) 20%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 72%, var(--color-primary) 28%);
  border-radius: 18px;
  display: grid;
  min-height: clamp(150px, 18vw, 220px);
  padding: 16px;
}

/* ACEF measurement proof slot title: names the choice category shown in the real GA4 smoke-test screenshot. */
.adult-creator-engagement-funnel-page .acef-measurement__proof-title {
  color: var(--color-foreground);
  font-family: 'Raleway SemiBold', sans-serif;
  margin: 0 0 6px;
}

/* ACEF measurement proof note: explains what each GA4 screenshot demonstrates about ACEF choice-level event measurement. */
.adult-creator-engagement-funnel-page .acef-measurement__proof-note {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  font-size: 0.9rem;
  line-height: 1.45;
  margin: 0 0 14px;
  opacity: 0.72;
}

/* ACEF measurement note emphasis: keeps the proof-card key phrases visually aligned with existing ACEF accent styling. */
.adult-creator-engagement-funnel-page .acef-measurement__proof-note strong {
  color: var(--color-primary);
  font-family: 'Raleway SemiBold', sans-serif;
}

/* ACEF measurement proof image: scales the real GA4 screenshots to each card width, preserves their aspect ratio, and prevents mobile overflow without cropping important proof content. */
.adult-creator-engagement-funnel-page .acef-measurement__proof-image {
  border: 1px solid var(--border-subtle);
  border-radius: 12px;
  display: block;
  height: auto;
  max-width: 100%;
  width: 100%;
}

@media (max-width: 767px) {
  /* ACEF measurement proof mobile grid: stacks the two GA4 screenshot cards to avoid narrow-screen overflow. */
  .adult-creator-engagement-funnel-page .acef-measurement__proof {
    grid-template-columns: 1fr;
  }
}

/* ACEF concerns shell: adds the objection-handling disclosure section directly after measurement, using local dark surfaces instead of global FAQ styles. */
.adult-creator-engagement-funnel-page .acef-concerns {
  /* ACEF rhythm use: standard spacing reopens the reader's objection-handling section after proof. */
  background: radial-gradient(circle at top left, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 34%), color-mix(in srgb, var(--color-background) 90%, var(--surface-1) 10%);
  border-top: 1px solid var(--border-subtle);
  padding: var(--acef-section-space-standard) 0;
}

/* ACEF concerns container: keeps the new section aligned to the existing ACEF page width without introducing a shared layout helper. */
.adult-creator-engagement-funnel-page .acef-concerns__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: calc(var(--layout-content-max-width, 1200px) + 40px);
  padding-inline: 20px;
  width: 100%;
}

/* ACEF concerns title: replaces the former generic heading with the required concern-led line and keeps the no-kicker requirement visible in layout. */
.adult-creator-engagement-funnel-page .acef-concerns__title {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(2.55rem, 6vw, 5.4rem);
  font-weight: 100;
  letter-spacing: -0.055em;
  line-height: 0.98;
  margin: 0;
  max-width: 980px;
}

/* ACEF concerns list: creates a compact one-column scan path so long answers remain readable when each native disclosure opens. */
.adult-creator-engagement-funnel-page .acef-concerns__list {
  display: grid;
  gap: 12px;
  margin-top: clamp(28px, 4vw, 44px);
}

/* ACEF concern card: turns each always-visible text block into a dark native disclosure surface with border hierarchy and no sticky or JS behavior. */
.adult-creator-engagement-funnel-page .acef-concern-card {
  background: linear-gradient(135deg, color-mix(in srgb, var(--surface-1) 86%, var(--color-background) 14%), color-mix(in srgb, var(--color-background) 88%, var(--surface-1) 12%));
  border: 1px solid color-mix(in srgb, var(--border-subtle) 78%, var(--color-primary) 22%);
  border-radius: 22px;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--color-foreground) 8%, transparent);
  color: var(--color-foreground);
  overflow: hidden;
  transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

/* ACEF concern card hover: signals that the entire compact concern row can be opened without making it look like a generic pale FAQ card. */
.adult-creator-engagement-funnel-page .acef-concern-card:hover {
  border-color: color-mix(in srgb, var(--color-primary) 52%, var(--border-subtle) 48%);
  box-shadow: 0 18px 42px -34px color-mix(in srgb, var(--color-primary) 75%, transparent), inset 0 1px 0 color-mix(in srgb, var(--color-foreground) 10%, transparent);
  transform: translateY(-1px);
}

/* ACEF open concern card: makes the revealed answer feel intentional through a stronger accent border and controlled dark-surface lift. */
.adult-creator-engagement-funnel-page .acef-concern-card[open] {
  background: linear-gradient(135deg, color-mix(in srgb, var(--surface-1) 78%, var(--color-primary) 8%), color-mix(in srgb, var(--color-background) 84%, var(--surface-1) 16%));
  border-color: color-mix(in srgb, var(--color-primary) 68%, var(--border-subtle) 32%);
  box-shadow: 0 24px 58px -42px color-mix(in srgb, var(--color-primary) 85%, transparent), inset 0 1px 0 color-mix(in srgb, var(--color-foreground) 12%, transparent);
}

/* ACEF concern summary: makes the complete concern row clickable and separates number, objection title, and answer affordance in one accessible row. */
.adult-creator-engagement-funnel-page .acef-concern-card__summary {
  align-items: center;
  cursor: pointer;
  display: grid;
  gap: clamp(12px, 2vw, 22px);
  grid-template-columns: auto minmax(0, 1fr) auto;
  list-style: none;
  padding: clamp(18px, 2.7vw, 26px);
}

/* ACEF summary marker reset: removes the browser disclosure triangle so the local Answer to concern affordance becomes the visible expansion cue. */
.adult-creator-engagement-funnel-page .acef-concern-card__summary::-webkit-details-marker {
  display: none;
}

/* ACEF summary focus state: preserves keyboard accessibility with a visible local outline inside the card radius. */
.adult-creator-engagement-funnel-page .acef-concern-card__summary:focus-visible {
  border-radius: 20px;
  box-shadow: inset 0 0 0 2px var(--color-primary);
  outline: 2px solid transparent;
  outline-offset: 3px;
}

/* ACEF concern number: adds a compact marker so concerns are visible as selectable objections rather than anonymous FAQ questions. */
.adult-creator-engagement-funnel-page .acef-concern-card__number {
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--color-primary) 50%, var(--border-subtle) 50%);
  border-radius: 999px;
  color: var(--color-primary);
  display: inline-flex;
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: 0.82rem;
  justify-content: center;
  letter-spacing: 0.08em;
  min-height: 38px;
  min-width: 38px;
}

/* ACEF concern title: keeps the objection itself prominent and foreground-colored so the default closed state remains scannable. */
.adult-creator-engagement-funnel-page .acef-concern-card__title {
  color: var(--color-foreground);
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: clamp(1rem, 1.7vw, 1.26rem);
  line-height: 1.35;
}

/* ACEF concern action: labels the expansion as objection handling with explicit concern language instead of generic read-more button copy. */
.adult-creator-engagement-funnel-page .acef-concern-card__action {
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--color-primary) 42%, var(--border-subtle) 58%);
  border-radius: 999px;
  color: var(--color-foreground);
  display: inline-flex;
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: 0.86rem;
  gap: 9px;
  justify-content: center;
  line-height: 1;
  padding: 10px 13px;
  white-space: nowrap;
}

/* ACEF open concern action: strengthens the same static label in the open state without relying on JavaScript text swaps. */
.adult-creator-engagement-funnel-page .acef-concern-card[open] .acef-concern-card__action {
  background: color-mix(in srgb, var(--color-primary) 16%, transparent);
  border-color: color-mix(in srgb, var(--color-primary) 74%, var(--border-subtle) 26%);
}

/* ACEF concern indicator: draws a CSS-only plus/minus cue beside the concern-specific action copy. */
.adult-creator-engagement-funnel-page .acef-concern-card__indicator {
  display: inline-block;
  height: 12px;
  position: relative;
  width: 12px;
}

/* ACEF concern indicator lines: creates the collapsed plus sign while keeping the text label readable for the control. */
.adult-creator-engagement-funnel-page .acef-concern-card__indicator::before,
.adult-creator-engagement-funnel-page .acef-concern-card__indicator::after {
  background: var(--color-primary);
  content: '';
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* ACEF concern indicator horizontal line: provides the stable minus stroke used in both collapsed and open states. */
.adult-creator-engagement-funnel-page .acef-concern-card__indicator::before {
  height: 2px;
  width: 12px;
}

/* ACEF concern indicator vertical line: completes the collapsed plus and is hidden in the open state below. */
.adult-creator-engagement-funnel-page .acef-concern-card__indicator::after {
  height: 12px;
  transition: opacity 160ms ease, transform 160ms ease;
  width: 2px;
}

/* ACEF open concern indicator: turns the plus into a minus with CSS-only state styling when the native disclosure is expanded. */
.adult-creator-engagement-funnel-page .acef-concern-card[open] .acef-concern-card__indicator::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(90deg);
}

/* ACEF concern answer: makes the revealed response a distinct inset area with a divider while preserving normal readable foreground text. */
.adult-creator-engagement-funnel-page .acef-concern-card__answer {
  background: color-mix(in srgb, var(--color-background) 76%, var(--surface-1) 24%);
  border-top: 1px solid color-mix(in srgb, var(--border-subtle) 72%, var(--color-primary) 28%);
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(0.98rem, 1.25vw, 1.05rem);
  gap: 10px;
  line-height: 1.66;
  margin: 0 clamp(18px, 2.7vw, 26px) clamp(18px, 2.7vw, 26px);
  padding: clamp(16px, 2.5vw, 22px);
}

/* ACEF open concern answer: adds a subtle inset accent only when the native details element reveals the response. */
.adult-creator-engagement-funnel-page .acef-concern-card[open] .acef-concern-card__answer {
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--color-primary) 78%, transparent);
}

/* ACEF concern answer paragraphs: keeps answer copy compact and readable without opacity reduction or disabled-looking text. */
.adult-creator-engagement-funnel-page .acef-concern-card__answer p {
  color: var(--color-foreground);
  margin: 0;
}

/* ACEF concerns transition: keeps the Marta-to-real-route bridge after the disclosures as a decisive close to the objection-handling section. */
.adult-creator-engagement-funnel-page .acef-concerns__transition {
  border-left: 2px solid var(--color-primary);
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway SemiBold', sans-serif;
  font-size: clamp(1.02rem, 1.55vw, 1.18rem);
  gap: 8px;
  line-height: 1.56;
  margin-top: clamp(28px, 4vw, 42px);
  max-width: 780px;
  padding-left: clamp(16px, 2.4vw, 24px);
}

/* ACEF concerns transition paragraphs: removes default margins so the required two-line transition remains tight and intentional. */
.adult-creator-engagement-funnel-page .acef-concerns__transition p {
  margin: 0;
}

@media (max-width: 767px) {
  /* Mobile ACEF concern summary: stacks the answer affordance under the title so 360-480px widths do not squeeze or clip the control text. */
  .adult-creator-engagement-funnel-page .acef-concern-card__summary {
    align-items: start;
    grid-template-columns: auto minmax(0, 1fr);
  }

  /* Mobile ACEF concern action: spans under the objection title to keep Answer to concern readable at the required narrow checkpoints. */
  .adult-creator-engagement-funnel-page .acef-concern-card__action {
    grid-column: 2;
    justify-self: start;
    white-space: normal;
  }

  /* Mobile ACEF concern answer: tightens the revealed inset surface while keeping full-width single-column reading on phones. */
  .adult-creator-engagement-funnel-page .acef-concern-card__answer {
    margin-inline: 14px;
  }
}

/* ACEF final offer / CTA shell: creates the new post-concerns offer section using the page-local dark background rhythm and keeps the change scoped to the ACEF final offer / CTA section. */
.adult-creator-engagement-funnel-page .acef-final-offer {
  /* ACEF rhythm use: large spacing closes the page arc around the final offer without moving CTAs. */
  padding: var(--acef-section-space-large) 0;
}

/* ACEF final offer / CTA container: aligns the new offer with the existing ACEF content width without adding a global layout helper. */
.adult-creator-engagement-funnel-page .acef-final-offer__container {
  box-sizing: border-box;
  margin-inline: auto;
  max-width: calc(var(--layout-content-max-width, 1200px) + 40px);
  padding-inline: 20px;
  width: 100%;
}

/* ACEF final offer / CTA header: centers the title and intro so the final offer follows the front-page and Services CTA/pricing visual language. */
.adult-creator-engagement-funnel-page .acef-final-offer__header {
  margin-inline: auto;
  max-width: 900px;
  text-align: center;
}

/* ACEF final offer / CTA title: reuses the thin oversized heading tone from existing CTA/pricing sections while keeping it local to this new section. */
.adult-creator-engagement-funnel-page .acef-final-offer__title {
  color: var(--color-foreground);
  font-family: 'Roboto Thin', sans-serif;
  font-size: clamp(2.65rem, 6.5vw, 5.7rem);
  font-weight: 100;
  letter-spacing: -0.055em;
  line-height: 0.98;
  margin: 0;
}

/* ACEF final offer / CTA intro: gives the founding-slot explanation readable centered width before users reach the card-like offer blocks. */
.adult-creator-engagement-funnel-page .acef-final-offer__intro {
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1.02rem, 1.55vw, 1.18rem);
  gap: 12px;
  line-height: 1.68;
  margin: clamp(22px, 3.2vw, 34px) auto 0;
  max-width: 760px;
}

/* ACEF final offer / CTA intro paragraphs: removes default margins so the provided copy keeps the intended compact centered rhythm. */
.adult-creator-engagement-funnel-page .acef-final-offer__intro p {
  margin: 0;
}

/* ACEF final offer / CTA emphasis: applies the ACEF orange semantic emphasis to supplied strong copy without changing the wording. */
.adult-creator-engagement-funnel-page .acef-final-offer strong {
  color: var(--color-primary);
  font-weight: inherit;
}

/* ACEF risk-sharing section: contains the decision aid between the final-offer introduction and founding sprint pricing without changing the surrounding offer flow. */
.adult-creator-engagement-funnel-page .acef-risk-sharing {
  box-sizing: border-box;
  margin: clamp(34px, 5vw, 58px) auto 0;
  max-width: 1120px;
  width: 100%;
}

/* ACEF risk-sharing header: constrains the introduction to a readable measure while keeping the h3 as the component's first visible content. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__header {
  max-width: 820px;
}

/* ACEF risk-sharing title: establishes the requested h3 hierarchy below the final-offer h2 without adding a pre-title treatment. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__title {
  color: var(--color-foreground);
  font-size: clamp(1.8rem, 3.4vw, 2.8rem);
  font-weight: 400;
  line-height: 1.08;
  margin: 0;
}

/* ACEF risk-sharing introduction: keeps the system-responsibility context concise and fully contrasted before the comparison grid. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__intro {
  color: var(--color-foreground);
  font-size: clamp(1rem, 1.35vw, 1.1rem);
  line-height: 1.65;
  margin: 16px 0 0;
}

/* ACEF risk-sharing grid: presents the three models as equal comparison columns and prevents long copy from forcing overflow. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__grid {
  align-items: stretch;
  display: grid;
  gap: clamp(16px, 2vw, 24px);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: clamp(24px, 3.5vw, 38px);
}

/* ACEF risk-sharing cards: gives every responsibility model an equally important, full-height surface for quick comparison. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__card {
  background: var(--surface-1);
  border: 1px solid var(--border-subtle);
  border-radius: 18px;
  box-sizing: border-box;
  min-width: 0;
  padding: clamp(20px, 2.5vw, 28px);
}

/* ACEF performance-share card: uses the established accent border and stronger surface to mark the optional shared-upside route without diminishing adjacent cards. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__card--performance {
  background: var(--surface-2);
  border-color: var(--border-accent-strong);
  border-top-width: 3px;
}

/* ACEF risk-sharing card headings: creates a consistent title line for scanning the three compared responsibilities. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__card-title,
.adult-creator-engagement-funnel-page .acef-risk-sharing__affiliate-title {
  color: var(--color-foreground);
  font-size: clamp(1.16rem, 1.7vw, 1.4rem);
  font-weight: 600;
  line-height: 1.22;
  margin: 0;
}

/* ACEF risk-sharing copy groups: maintains readable paragraph rhythm at full contrast across cards and both concluding panels. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__card-copy,
.adult-creator-engagement-funnel-page .acef-risk-sharing__affiliate-copy {
  color: var(--color-foreground);
  display: grid;
  font-size: clamp(0.98rem, 1.15vw, 1.04rem);
  gap: 12px;
  line-height: 1.62;
  margin-top: 16px;
}

/* ACEF risk-sharing paragraphs: removes browser margins so the decision cards and panels use one predictable spacing system. */
.adult-creator-engagement-funnel-page .acef-risk-sharing p {
  margin-block: 0;
}

/* ACEF performance-share aside: gives the intentionally sarcastic paragraph a prominent inset boundary rather than disclaimer styling. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__aside {
  background: var(--surface-3);
  border-left: 3px solid var(--color-primary);
  border-radius: 10px;
  color: var(--color-foreground);
  font-weight: 500;
  padding: 16px;
}

/* ACEF affiliate notice: spans the component as a structurally distinct inset explanation instead of appearing as a fourth comparison card. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__affiliate {
  background: var(--surface-1);
  border: 1px solid var(--border-accent-soft);
  border-left: 4px solid var(--color-primary);
  border-radius: 14px;
  box-sizing: border-box;
  margin-top: clamp(16px, 2.4vw, 24px);
  padding: clamp(20px, 2.8vw, 30px);
  width: 100%;
}

/* ACEF affiliate title placement: keeps the subsection heading attached to its copy while sharing the comparison-card heading treatment. */
.adult-creator-engagement-funnel-page .acef-risk-sharing__affiliate-title {
  margin-bottom: 2px;
}

/* ACEF risk-sharing handoff: keeps a compact gap from the affiliate explanation to the existing primary price card after the redundant founding conclusion is removed. */
.adult-creator-engagement-funnel-page .acef-risk-sharing + .acef-final-offer-card--primary {
  margin-top: clamp(18px, 2.8vw, 28px);
}

/* ACEF final offer / CTA main card spacing: separates the single visible sprint offer from the intro so the section reads as a focused CTA rather than a long card grid. */
.adult-creator-engagement-funnel-page .acef-final-offer-card--primary {
  margin: clamp(34px, 5vw, 58px) auto 0;
  max-width: 920px;
}

/* ACEF final offer / CTA card: creates the local offer surfaces while keeping the pricing language prominent and scoped to this final section only. */
.adult-creator-engagement-funnel-page .acef-final-offer-card {
  background: linear-gradient(135deg, color-mix(in srgb, var(--surface-1) 88%, var(--color-background) 12%), color-mix(in srgb, var(--color-background) 88%, var(--surface-1) 12%));
  border: 1px solid color-mix(in srgb, var(--border-subtle) 76%, var(--color-primary) 24%);
  border-left: 3px solid var(--color-primary);
  border-radius: 22px;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--color-foreground) 8%, transparent);
  box-sizing: border-box;
  padding: clamp(22px, 3vw, 34px);
}

/* ACEF final offer / CTA primary card: makes the sprint card visually dominant without turning every later condition into an equally heavy pricing block. */
.adult-creator-engagement-funnel-page .acef-final-offer-card--primary {
  background: linear-gradient(135deg, color-mix(in srgb, var(--surface-1) 72%, var(--color-primary) 10%), color-mix(in srgb, var(--color-background) 82%, var(--surface-1) 18%));
  border-color: color-mix(in srgb, var(--color-primary) 68%, var(--border-subtle) 32%);
  box-shadow: 0 26px 70px -48px color-mix(in srgb, var(--color-primary) 90%, transparent), inset 0 1px 0 color-mix(in srgb, var(--color-foreground) 12%, transparent);
}

/* ACEF final offer / CTA decision row: keeps the two visible follow-up paths side by side on desktop and ready to collapse cleanly on mobile. */
.adult-creator-engagement-funnel-page .acef-final-offer__decision-row {
  display: grid;
  gap: clamp(16px, 2.4vw, 26px);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: clamp(18px, 3vw, 30px);
}

/* ACEF final offer / CTA decision cards: slightly reduce secondary card weight so the main sprint offer remains the dominant visual anchor. */
.adult-creator-engagement-funnel-page .acef-final-offer-card--decision {
  border-left-width: 2px;
  padding: clamp(20px, 2.6vw, 28px);
}

/* ACEF final offer / CTA card title: uses orange heading treatment from pricing cards so each visible offer block scans clearly. */
.adult-creator-engagement-funnel-page .acef-final-offer-card__title {
  color: var(--color-primary);
  font-family: 'Roboto Regular', sans-serif;
  font-size: clamp(1.24rem, 2vw, 1.55rem);
  line-height: 1.18;
  margin: 0 0 16px;
}

/* ACEF final offer / CTA card copy: keeps visible pricing copy readable while avoiding the previous wall of equally open conditions. */
.adult-creator-engagement-funnel-page .acef-final-offer-card__copy {
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(0.98rem, 1.22vw, 1.05rem);
  gap: 12px;
  line-height: 1.66;
}

/* ACEF final offer / CTA card paragraphs: removes browser margins so multi-paragraph offer copy stays evenly spaced in every card. */
.adult-creator-engagement-funnel-page .acef-final-offer-card__copy p {
  margin: 0;
}

/* ACEF final offer / CTA details list: groups hidden operational conditions as compact disclosures below the visible offer and decision row. */
.adult-creator-engagement-funnel-page .acef-final-offer__details {
  display: grid;
  gap: 10px;
  margin: clamp(20px, 3.2vw, 34px) auto 0;
  max-width: 920px;
}

/* ACEF final offer / CTA desktop details grid: gives ACEF expandable blocks a 3×2 desktop grid to use available PC-screen width and reduce the section height, while align-items keeps unopened blocks from stretching when another ACEF expandable block opens. */
@media (min-width: 768px) {
  .adult-creator-engagement-funnel-page .acef-final-offer__details {
    align-items: start;
    gap: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 1120px;
  }
}

/* ACEF final offer / CTA detail card: uses a lighter disclosure surface so detailed conditions remain available without competing with the pricing cards. */
.adult-creator-engagement-funnel-page .acef-final-offer-detail {
  background: color-mix(in srgb, var(--surface-1) 70%, var(--color-background) 30%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 82%, var(--color-primary) 18%);
  border-radius: 16px;
  box-sizing: border-box;
  overflow: hidden;
}

/* ACEF final offer / CTA detail summary: styles the native summary row as a compact tappable condition label without reusing concern-card classes. */
/* ACEF expandable block headings: switches final-offer disclosure titles to Roboto Regular so the ACEF expandable blocks match the approved visual contract while expanded body copy remains Raleway. */
.adult-creator-engagement-funnel-page .acef-final-offer-detail__summary {
  align-items: center;
  color: var(--color-foreground);
  cursor: pointer;
  display: flex;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: clamp(0.98rem, 1.2vw, 1.05rem);
  gap: 12px;
  justify-content: space-between;
  line-height: 1.35;
  list-style: none;
  padding: 16px clamp(16px, 2.5vw, 22px);
}

/* ACEF final offer / CTA summary label: wraps mixed plain text and strong emphasis as one flex item so the plus indicator stays at the edge without stretching words across the disclosure heading. */
.adult-creator-engagement-funnel-page .acef-final-offer-detail__summary-label {
  display: inline;
}

/* ACEF final offer / CTA detail marker reset: hides default browser markers so the local plus/minus indicator can stay consistent across the compact disclosure list. */
.adult-creator-engagement-funnel-page .acef-final-offer-detail__summary::-webkit-details-marker {
  display: none;
}

/* ACEF final offer / CTA detail indicator: adds a small local affordance for native details state while keeping the HTML free of extra decorative spans. */
.adult-creator-engagement-funnel-page .acef-final-offer-detail__summary::after {
  color: var(--color-primary);
  content: "+";
  flex: 0 0 auto;
  font-family: 'Roboto Regular', sans-serif;
  font-size: 1.25rem;
  line-height: 1;
}

/* ACEF final offer / CTA open detail indicator: switches the compact disclosure affordance when native details is expanded. */
.adult-creator-engagement-funnel-page .acef-final-offer-detail[open] .acef-final-offer-detail__summary::after {
  content: "−";
}

/* ACEF final offer / CTA detail content: reveals conditions as a smaller inset reading area rather than another large pricing card. */
/* ACEF expandable detail content top spacing: adds a 16px top inset so expanded card text does not stick to the heading micro-container and the ACEF expandable cards read calmer in the open state. */
.adult-creator-engagement-funnel-page .acef-final-offer-detail__content {
  border-top: 1px solid color-mix(in srgb, var(--border-subtle) 80%, var(--color-primary) 20%);
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(0.95rem, 1.12vw, 1rem);
  gap: 10px;
  line-height: 1.62;
  padding: 16px clamp(16px, 2.5vw, 22px) 18px;
}

/* ACEF final offer / CTA detail content paragraphs: keeps expanded details compact and prevents browser margins from increasing visible text load. */
.adult-creator-engagement-funnel-page .acef-final-offer-detail__content p {
  margin: 0;
}

/* ACEF final offer / CTA contact panel: separates the final direct-contact note from the offer grid and makes clear this section does not use the standard lead form. */
.adult-creator-engagement-funnel-page .acef-final-offer__contact {
  background: color-mix(in srgb, var(--surface-1) 78%, var(--color-primary) 7%);
  border: 1px solid color-mix(in srgb, var(--color-primary) 58%, var(--border-subtle) 42%);
  border-radius: 24px;
  box-shadow: 0 24px 58px -42px color-mix(in srgb, var(--color-primary) 85%, transparent), inset 0 1px 0 color-mix(in srgb, var(--color-foreground) 12%, transparent);
  margin: clamp(28px, 4vw, 46px) auto 0;
  max-width: 900px;
  padding: clamp(26px, 4vw, 42px);
  text-align: center;
}

/* ACEF final offer / CTA contact title: gives the no-standard-lead-form note a clear CTA-block heading while keeping the copy exact. */
.adult-creator-engagement-funnel-page .acef-final-offer__contact-title {
  color: var(--color-foreground);
  font-family: 'Roboto Regular', sans-serif;
  font-size: clamp(1.35rem, 2.6vw, 2rem);
  line-height: 1.2;
  margin: 0;
}

/* ACEF final offer / CTA contact copy: centers the final application instruction before the direct email, WhatsApp Business, and Telegram buttons. */
.adult-creator-engagement-funnel-page .acef-final-offer__contact-copy {
  color: var(--color-foreground);
  display: grid;
  font-family: 'Raleway Regular', sans-serif;
  font-size: clamp(1rem, 1.35vw, 1.1rem);
  gap: 10px;
  line-height: 1.65;
  margin: 18px auto 0;
  max-width: 680px;
}

/* ACEF final offer / CTA contact paragraphs: keeps the provided final contact copy tight and predictable above the buttons. */
.adult-creator-engagement-funnel-page .acef-final-offer__contact-copy p {
  margin: 0;
}

/* ACEF final offer / CTA actions: reuses global cta-button and cta-button alt patterns while arranging three direct-contact CTAs responsively. */
.adult-creator-engagement-funnel-page .acef-final-offer__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  margin-top: clamp(22px, 3vw, 32px);
}

/* ACEF final offer / CTA buttons: limits direct-contact buttons to local sizing only, leaving global CTA colors, hover, and focus contracts intact. */
.adult-creator-engagement-funnel-page .acef-final-offer__button {
  box-sizing: border-box;
  justify-content: center;
  min-width: min(100%, 220px);
}

@media (max-width: 767px) {
  /* Mobile ACEF risk-sharing grid: stacks all three cards in source order and keeps each track fluid at the required narrow control widths. */
  .adult-creator-engagement-funnel-page .acef-risk-sharing__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Mobile ACEF risk-sharing panels: reduces inset pressure while preserving distinct card and affiliate surfaces without horizontal scrolling. */
  .adult-creator-engagement-funnel-page .acef-risk-sharing__card,
  .adult-creator-engagement-funnel-page .acef-risk-sharing__affiliate {
    padding: 20px;
  }

  /* Mobile ACEF final offer / CTA decision row: collapses the two visible decision cards to one column so 360, 390, 412, and 480 widths do not overflow. */
  .adult-creator-engagement-funnel-page .acef-final-offer__decision-row {
    grid-template-columns: 1fr;
  }

  /* Mobile ACEF final offer / CTA detail summary: tightens disclosure rows so compact condition labels remain tappable without horizontal clipping. */
  .adult-creator-engagement-funnel-page .acef-final-offer-detail__summary {
    padding-block: 14px;
  }

  /* Mobile ACEF expandable detail content top spacing: keeps the open-card text gap compact at 360-480px widths while preserving the same horizontal content inset. */
  .adult-creator-engagement-funnel-page .acef-final-offer-detail__content {
    padding-top: 14px;
  }

  /* Mobile ACEF final offer / CTA actions: stacks direct-contact CTAs to preserve tap targets and avoid cramped three-button rows. */
  .adult-creator-engagement-funnel-page .acef-final-offer__actions {
    align-items: stretch;
    flex-direction: column;
  }

  /* Mobile ACEF final offer / CTA buttons: makes each direct-contact CTA full-width within the contact card at narrow control widths. */
  .adult-creator-engagement-funnel-page .acef-final-offer__button {
    width: 100%;
  }
}

@media (max-width: 640px) {
  /* Prevent fixed 320px secondary desktop tracks from collapsing the flexible first column on narrow mobile screens. */
  .adult-creator-engagement-funnel-page .acef-pain-hero__grid,
  .adult-creator-engagement-funnel-page .acef-funnel-card,
  .adult-creator-engagement-funnel-page .acef-live-poc__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  /* Mobile ACEF support CTA: centers the restored support-column CTA inside the card so the narrow layout reads as a balanced final action. */
  .adult-creator-engagement-funnel-page .acef-traffic-to-intent__followup {
    justify-items: center;
  }

  /* Mobile ACEF support actions: centers the flex row without changing the shared CTA button sizing or analytics attribute. */
  .adult-creator-engagement-funnel-page .acef-traffic-to-intent__actions {
    justify-content: center;
    width: 100%;
  }

  /* Keep all stacked child columns fluid after the desktop grids collapse to one track. */
  .adult-creator-engagement-funnel-page .acef-pain-hero__content,
  .adult-creator-engagement-funnel-page .acef-pain-hero__evidence,
  .adult-creator-engagement-funnel-page .acef-funnel-card__mechanism,
  .adult-creator-engagement-funnel-page .acef-funnel-card__support,
  .adult-creator-engagement-funnel-page .acef-live-poc__intro,
  .adult-creator-engagement-funnel-page .acef-live-poc__social {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  /* Keep card padding inside the available mobile width. */
  .adult-creator-engagement-funnel-page .acef-blind-spot__container {
    box-sizing: border-box;
    width: 100%;
  }

  .adult-creator-engagement-funnel-page .acef-pain-hero__actions {
    flex-wrap: wrap;
  }
}


/* ACEF blind-spot emphasis: scopes the restored semantic strong markup to the ACEF proof bridge so global typography remains unchanged. */
.adult-creator-engagement-funnel-page .acef-blind-spot strong,
.adult-creator-engagement-funnel-page .acef-route-evidence strong {
  color: var(--color-primary);
  font-weight: inherit;
}

/* ACEF blind-spot intro: groups the exact proof-copy heading and opener before the semantic route diagram without changing the section order. */
.adult-creator-engagement-funnel-page .acef-blind-spot__intro {
  display: grid;
  gap: 1rem;
  max-width: 860px;
}

/* ACEF public route map: adapts the historical route-node geometry into a non-clickable ordered list with accessible labels and decorative CSS connectors only. */
.adult-creator-engagement-funnel-page .acef-public-route-map {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  list-style: none;
  margin: clamp(1.35rem, 3vw, 2rem) 0;
  padding: 0;
}

/* ACEF public route item: owns connector positioning between adjacent route nodes while keeping the list item itself non-interactive. */
.adult-creator-engagement-funnel-page .acef-public-route-map__item {
  min-width: 0;
  position: relative;
}

/* ACEF public route connector: draws the left-to-right path as decoration so route meaning stays in the list text and remains readable without CSS. */
.adult-creator-engagement-funnel-page .acef-public-route-map__item:not(:last-child)::after {
  border-top: 1px solid color-mix(in srgb, var(--color-primary) 70%, var(--border-subtle) 30%);
  content: '';
  left: calc(100% + 4px);
  position: absolute;
  top: 50%;
  width: 10px;
}

/* ACEF public route node: creates compact tokenized surfaces for each public-route step without opacity hierarchy, shimmer, or click affordance. */
.adult-creator-engagement-funnel-page .acef-public-route-map__node {
  align-items: center;
  background: color-mix(in srgb, var(--surface-2) 78%, var(--color-primary) 8%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 64%, var(--color-primary) 36%);
  border-radius: 18px;
  box-sizing: border-box;
  color: var(--color-foreground);
  display: flex;
  font-family: 'Roboto Regular', sans-serif;
  justify-content: center;
  line-height: 1.25;
  min-height: 72px;
  padding: 1rem;
  text-align: center;
  width: 100%;
}

/* ACEF route evidence shell: contains the restored public screenshots as one compact proof module below the route explanation instead of a gallery wall. */
.adult-creator-engagement-funnel-page .acef-route-evidence {
  border: 1px solid var(--border-subtle);
  border-radius: 26px;
  background: linear-gradient(145deg, var(--surface-2), var(--surface-3));
  box-shadow: var(--shadow-neutral-1);
  display: grid;
  gap: clamp(1rem, 2.4vw, 1.5rem);
  margin-top: clamp(1.5rem, 3vw, 2.25rem);
  padding: clamp(1rem, 2.6vw, 1.6rem);
}

/* ACEF route evidence header: keeps the module heading and June 2026 source note fully legible without opacity-based muting. */
.adult-creator-engagement-funnel-page .acef-route-evidence__header {
  display: grid;
  gap: 0.5rem;
}

/* ACEF route evidence title: styles the proof module heading as a contained subsection rather than another page-level H2. */
.adult-creator-engagement-funnel-page .acef-route-evidence__title {
  color: var(--color-foreground);
  font-size: clamp(1.25rem, 2.2vw, 1.8rem);
  line-height: 1.12;
  margin: 0;
}

/* ACEF route evidence intro and conclusion: use foreground color and spacing to communicate hierarchy while avoiding faded meaningful copy. */
.adult-creator-engagement-funnel-page .acef-route-evidence__intro,
.adult-creator-engagement-funnel-page .acef-route-evidence__conclusion,
.adult-creator-engagement-funnel-page .acef-route-evidence__helper {
  color: var(--color-foreground);
  font-family: 'Raleway Regular', sans-serif;
  line-height: 1.6;
  margin: 0;
}

/* ACEF route evidence controls: separates the first creator tab level from the second route-step tab level while reusing the global artifact switcher skin. */
.adult-creator-engagement-funnel-page .acef-route-evidence__controls {
  display: grid;
  gap: clamp(1rem, 2.2vw, 1.35rem);
}

/* ACEF route evidence control groups: wraps creator and route-step tabs in shrink-wrapped labelled cards so each tab level frames the buttons instead of spanning the full proof container. */
.adult-creator-engagement-funnel-page .acef-route-evidence__control-group {
  background: color-mix(in srgb, var(--surface-1) 78%, var(--surface-2) 22%);
  border: 1px solid color-mix(in srgb, var(--border-subtle) 82%, var(--color-primary) 18%);
  border-radius: 18px;
  box-sizing: border-box;
  display: grid;
  gap: 0.55rem;
  justify-self: center;
  max-width: 100%;
  padding: 0.75rem;
  width: fit-content;
}

/* ACEF route evidence control label: centers the creator/route-step headings with their selector rows so the framed desktop groups do not leave headings stranded on the left. */
.adult-creator-engagement-funnel-page .acef-route-evidence__control-label {
  color: var(--color-primary);
  font-family: 'Roboto Regular', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  line-height: 1.2;
  margin: 0;
  text-align: center;
  text-transform: uppercase;
}

/* ACEF route evidence tab rows: centers the selector buttons on desktop so the two-level route evidence controls read as intentional grouped selectors rather than left-aligned leftover chips. */
.adult-creator-engagement-funnel-page .acef-route-evidence__creator-tabs,
.adult-creator-engagement-funnel-page .acef-route-evidence__step-tabs {
  gap: 0.55rem;
  justify-content: center;
}

/* ACEF route evidence panels: no-JS fallback stacks all creators and screenshots in source order until JS validates and applies hidden states. */
.adult-creator-engagement-funnel-page .acef-route-evidence__panels {
  display: grid;
  gap: 1rem;
}

/* ACEF creator panel: keeps each creator proof group readable in no-JS mode and contained after enhancement. */
.adult-creator-engagement-funnel-page .acef-route-evidence__creator-panel {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
}

/* ACEF step panel grid: shows all route screenshots in no-JS mode and lets JS collapse to one active figure only after validation. */
.adult-creator-engagement-funnel-page .acef-route-evidence__step-panels {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* ACEF evidence figure: wraps each recovered screenshot in a tokenized card with a text label that remains available without JavaScript. */
.adult-creator-engagement-funnel-page .acef-route-evidence__figure {
  background: color-mix(in srgb, var(--surface-1) 84%, var(--surface-2) 16%);
  border: 1px solid var(--border-subtle);
  border-radius: 20px;
  box-sizing: border-box;
  display: grid;
  gap: 0.7rem;
  margin: 0;
  min-width: 0;
  padding: 0.75rem;
}

/* ACEF evidence image: keeps restored public screenshots fluid inside gutters at desktop, tablet, and narrow mobile widths. */
.adult-creator-engagement-funnel-page .acef-route-evidence__image {
  border: 1px solid color-mix(in srgb, var(--border-subtle) 70%, var(--color-primary) 30%);
  border-radius: 14px;
  display: block;
  height: auto;
  max-width: 100%;
  width: 100%;
}

/* ACEF enhanced route evidence hidden state: hides inactive creator and step panels only after JS validates the full 3x3 evidence contract. */
.adult-creator-engagement-funnel-page .acef-route-evidence.is-enhanced [hidden] {
  display: none;
}

/* ACEF enhanced active screenshot: once validated, one selected screenshot uses the full reading width instead of recreating the old three-column gallery wall. */
.adult-creator-engagement-funnel-page .acef-route-evidence.is-enhanced .acef-route-evidence__step-panels {
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 901px) {
  /* ACEF desktop route evidence alignment: centers the active screenshot area for the selected creator and selected route step while leaving mobile one-column behavior untouched. */
  .adult-creator-engagement-funnel-page .acef-route-evidence.is-enhanced .acef-route-evidence__step-panels {
    justify-self: center;
    max-width: min(100%, 760px);
    width: 100%;
  }
}

@media (max-width: 900px) {
  /* ACEF tablet route proof: allows route nodes and controls to wrap inside section gutters without clipping labels. */
  .adult-creator-engagement-funnel-page .acef-public-route-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .adult-creator-engagement-funnel-page .acef-public-route-map__item:not(:last-child)::after {
    display: none;
  }

  .adult-creator-engagement-funnel-page .acef-route-evidence__step-panels {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 480px) {
  /* ACEF narrow route proof: stacks route nodes with downward connectors and keeps tabs/screenshots within 320px-safe gutters. */
  .adult-creator-engagement-funnel-page .acef-public-route-map {
    gap: 26px;
    grid-template-columns: minmax(0, 1fr);
  }

  .adult-creator-engagement-funnel-page .acef-public-route-map__item:not(:last-child)::after {
    border-left: 1px solid color-mix(in srgb, var(--color-primary) 70%, var(--border-subtle) 30%);
    border-top: 0;
    display: block;
    height: 16px;
    left: 50%;
    top: calc(100% + 5px);
    width: 0;
  }

  .adult-creator-engagement-funnel-page .acef-route-evidence,
  .adult-creator-engagement-funnel-page .acef-blind-spot__container {
    padding: 1rem;
  }

  /* ACEF narrow route evidence controls: restores full-width cards on mobile so the one-column tab stack keeps the available tap target width. */
  .adult-creator-engagement-funnel-page .acef-route-evidence__control-group {
    justify-self: stretch;
    width: 100%;
  }

  .adult-creator-engagement-funnel-page .acef-route-evidence__creator-tabs,
  .adult-creator-engagement-funnel-page .acef-route-evidence__step-tabs {
    align-items: stretch;
  }

  .adult-creator-engagement-funnel-page .acef-route-evidence__creator-tab,
  .adult-creator-engagement-funnel-page .acef-route-evidence__step-tab {
    flex: 1 1 100%;
    min-width: 0;
    white-space: normal;
  }
}