/*
 * RECONA prelaunch landing page — standalone shell without storefront header/footer.
 * Uses active Style tokens (--sf-*) for colours, radius and typography.
 *
 * Layers in this file:
 *   1. shell (body, skip link, header, language switch, footer)
 *   2. shared prelaunch primitives (buttons, eyebrow, media)
 *   3. landing page sections (.pl-*)
 *   4. producer application / legal pages (.prelaunch__*)
 */

/* ------------------------------------------------------------------ shell */

.prelaunch-body {
    --pl-shell-max: 1320px;
    --pl-gutter: clamp(8px, 1.1vw, 12px);
    --pl-inset: clamp(14px, 2vw, 24px);

    /* Brand palette — navy for producer surfaces; warm terracotta accents.
     *
     * Accent presets (swap the three active lines below to revert):
     *   v1 original   — accent #C4623A | hover color-mix(deep 90%, #000) | deep #A44A2A
     *   v2 refined    — accent #B85C45 | hover #A84F3A | deep #8F4030
     *   v3 caramida   — accent #9E5A48 | hover #8B4D3E | deep #704032
     *   v4 argila     — accent #AD6B52 | hover #985A43 | deep #7D4835
     *   v5 ocru       — accent #A8624A | hover #945340 | deep #784232
     *   v6 tricolor   — accent #CE1126 | deep #CE1126 | hover color-mix(deep 90%, #000)
     *   v1 original is active below.
     */
    --pl-navy: #002B7F;
    --pl-navy-hover: color-mix(in srgb, var(--pl-navy) 90%, #000);
    --pl-accent: #C4623A;
    --pl-accent-deep: #A44A2A; /* WCAG AA white text (~5.8:1) */
    --pl-accent-hover: color-mix(in srgb, var(--pl-accent-deep) 90%, #000);
    --pl-accent-light: #F3E5DF;
    --pl-accent-pale: #F8F1EE;
    --pl-warm-ground: #FAF6F0;
    /* Soft notice surfaces (email verification bar, etc.) */
    --pl-reminder-banner-bg: color-mix(in srgb, var(--pl-title-accent) 14%, var(--pl-warm-ground));
    --pl-reminder-banner-border: color-mix(in srgb, var(--pl-title-accent) 22%, var(--pl-accent-light));
    --pl-tricolor-blue: var(--pl-navy);
    --pl-tricolor-yellow: #fcd116;
    /* Title highlights test — revert to var(--pl-accent) for terracotta words. */
    --pl-title-accent: #EDA526;
    --pl-title-accent-on-dark: #EDA526;

    --pl-buyer-surface: var(--pl-accent-deep);
    --pl-buyer-surface-top: color-mix(in srgb, var(--pl-accent-deep) 88%, #fff);
    --pl-buyer-surface-bottom: var(--pl-accent-deep);

    --pl-btn-blue: var(--pl-navy);
    --pl-btn-blue-border: var(--pl-navy);
    --pl-btn-warm: var(--pl-accent-deep);
    --pl-btn-warm-border: var(--pl-accent-deep);
    --pl-btn-surface: #fff;
    --pl-btn-surface-border: color-mix(in srgb, var(--sf-text-inverse, #fff) 22%, transparent);
    --pl-btn-shadow-primary: 0 2px 10px -4px color-mix(in srgb, var(--pl-navy) 50%, transparent);
    --pl-btn-shadow-primary-hover:
        0 12px 28px -10px color-mix(in srgb, var(--pl-navy) 46%, transparent),
        0 0 0 1px color-mix(in srgb, var(--pl-navy) 22%, transparent);
    --pl-btn-shadow-warm: 0 2px 10px -4px color-mix(in srgb, var(--pl-accent-deep) 50%, transparent);
    --pl-btn-shadow-warm-hover:
        0 12px 28px -10px color-mix(in srgb, var(--pl-accent-deep) 46%, transparent),
        0 0 0 1px color-mix(in srgb, var(--pl-accent-deep) 22%, transparent);
    --pl-btn-shadow-surface: 0 1px 4px -2px color-mix(in srgb, var(--sf-text) 12%, transparent);
    --pl-btn-shadow-surface-hover:
        0 10px 26px -12px color-mix(in srgb, var(--pl-navy) 30%, transparent),
        0 0 0 1px color-mix(in srgb, var(--pl-navy) 18%, transparent);
    --pl-btn-shadow-surface-on-dark: 0 0 0 1px color-mix(in srgb, var(--sf-text-inverse, #fff) 14%, transparent);
    --pl-btn-shadow-surface-on-dark-hover:
        0 0 0 1px color-mix(in srgb, var(--sf-text-inverse, #fff) 48%, transparent),
        0 0 0 5px color-mix(in srgb, var(--sf-text-inverse, #fff) 10%, transparent),
        0 14px 36px -12px rgba(0, 0, 0, 0.42);
    /* Soft navy tint: clearly brand blue, without full-card saturation. */
    --pl-producer-surface-top: color-mix(in srgb, var(--pl-navy) 90%, var(--sf-surface, #fff));
    --pl-producer-surface-bottom: var(--pl-navy);
    --pl-radius: calc(var(--sf-card-radius, 16px) + 4px);
    --pl-section-gap: 44px;
    --pl-path-gutter: clamp(10px, 1.2vw, 16px);
    --pl-path-card-gap: 18px;
    --pl-ink-soft: color-mix(in srgb, var(--sf-text) 72%, transparent);
    --pl-ink-muted: color-mix(in srgb, var(--sf-text) 60%, transparent);
    /* Deep editorial surface. A fixed dark base carries the contrast so inverse
       text stays legible with any Style, while the brand primary only tints it. */
    --pl-deep: color-mix(in srgb, #0e1723 88%, var(--sf-primary, #0c63e7));

    margin: 0;
    min-height: 100vh;
    background: var(--sf-page-bg, #f7f8fa);
    color: var(--sf-text);
    font-family: var(--sf-font-family);
    -webkit-font-smoothing: antialiased;
}

.prelaunch-page {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.prelaunch-skiplink {
    position: absolute;
    top: -120px;
    left: 16px;
    z-index: 60;
    padding: 10px 18px;
    border-radius: var(--sf-radius, 12px);
    background: var(--sf-surface, #fff);
    color: var(--sf-text);
    font-size: .875rem;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 16px 36px -20px color-mix(in srgb, var(--sf-text) 60%, transparent);
    transition: top .18s ease;
}

.prelaunch-skiplink:focus {
    top: 16px;
}

.prelaunch-header {
    position: sticky;
    top: 0;
    z-index: 30;
    padding: 0 var(--pl-gutter);
    background: var(--sf-surface, #fff);
    border-bottom: 1px solid var(--sf-border);
}

.prelaunch-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    max-width: var(--pl-shell-max);
    min-height: 66px;
    margin: 0 auto;
}

.prelaunch-header__inner--centered {
    justify-content: center;
    position: relative;
}

.prelaunch-header__inner--chrome {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
}

.prelaunch-header__back {
    display: inline-flex;
    align-items: center;
    gap: .5em;
    justify-self: start;
    grid-column: 1;
    max-width: 100%;
    min-height: 46px;
    padding: .6rem 1.15rem;
    border: 1px solid color-mix(in srgb, var(--pl-navy, var(--sf-primary)) 26%, var(--sf-border, #d4dae4));
    border-radius: 999px;
    background: var(--sf-surface, #fff);
    color: var(--pl-navy, var(--sf-primary));
    font-size: clamp(.8125rem, 1.55vw, .9rem);
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -.01em;
    text-decoration: none;
    box-shadow: 0 1px 0 color-mix(in srgb, var(--pl-navy, var(--sf-primary)) 4%, transparent);
    transition: color .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.prelaunch-header__back-chevron {
    flex: 0 0 auto;
    width: .72em;
    height: .72em;
    margin-top: 0;
    stroke: currentColor;
    stroke-width: 2.15;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: .9;
    transition: transform .18s ease, opacity .18s ease;
}

.prelaunch-header__back-label {
    text-wrap: balance;
}

.prelaunch-header__back:hover,
.prelaunch-header__back:focus-visible {
    text-decoration: none;
    border-color: color-mix(in srgb, var(--pl-navy, var(--sf-primary)) 34%, var(--sf-border, #d4dae4));
    background: color-mix(in srgb, var(--pl-navy, var(--sf-primary)) 4%, var(--sf-surface, #fff));
    color: color-mix(in srgb, var(--pl-navy, var(--sf-primary)) 72%, var(--sf-surface, #fff));
    box-shadow: 0 2px 8px color-mix(in srgb, var(--pl-navy, var(--sf-primary)) 8%, transparent);
}

.prelaunch-header__back:hover .prelaunch-header__back-chevron,
.prelaunch-header__back:focus-visible .prelaunch-header__back-chevron {
    opacity: 1;
    transform: translateX(-2px);
}

.prelaunch-header__back:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--pl-navy, var(--sf-primary)) 38%, transparent);
    outline-offset: 2px;
}

.prelaunch-header__inner--chrome .prelaunch-header__brand {
    grid-column: 2;
    justify-self: center;
}

.prelaunch-header__spacer {
    grid-column: 3;
    min-height: 1px;
}

.prelaunch-lang-slot[hidden] {
    display: none !important;
}

.prelaunch-header__brand {
    display: inline-flex;
    align-items: center;
    line-height: 0;
    text-decoration: none;
}

.prelaunch-header__brand img,
.prelaunch-header__brand .brand-logo-secondary {
    display: block;
    width: auto;
    max-width: min(140px, 42vw);
    max-height: 42px;
    object-fit: contain;
}

.prelaunch-header__brand--centered img,
.prelaunch-header__brand--centered .brand-logo-secondary {
    max-width: min(168px, 52vw);
    max-height: 52px;
}

.prelaunch-main {
    flex: 1 0 auto;
    padding: 20px var(--pl-gutter) 0;
}

/* ---------------------------------------------------------------- page sheet */

.pl-page__sheet {
    max-width: var(--pl-shell-max);
    margin: 0 auto 28px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--sf-border) 88%, transparent);
    border-radius: calc(var(--pl-radius) + 6px);
    background: var(--sf-surface, #fff);
    box-shadow:
        0 28px 56px -36px color-mix(in srgb, var(--sf-text) 24%, transparent),
        0 2px 0 color-mix(in srgb, var(--sf-surface, #fff) 80%, var(--sf-page-bg));
}

.pl-page__sheet .pl-paths__inner,
.pl-page__sheet .pl-why__inner,
.pl-page__sheet .pl-how__inner,
.pl-page__sheet .pl-diversity__frame,
.pl-page__sheet .pl-editorial__inner,
.pl-page__sheet .pl-manifesto__frame {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

/* ------------------------------------------------------- language switcher */

.prelaunch-lang {
    position: relative;
    flex: 0 0 auto;
}

.prelaunch-lang__toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border: 1px solid var(--sf-border);
    border-radius: var(--sf-badge-radius, 999px);
    background: var(--sf-surface, #fff);
    color: color-mix(in srgb, var(--sf-text) 82%, transparent);
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .08em;
    list-style: none;
    cursor: pointer;
}

.prelaunch-lang__toggle::-webkit-details-marker {
    display: none;
}

.prelaunch-lang__toggle:hover,
.prelaunch-lang__toggle:focus-visible {
    border-color: color-mix(in srgb, var(--sf-primary) 45%, var(--sf-border));
    color: var(--sf-primary);
}

.prelaunch-lang__chevron {
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg);
    transition: transform .18s ease;
}

.prelaunch-lang[open] .prelaunch-lang__chevron {
    transform: translateY(1px) rotate(225deg);
}

.prelaunch-lang__panel {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 40;
    width: 250px;
    max-height: 320px;
    overflow-y: auto;
    padding: 8px;
    border: 1px solid var(--sf-border);
    border-radius: var(--sf-card-radius, 16px);
    background: var(--sf-surface, #fff);
    box-shadow: 0 28px 56px -32px color-mix(in srgb, var(--sf-text) 60%, transparent);
}

.prelaunch-lang__list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.prelaunch-lang__option {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 10px;
    border: 0;
    border-radius: var(--sf-radius, 12px);
    background: transparent;
    color: var(--sf-text);
    font: inherit;
    font-size: .875rem;
    text-align: left;
    cursor: pointer;
}

.prelaunch-lang__option:hover,
.prelaunch-lang__option:focus-visible {
    background: color-mix(in srgb, var(--sf-primary) 8%, var(--sf-surface));
}

.prelaunch-lang__option.is-current {
    color: var(--sf-primary);
    font-weight: 700;
}

.prelaunch-lang__option-code {
    flex: 0 0 30px;
    color: color-mix(in srgb, var(--sf-text) 52%, transparent);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.prelaunch-lang__option.is-current .prelaunch-lang__option-code {
    color: var(--sf-primary);
}

.prelaunch-lang__option-name {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ------------------------------------------------- prelaunch primitives */

.prelaunch {
    color: var(--sf-text);
    font-family: var(--sf-font-family);
}

.prelaunch__alerts {
    max-width: 760px;
    margin: 20px auto 0;
    padding: 0 var(--pl-gutter);
}

.prelaunch__alerts .alert {
    margin-bottom: 12px;
}

.pl-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 15px 30px;
    border: 1px solid transparent;
    border-radius: var(--sf-button-primary-radius, 10px);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease,
                transform .18s ease, box-shadow .18s ease;
}

.pl-btn:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--pl-navy) 48%, transparent);
    outline-offset: 3px;
}

.pl-btn--primary {
    background: var(--pl-btn-blue);
    border-color: var(--pl-btn-blue-border);
    color: var(--sf-text-inverse, #fff);
    box-shadow: var(--pl-btn-shadow-primary);
}

.pl-btn--primary:hover,
.pl-btn--primary:focus-visible {
    background: var(--pl-navy-hover);
    border-color: var(--pl-navy-hover);
    color: var(--sf-text-inverse, #fff);
    box-shadow: var(--pl-btn-shadow-primary-hover);
    transform: translateY(-1px);
}

.pl-btn--primary:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--pl-navy) 55%, transparent);
    outline-offset: 3px;
}

.pl-btn--primary:active {
    transform: translateY(0);
    box-shadow: var(--pl-btn-shadow-primary);
}

.pl-btn--ghost,
.pl-btn--warm {
    background: var(--pl-btn-warm);
    border-color: var(--pl-btn-warm-border);
    color: var(--sf-text-inverse, #fff);
    box-shadow: var(--pl-btn-shadow-warm);
}

.pl-btn--ghost:hover,
.pl-btn--ghost:focus-visible,
.pl-btn--warm:hover,
.pl-btn--warm:focus-visible {
    background: var(--pl-accent-hover);
    border-color: var(--pl-accent-hover);
    color: var(--sf-text-inverse, #fff);
    box-shadow: var(--pl-btn-shadow-warm-hover);
    transform: translateY(-1px);
}

.pl-btn--ghost:active,
.pl-btn--warm:active {
    transform: translateY(0);
    box-shadow: var(--pl-btn-shadow-warm);
}

.pl-btn--warm:focus-visible,
.pl-btn--ghost:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--pl-accent) 55%, transparent);
    outline-offset: 3px;
}

.pl-btn--light {
    background: var(--pl-btn-surface);
    border-color: var(--pl-btn-surface-border);
    color: var(--pl-navy);
    box-shadow: var(--pl-btn-shadow-surface-on-dark);
}

.pl-btn--light:hover,
.pl-btn--light:focus-visible {
    background: var(--pl-btn-surface);
    border-color: var(--pl-btn-surface-border);
    color: var(--pl-navy);
    box-shadow: var(--pl-btn-shadow-surface-on-dark-hover);
    transform: translateY(-1px);
}

.pl-btn--light:active {
    transform: translateY(0);
    box-shadow: var(--pl-btn-shadow-surface);
}

/* Light buttons on dark producer surfaces: luminous ring reads better than drop shadow. */
.pl-path--producer .pl-btn--light,
.pl-path--buyer .pl-btn--light,
.pl-path--buyer .pl-btn--primary {
    background: var(--pl-btn-surface);
    border-color: var(--pl-btn-surface-border);
    color: var(--pl-navy);
    box-shadow: var(--pl-btn-shadow-surface-on-dark);
}

.pl-path--producer .pl-btn--light:hover,
.pl-path--producer .pl-btn--light:focus-visible,
.pl-path--buyer .pl-btn--light:hover,
.pl-path--buyer .pl-btn--light:focus-visible,
.pl-path--buyer .pl-btn--primary:hover,
.pl-path--buyer .pl-btn--primary:focus-visible {
    background: var(--pl-btn-surface);
    border-color: var(--pl-btn-surface-border);
    color: var(--pl-navy);
    box-shadow: var(--pl-btn-shadow-surface-on-dark-hover);
    transform: translateY(-1px);
}

.pl-path--producer .pl-btn--light:active,
.pl-path--buyer .pl-btn--light:active,
.pl-path--buyer .pl-btn--primary:active {
    box-shadow: var(--pl-btn-shadow-surface-on-dark);
}

.pl-path--buyer .pl-btn--light,
.pl-path--buyer .pl-btn--primary {
    color: var(--pl-accent-deep);
}

.pl-path--buyer .pl-btn--light:hover,
.pl-path--buyer .pl-btn--light:focus-visible,
.pl-path--buyer .pl-btn--primary:hover,
.pl-path--buyer .pl-btn--primary:focus-visible {
    color: var(--pl-accent-hover);
}

.pl-path--buyer .pl-btn--light:focus-visible,
.pl-path--buyer .pl-btn--primary:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--pl-accent) 55%, transparent);
    outline-offset: 3px;
}

.pl-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 16px;
    color: var(--pl-navy);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.pl-eyebrow::before {
    content: "";
    flex: 0 0 auto;
    width: 26px;
    height: 2px;
    background: currentColor;
}

.pl-eyebrow--inverse {
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 76%, transparent);
}

.pl-media__img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* --------------------------------------------------------------- hero */

.pl-hero {
    padding: 0;
}

.pl-hero__shell {
    max-width: none;
    margin: 0;
}

.pl-hero__frame {
    position: relative;
}

.pl-hero__logo {
    display: flex;
    justify-content: center;
    align-self: center;
    width: 100%;
    margin: -8px 0 8px;
    line-height: 0;
    text-decoration: none;
}

.pl-hero__logo img,
.pl-hero__logo .brand-logo-secondary {
    display: block;
    width: auto;
    max-width: min(396px, 94vw);
    max-height: clamp(117px, 24vw, 147px);
    object-fit: contain;
}

.pl-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
}

.pl-hero__media {
    order: 2;
    margin: 0;
    overflow: hidden;
    border-radius: 0;
    box-shadow: none;
}

.pl-hero__media picture {
    display: block;
}

.pl-hero__media .pl-media__img {
    aspect-ratio: 1 / 1;
    object-position: 50% 46%;
}

.pl-hero__content {
    order: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: var(--pl-inset) var(--pl-inset) 24px;
    text-align: center;
}

.pl-hero__content .pl-eyebrow {
    justify-content: center;
    gap: 0;
    margin: 14px 0 22px;
    padding: 7px 16px;
    border: 1px solid color-mix(in srgb, var(--pl-accent) 38%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--pl-accent) 12%, transparent);
    color: var(--pl-accent-deep);
    letter-spacing: .18em;
}

.pl-hero__content .pl-eyebrow::before {
    display: none;
}

.pl-hero__title {
    margin: 0 auto 18px;
    max-width: 38ch;
    font-size: clamp(1.375rem, 1.1vw + 1.05rem, 2rem);
    font-weight: 700;
    line-height: 1.26;
    letter-spacing: -.014em;
    text-align: center;
    text-wrap: balance;
}

.pl-hero__subtitle {
    margin: 0 auto 28px;
    max-width: 54ch;
    color: var(--pl-ink-soft);
    font-size: clamp(1.0625rem, 2.2vw, 1.25rem);
    font-weight: 500;
    line-height: 1.52;
    text-align: justify;
    text-align-last: center;
}

.pl-hero__content .pl-lanes {
    width: 100%;
}

.pl-lanes {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
}

.pl-lane {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pl-lane .pl-btn {
    width: 100%;
}

.pl-lane__note {
    display: grid;
    gap: 2px;
    margin: 0;
    color: var(--pl-ink-muted);
    font-size: .8125rem;
    line-height: 1.45;
}

.pl-lane__accent {
    color: var(--sf-text);
    font-weight: 700;
}

.pl-lane__status {
    margin: 0;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--sf-success, #15803d) 34%, transparent);
    border-radius: var(--sf-radius, 12px);
    background: color-mix(in srgb, var(--sf-success, #15803d) 10%, transparent);
    color: var(--sf-text);
    font-size: .875rem;
    line-height: 1.5;
    text-align: center;
    text-wrap: pretty;
}

.pl-lane__actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.pl-lane .prelaunch-join-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

/* --------------------------------------------- producer / buyer paths */

.pl-paths {
    padding: var(--pl-section-gap) var(--pl-path-gutter);
    background: var(--pl-warm-ground);
}

.pl-paths__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: var(--pl-path-card-gap);
}

.pl-path {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px 24px;
    border-radius: var(--pl-radius);
    text-align: center;
}

.pl-path--producer {
    --pl-path-cta-width: 330px;
    --pl-path-cta-min-height: 51px;
    --pl-path-cta-padding-y: 15px;
    --pl-path-cta-padding-x: 28px;
    --pl-path-cta-font-size: 0.945rem;
    --pl-producer-section-gap: 10px;
    --pl-producer-title-before: 14px;
    --pl-producer-title-after: 20px;
    --pl-producer-plus-offset: 10px;
    --pl-producer-btn-gutter-top: 25px;
    --pl-producer-btn-gutter-bottom: 0;
    --pl-producer-content-max: 30rem;
    align-items: stretch;
    gap: 0;
    padding: 0 clamp(16px, 2.2vw, 22px);
    background:
        linear-gradient(
            165deg,
            var(--pl-producer-surface-top) 0%,
            var(--pl-producer-surface-bottom) 100%);
    color: var(--sf-text-inverse, #fff);
    border: 1px solid color-mix(in srgb, var(--pl-tricolor-blue) 72%, #000);
    box-shadow: none;
}

.pl-path--buyer {
    --pl-path-cta-width: 330px;
    --pl-path-cta-min-height: 51px;
    --pl-path-cta-padding-y: 15px;
    --pl-path-cta-padding-x: 28px;
    --pl-path-cta-font-size: 0.945rem;
    --pl-buyer-section-gap: 8px;
    --pl-buyer-title-before: 12px;
    --pl-buyer-title-after: 14px;
    --pl-buyer-reward-offset: 6px;
    --pl-buyer-btn-gutter-top: 14px;
    --pl-buyer-btn-gutter-bottom: 0;
    --pl-buyer-content-max: 30rem;
    align-items: stretch;
    gap: 0;
    padding: 0 clamp(16px, 2.2vw, 22px);
    background:
        linear-gradient(
            165deg,
            var(--pl-buyer-surface-top) 0%,
            var(--pl-buyer-surface-bottom) 100%);
    color: var(--sf-text-inverse, #fff);
    border: 1px solid color-mix(in srgb, var(--pl-accent-deep) 72%, #000);
}

.pl-path .pl-eyebrow {
    align-self: flex-start;
    justify-content: flex-start;
}

.pl-path--producer .pl-eyebrow--inverse {
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 84%, transparent);
}

.pl-path__title {
    margin: 0 0 14px;
    font-size: clamp(1.5rem, 3.6vw, 2.125rem);
    font-weight: 800;
    line-height: 1.14;
    letter-spacing: -.02em;
    text-wrap: balance;
}

.pl-path--producer .pl-path__title {
    color: var(--sf-text-inverse, #fff);
}

.pl-path__lead {
    margin: 0 auto 22px;
    max-width: 44ch;
    font-size: 1.0625rem;
    line-height: 1.6;
}

.pl-path--producer .pl-path__header {
    width: 100%;
    max-width: 36rem;
    margin: -20px auto 0;
    text-align: center;
}

.pl-path--producer .pl-path__header .pl-eyebrow {
    display: flex;
    width: 100%;
    margin: 0 0 8px;
    justify-content: flex-start;
}

.pl-path--producer .pl-path__title {
    margin: var(--pl-producer-title-before, 10px) 0 var(--pl-producer-title-after, 16px);
}

.pl-path--producer .pl-path__lead {
    margin: 0 auto 16px;
    max-width: 100%;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 86%, transparent);
    line-height: 1.45;
    text-wrap: pretty;
}

.pl-path__lead-keep {
    white-space: nowrap;
}

.pl-founder-count {
    display: inline;
    margin: 0 .12em;
    color: var(--pl-tricolor-yellow);
    font-size: 1.305em;
    font-weight: 800;
    line-height: inherit;
    letter-spacing: -.03em;
    vertical-align: baseline;
}

.pl-path--buyer .pl-path__header {
    width: 100%;
    max-width: 36rem;
    margin: -20px auto 0;
    text-align: center;
}

.pl-path--buyer .pl-path__header .pl-eyebrow {
    display: flex;
    width: 100%;
    margin: 0 0 8px;
    justify-content: flex-start;
}

.pl-path--buyer .pl-path__title {
    margin: var(--pl-buyer-title-before, 14px) 0 12px;
    font-size: clamp(1.625rem, 3.8vw, 2.25rem);
    color: var(--sf-text-inverse, #fff);
}

.pl-path--buyer .pl-path__lead {
    margin: 0 auto var(--pl-buyer-title-after, 18px);
    max-width: 100%;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 86%, transparent);
    font-size: 1.0625rem;
    line-height: 1.5;
    text-wrap: pretty;
}

.pl-path--buyer .pl-eyebrow {
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 84%, transparent);
}

.pl-path--buyer .pl-eyebrow::before {
    background: color-mix(in srgb, var(--sf-text-inverse, #fff) 70%, transparent);
}

.pl-buyer-offer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, var(--pl-buyer-content-max, 28rem)) minmax(0, 1fr);
    width: 100%;
    max-width: none;
    margin: 0;
    padding: var(--pl-buyer-section-gap, 10px) 0 calc(var(--pl-buyer-section-gap, 10px) + 2px);
}

.pl-buyer-offer > * {
    grid-column: 2;
    justify-self: stretch;
    width: 100%;
    text-align: left;
}

.pl-buyer-benefit__title {
    margin: 0 0 4px;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 92%, var(--pl-tricolor-yellow));
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .14em;
    line-height: 1.3;
    text-transform: uppercase;
}

.pl-buyer-benefit__body {
    margin: 0;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 88%, transparent);
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.45;
    text-wrap: pretty;
}

.pl-buyer-benefit--primary .pl-buyer-benefit__title {
    margin-bottom: 8px;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 96%, var(--pl-tricolor-yellow));
    font-size: .875rem;
}

.pl-buyer-benefit--primary .pl-buyer-benefit__body {
    font-size: 1rem;
    font-weight: 500;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 90%, transparent);
}

.pl-buyer-benefits {
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pl-buyer-benefits .pl-buyer-benefit {
    position: relative;
    padding-left: 1.35em;
}

.pl-buyer-benefits .pl-buyer-benefit::before {
    content: "";
    position: absolute;
    left: 0;
    top: .52em;
    width: .55em;
    height: .3em;
    border-bottom: 2px solid color-mix(in srgb, var(--sf-text-inverse, #fff) 88%, var(--pl-tricolor-yellow));
    border-left: 2px solid color-mix(in srgb, var(--sf-text-inverse, #fff) 88%, var(--pl-tricolor-yellow));
    transform: rotate(-45deg);
}

.pl-buyer-reward {
    width: 100%;
    max-width: none;
    margin: var(--pl-buyer-reward-offset, 10px) 0 0;
    padding: calc(var(--pl-buyer-section-gap, 10px) + 2px) 0 0;
    border-top: 1px solid color-mix(in srgb, var(--sf-text-inverse, #fff) 16%, transparent);
    text-align: center;
}

.pl-buyer-reward__label {
    margin: 0 0 4px;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 82%, transparent);
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .14em;
    line-height: 1.3;
    text-transform: uppercase;
}

.pl-buyer-reward__value {
    margin: 0 auto;
    max-width: 100%;
    color: var(--sf-text-inverse, #fff);
    font-size: clamp(1.3125rem, 3.2vw, 1.75rem);
    font-weight: 800;
    line-height: 1.16;
    letter-spacing: -.02em;
    text-wrap: pretty;
}

.pl-buyer-reward__detail {
    margin: 3px auto 0;
    max-width: 36ch;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 76%, transparent);
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1.32;
    text-wrap: pretty;
}

.pl-path--buyer .pl-path__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: none;
    width: 100%;
    margin: 0 0 -5px;
    margin-top: auto;
    padding: var(--pl-buyer-btn-gutter-top, 25px) 0 var(--pl-buyer-btn-gutter-bottom, 0);
}

.pl-path--buyer .prelaunch-join-form {
    width: 100%;
}

.pl-path--buyer .prelaunch-join-form .pl-path__actions {
    margin: 0 0 -5px;
    padding: var(--pl-buyer-btn-gutter-top, 25px) 0 var(--pl-buyer-btn-gutter-bottom, 0);
}

.pl-founder-offer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, var(--pl-producer-content-max, 30rem)) minmax(0, 1fr);
    width: 100%;
    max-width: none;
    margin: 0;
    padding: var(--pl-producer-section-gap, 10px) 0 calc(var(--pl-producer-section-gap, 10px) + 2px);
}

.pl-founder-offer > * {
    grid-column: 2;
    justify-self: start;
    text-align: left;
}

.pl-founder-offer__label {
    margin: 0 0 5px;
    color: color-mix(in srgb, var(--pl-tricolor-yellow) 92%, var(--sf-text-inverse, #fff));
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .16em;
    line-height: 1.3;
    text-transform: uppercase;
}

.pl-founder-offer__hero {
    display: flex;
    align-items: center;
    gap: clamp(8px, 2vw, 12px);
    margin-bottom: 14px;
}

.pl-founder-offer__rate {
    flex: 0 0 auto;
    color: var(--sf-text-inverse, #fff);
    font-size: clamp(2.6rem, 8.8vw, 4rem);
    font-weight: 800;
    line-height: .88;
    letter-spacing: -.05em;
}

.pl-founder-offer__lines {
    display: flex;
    flex-direction: column;
    gap: .2em;
    min-width: 0;
}

.pl-founder-offer__line {
    display: block;
    color: var(--sf-text-inverse, #fff);
    font-size: clamp(1rem, 2.6vw, 1.1875rem);
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: -.015em;
    text-wrap: pretty;
}

.pl-founder-offer__extras {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pl-founder-offer__extras li {
    position: relative;
    padding-left: 1.35em;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 86%, transparent);
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1.45;
    text-wrap: pretty;
}

.pl-founder-offer__extras li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .52em;
    width: .55em;
    height: .3em;
    border-bottom: 2px solid var(--pl-tricolor-yellow);
    border-left: 2px solid var(--pl-tricolor-yellow);
    transform: rotate(-45deg);
}

.pl-founder-plus {
    width: 100%;
    max-width: none;
    margin: var(--pl-producer-plus-offset, 10px) 0 0;
    padding: calc(var(--pl-producer-section-gap, 10px) + 2px) 0 0;
    border-top: 1px solid color-mix(in srgb, var(--sf-text-inverse, #fff) 10%, transparent);
    text-align: center;
}

.pl-founder-plus__label {
    margin: 0 0 4px;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 46%, transparent);
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .14em;
    line-height: 1.3;
    text-transform: uppercase;
}

.pl-founder-plus__detail {
    margin: 0 auto;
    max-width: 100%;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 60%, transparent);
    font-size: 1.0625rem;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
    text-wrap: pretty;
}

.pl-highlights {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    width: 100%;
    max-width: 640px;
    margin: 0 auto 20px;
    padding: 0;
    list-style: none;
}

.pl-highlight {
    padding: 16px 18px;
    border-radius: var(--sf-radius, 12px);
    border-left: 3px solid var(--sf-accent, #f59e0b);
    background: color-mix(in srgb, var(--sf-text-inverse, #fff) 12%, transparent);
    color: var(--sf-text-inverse, #fff);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.35;
    text-align: center;
}

.pl-path--producer .pl-highlight {
    border: 1px solid color-mix(in srgb, var(--sf-text-inverse, #fff) 22%, transparent);
    border-top: 3px solid var(--pl-tricolor-yellow);
    background: color-mix(in srgb, var(--sf-text-inverse, #fff) 12%, transparent);
    color: var(--sf-text-inverse, #fff);
    box-shadow: none;
}

.pl-path__note {
    margin: 0 auto 22px;
    max-width: 46ch;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 66%, transparent);
    font-size: .9375rem;
    line-height: 1.6;
}

.pl-path--producer .pl-path__note {
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 74%, transparent);
}

.pl-path--producer .pl-path__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    max-width: none;
    width: 100%;
    margin: 0 0 -5px;
    margin-top: auto;
    padding: var(--pl-producer-btn-gutter-top, 25px) 0 var(--pl-producer-btn-gutter-bottom, 0);
}

.pl-points {
    margin: 0 auto 22px;
    color: var(--sf-primary);
    font-size: clamp(1.5rem, 4.4vw, 2.125rem);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.02em;
}

.pl-path--producer,
.pl-path--buyer,
.pl-lanes {
    --pl-enrolled-status-max-width: 46ch;
    --pl-enrolled-status-min-height: 5.75rem;
}

.pl-path__status {
    width: 100%;
    max-width: var(--pl-enrolled-status-max-width, 46ch);
    margin: 0 auto 20px;
    padding: 14px 16px;
    border: 1px solid color-mix(in srgb, var(--sf-success, #15803d) 34%, transparent);
    border-radius: var(--sf-radius, 12px);
    background: color-mix(in srgb, var(--sf-success, #15803d) 10%, transparent);
    font-size: .9375rem;
    line-height: 1.55;
    text-align: center;
    text-wrap: pretty;
    box-sizing: border-box;
}

.pl-path__actions--status,
.pl-lane__actions--status {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: auto;
}

.pl-path__actions--status .pl-path__status,
.pl-lane__actions--status .pl-lane__status {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: var(--pl-enrolled-status-max-width, 46ch);
    min-height: var(--pl-enrolled-status-min-height, 5.75rem);
    margin: 0;
    padding: 14px 18px;
    text-align: center;
}

.pl-path--producer .pl-path__actions--status {
    padding: var(--pl-producer-btn-gutter-top, 25px) 0 var(--pl-producer-btn-gutter-bottom, 0);
}

.pl-path--buyer .pl-path__actions--status {
    padding: var(--pl-buyer-btn-gutter-top, 14px) 0 var(--pl-buyer-btn-gutter-bottom, 0);
}

.pl-lane__actions--status {
    margin-top: auto;
    padding-top: 4px;
}

.pl-lane__actions--status .pl-lane__status {
    min-height: var(--pl-enrolled-status-min-height, 5.75rem);
    padding: 14px 18px;
    font-size: .9375rem;
    line-height: 1.55;
}

.pl-path--producer .pl-path__status {
    border-color: color-mix(in srgb, var(--sf-text-inverse, #fff) 28%, transparent);
    background: color-mix(in srgb, var(--sf-text-inverse, #fff) 10%, transparent);
    color: var(--sf-text-inverse, #fff);
}

.pl-path__actions {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: auto;
    padding-top: 4px;
}

.pl-path__actions .pl-btn {
    width: auto;
    min-width: min(100%, 320px);
    max-width: 100%;
}

.pl-path--producer .pl-path__actions .pl-btn,
.pl-path--buyer .pl-path__actions .pl-btn {
    box-sizing: border-box;
    width: min(100%, var(--pl-path-cta-width, 330px));
    min-width: min(100%, var(--pl-path-cta-width, 330px));
    max-width: var(--pl-path-cta-width, 330px);
    min-height: var(--pl-path-cta-min-height, 51px);
    padding: var(--pl-path-cta-padding-y, 15px) var(--pl-path-cta-padding-x, 28px);
    font-size: var(--pl-path-cta-font-size, 0.945rem);
}

.pl-path .prelaunch-consent {
    margin-top: 0;
    margin-bottom: 12px;
}

.pl-path--buyer .prelaunch-consent {
    background: color-mix(in srgb, #000 16%, transparent);
    border-color: color-mix(in srgb, var(--sf-text-inverse, #fff) 22%, transparent);
    color: var(--sf-text-inverse, #fff);
}

.pl-path--buyer .prelaunch-consent label,
.pl-path--buyer .prelaunch-consent label a {
    color: var(--sf-text-inverse, #fff);
}

.pl-path--buyer .pl-path__status {
    border-color: color-mix(in srgb, var(--sf-text-inverse, #fff) 28%, transparent);
    background: color-mix(in srgb, var(--sf-text-inverse, #fff) 10%, transparent);
    color: var(--sf-text-inverse, #fff);
}

.pl-path--buyer .validation {
    color: #FFE8D6;
}

/* ---------------------------------------------------- product diversity */

.pl-diversity {
    padding: var(--pl-path-card-gap) var(--pl-path-gutter) 0;
}

.pl-diversity__frame {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    max-width: none;
    margin: 0;
    border-radius: var(--pl-radius);
    background: var(--pl-deep);
}

.pl-diversity__img {
    aspect-ratio: 16 / 10;
    object-position: 50% 78%;
}

/*
 * Below the large breakpoint the copy sits under the photo on the deep surface,
 * so no scrim is needed and contrast never depends on the photograph.
 */
.pl-diversity__panel {
    position: relative;
    z-index: 1;
    padding: 26px 22px 30px;
    color: var(--sf-text-inverse, #fff);
}

.pl-diversity__title {
    margin: 0 0 12px;
    font-size: clamp(1.625rem, 4.8vw, 2.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.022em;
    text-wrap: balance;
}

.pl-diversity__lead {
    margin: 0;
    max-width: 48ch;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 86%, transparent);
    font-size: 1rem;
    line-height: 1.62;
}

.pl-diversity__cats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    margin: 18px 0 0;
    padding: 0;
    max-width: 46rem;
    list-style: none;
}

.pl-diversity__cats li {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border: 1px solid color-mix(in srgb, var(--pl-accent) 55%, var(--sf-text-inverse, #fff));
    border-radius: 999px;
    background: color-mix(in srgb, var(--pl-accent) 22%, transparent);
    color: var(--sf-text-inverse, #fff);
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1.3;
}

.pl-diversity__cats li:not(:last-child)::after {
    content: none;
}

.pl-diversity__close {
    margin: 16px 0 0;
    max-width: 46ch;
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 92%, transparent);
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.5;
}

/* ---------------------------------------------------------- why recona */

.pl-why {
    padding: var(--pl-section-gap) var(--pl-path-gutter);
    background: var(--pl-warm-ground);
}

.pl-why__inner {
    max-width: 46rem;
    margin: 0 auto;
    padding: 4px 2px 0;
    text-align: left;
}

.pl-title-accent {
    color: var(--pl-title-accent, var(--pl-accent));
}

.pl-diversity__title .pl-title-accent,
.pl-manifesto__title .pl-title-accent {
    color: var(--pl-title-accent-on-dark, var(--pl-title-accent, var(--pl-accent)));
}

.pl-why__title {
    margin: 0 0 20px;
    font-size: clamp(1.5rem, 4.2vw, 2.25rem);
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -.022em;
    text-wrap: balance;
}

.pl-why__text {
    margin: 0 0 14px;
    color: var(--pl-ink-soft);
    font-size: 1.0625rem;
    line-height: 1.65;
}

.pl-why__text:last-of-type {
    margin-bottom: 0;
}

.pl-why__close {
    margin: 22px 0 0;
    padding-top: 18px;
    border-top: 1px solid color-mix(in srgb, var(--sf-text) 12%, transparent);
    color: var(--sf-text);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: -.01em;
    text-wrap: pretty;
}

/* ---------------------------------------------------------- how it works */

.pl-how {
    padding: var(--pl-section-gap) var(--pl-path-gutter);
    background: var(--pl-warm-ground);
}

.pl-how__inner {
    padding: 8px 2px 4px;
}

.pl-how__title {
    margin: 0 0 28px;
    font-size: clamp(1.5rem, 3.8vw, 2.125rem);
    font-weight: 800;
    line-height: 1.16;
    letter-spacing: -.02em;
    text-wrap: balance;
}

.pl-how__steps {
    --pl-how-num: 2.5rem;
    --pl-how-line-size: 2px;
    --pl-how-line-color: var(--pl-navy);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pl-how__step {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: var(--pl-how-num) minmax(0, 1fr);
    column-gap: 14px;
    align-items: start;
    min-width: 0;
}

.pl-how__step::marker {
    content: none;
}

.pl-how__step:not(:last-child)::after {
    content: "";
    position: absolute;
    z-index: 0;
    left: calc(var(--pl-how-num) / 2);
    top: calc(var(--pl-how-num) + 6px);
    width: var(--pl-how-line-size);
    height: calc(100% + 22px - var(--pl-how-num) - 6px);
    background: var(--pl-how-line-color);
    transform: translateX(-50%);
    pointer-events: none;
}

.pl-how__step:last-child::after {
    content: none;
}

.pl-how__num {
    display: grid;
    place-items: center;
    box-sizing: border-box;
    width: var(--pl-how-num);
    height: var(--pl-how-num);
    margin: 0;
    border: 0;
    border-radius: 50%;
    background: var(--pl-navy);
    box-shadow: 0 0 0 4px var(--pl-warm-ground);
    color: var(--sf-text-inverse, #fff);
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .04em;
    line-height: 1;
    position: relative;
    z-index: 1;
}

.pl-how__step-title,
.pl-how__step-text {
    grid-column: 2;
    min-width: 0;
}

.pl-how__step-title {
    margin: 4px 0 8px;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.32;
    letter-spacing: -.01em;
}

.pl-how__step-text {
    margin: 0;
    color: var(--pl-ink-soft);
    font-size: 1rem;
    line-height: 1.62;
    text-wrap: pretty;
}

/* ------------------------------------------------------ editorial story */

.pl-editorial {
    padding: calc(var(--pl-section-gap) * 1.4) var(--pl-path-gutter);
    background: var(--pl-warm-ground);
}

.pl-editorial__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: var(--pl-path-card-gap);
    max-width: none;
    margin: 0;
}

.pl-editorial__media {
    position: relative;
    overflow: hidden;
    margin: 0;
    min-height: clamp(240px, 52vw, 360px);
    border-radius: calc(var(--pl-radius) - 2px);
    background: color-mix(in srgb, var(--sf-text) 5%, var(--sf-surface, #fff));
    box-shadow: 0 18px 36px -28px color-mix(in srgb, var(--sf-text) 38%, transparent);
}

.pl-editorial__media picture {
    display: block;
    height: 100%;
}

.pl-editorial__img {
    width: 100%;
    height: 100%;
    min-height: clamp(240px, 52vw, 360px);
    aspect-ratio: auto;
    object-fit: cover;
    object-position: 50% 42%;
}

.pl-editorial__title {
    margin: 0 0 18px;
    font-size: clamp(1.625rem, 4.6vw, 2.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.022em;
    text-wrap: balance;
}

.pl-editorial__lead {
    margin: 0 0 16px;
    max-width: 46ch;
    color: var(--pl-ink-soft);
    font-size: 1.125rem;
    line-height: 1.6;
}

.pl-editorial__text {
    margin: 0;
    max-width: 46ch;
    color: var(--pl-ink-muted);
    font-size: 1rem;
    line-height: 1.65;
}

.pl-editorial__text + .pl-editorial__text {
    margin-top: 14px;
}

/* ------------------------------------------------------------ manifesto */

.pl-manifesto {
    padding: var(--pl-path-card-gap) var(--pl-path-gutter) 0;
}

.pl-manifesto__frame {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(34px, 5vw, 52px) clamp(18px, 3.4vw, 44px);
    border-radius: var(--pl-radius);
    background:
        linear-gradient(
            180deg,
            var(--pl-navy) 0%,
            color-mix(in srgb, var(--pl-navy) 78%, #fff) 100%);
    color: var(--sf-text-inverse, #fff);
    border: 1px solid color-mix(in srgb, var(--pl-navy) 62%, #fff);
    text-align: center;
}

.pl-manifesto__frame::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
        circle at 50% 0%,
        color-mix(in srgb, #fff 10%, transparent) 0%,
        transparent 48%);
    pointer-events: none;
}

.pl-manifesto__title {
    position: relative;
    z-index: 1;
    margin: 0 auto 18px;
    max-width: min(100%, 34rem);
    font-size: clamp(1.5rem, 3.2vw, 2.25rem);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.02em;
    text-align: center;
    text-wrap: balance;
}

.pl-manifesto__text {
    position: relative;
    z-index: 1;
    margin: 0 auto;
    max-width: min(100%, 40rem);
    color: color-mix(in srgb, var(--sf-text-inverse, #fff) 86%, transparent);
    font-size: 1.0625rem;
    font-weight: 500;
    line-height: 1.58;
}

.pl-manifesto__text + .pl-manifesto__text {
    margin-top: 12px;
}

/* ---------------------------------------------------------- closing cta */

.pl-closing {
    padding: clamp(36px, 5.5vw, 64px) var(--pl-path-gutter) clamp(36px, 5vw, 52px);
    text-align: center;
}

.pl-closing__header {
    margin: 0 auto clamp(24px, 4vw, 36px);
    max-width: min(1120px, 100%);
}

.pl-closing__title {
    margin: 0 0 12px;
    font-size: clamp(1.75rem, 4.2vw, 2.75rem);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -.024em;
    text-wrap: balance;
}

.pl-closing__lead {
    margin: 0 auto;
    max-width: 46ch;
    color: var(--pl-ink-soft);
    font-size: clamp(1.0625rem, 2.2vw, 1.1875rem);
    line-height: 1.55;
}

.pl-lanes--closing {
    width: 100%;
    max-width: min(1140px, 100%);
    margin: 0 auto;
    gap: clamp(24px, 3.6vw, 36px);
}

.pl-lanes--closing .pl-lane {
    align-items: stretch;
    width: 100%;
}

.pl-lanes--closing .pl-btn {
    width: 100%;
    min-height: 59px;
    padding: 17px 33px;
    font-size: 1.1rem;
}

.pl-lanes--closing .pl-lane__note {
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    text-align: center;
    text-wrap: pretty;
    font-size: clamp(.875rem, 1.9vw, .9375rem);
    line-height: 1.5;
}

/* ------------------------------------- producer application / legal pages */

.prelaunch > .container {
    width: min(100%, 1024px);
    max-width: 1024px;
}

.prelaunch__section {
    padding: 40px 0;
}

.prelaunch__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 16px;
    color: var(--sf-primary);
    font-size: .75rem;
    font-weight: 700;
    --prelaunch-eyebrow-tracking: 0.16em;
    letter-spacing: var(--prelaunch-eyebrow-tracking);
    text-transform: uppercase;
}

.prelaunch__eyebrow::before,
.prelaunch__eyebrow::after {
    content: "";
    flex: 0 0 auto;
    width: 26px;
    height: 2px;
    background: currentColor;
}

.prelaunch__eyebrow::after {
    margin-left: calc(-1 * var(--prelaunch-eyebrow-tracking));
}

.prelaunch__title {
    margin: 0 0 18px;
    font-size: clamp(1.75rem, 4.4vw, 2.5rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.024em;
    text-wrap: balance;
}

.prelaunch__subtitle {
    margin: 0 0 14px;
    font-size: clamp(1.125rem, 2.4vw, 1.4375rem);
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -.012em;
}

.prelaunch__lead {
    margin: 0 0 14px;
    color: var(--pl-ink-soft);
    font-size: 1.0625rem;
    line-height: 1.62;
}

.prelaunch__lead--accent {
    color: var(--pl-accent-deep);
    font-weight: 700;
}

.prelaunch__note {
    margin: 0;
    color: var(--pl-ink-muted);
    font-size: .9375rem;
    line-height: 1.6;
}

.prelaunch__founder-panel {
    margin: 22px 0 0;
    padding: 20px 18px;
    border: 1px solid var(--sf-border);
    border-top: 3px solid var(--pl-tricolor-yellow);
    border-radius: var(--sf-radius, 12px);
    background: color-mix(in srgb, var(--pl-tricolor-blue) 6%, var(--sf-surface));
}

.prelaunch__founder-panel-title {
    margin: 0 0 14px;
    font-size: 1.0625rem;
    font-weight: 800;
    line-height: 1.3;
}

.prelaunch__founder-panel-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.prelaunch__founder-panel-item {
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1.45;
    color: var(--pl-ink-soft);
}

.prelaunch__bonus {
    margin: 22px 0 0;
    padding: 18px 20px;
    border-radius: var(--sf-radius, 12px);
    border: 1px solid color-mix(in srgb, var(--pl-title-accent, #EDA526) 50%, var(--sf-border));
    border-left: 5px solid var(--pl-title-accent, #EDA526);
    background: color-mix(in srgb, var(--pl-title-accent, #EDA526) 18%, var(--sf-surface));
    color: var(--sf-text);
    font-size: .9375rem;
    font-weight: 800;
    line-height: 1.45;
    box-shadow: 0 8px 22px color-mix(in srgb, var(--pl-title-accent, #EDA526) 16%, transparent);
}

.prelaunch__bonus strong {
    display: block;
    font-weight: 800;
}

.prelaunch__benefit {
    display: block;
    margin: 18px 0 0;
    max-width: 60ch;
    padding: 16px 18px;
    border-radius: var(--sf-radius, 12px);
    border-left: 3px solid var(--sf-accent, #f59e0b);
    background: color-mix(in srgb, var(--sf-accent, #f59e0b) 10%, var(--sf-surface));
    color: var(--sf-text);
    font-weight: 800;
    line-height: 1.4;
}

.prelaunch__actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    margin-top: 26px;
}

.prelaunch__actions .btn {
    min-height: 54px;
    padding: 15px 30px;
    border-radius: var(--sf-button-primary-radius, 10px);
    font-size: 1rem;
    font-weight: 700;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease,
                border-color .18s ease;
}

.prelaunch__actions .btn:hover,
.prelaunch__actions .btn:focus-visible {
    transform: translateY(-1px);
}

.prelaunch__actions--submit {
    justify-content: center;
    align-items: center;
    text-align: center;
}

.prelaunch__actions--submit .btn {
    width: auto;
    min-width: min(100%, 320px);
    max-width: 100%;
}

.prelaunch-body .btn-primary {
    background: var(--pl-btn-blue);
    border-color: var(--pl-btn-blue-border);
    color: var(--sf-text-inverse, #fff);
    box-shadow: var(--pl-btn-shadow-primary);
}

.prelaunch-body .btn-primary:hover,
.prelaunch-body .btn-primary:focus-visible {
    background: var(--pl-btn-blue);
    border-color: var(--pl-btn-blue-border);
    color: var(--sf-text-inverse, #fff);
    box-shadow: var(--pl-btn-shadow-primary-hover);
}

.prelaunch-body .btn-primary:active {
    box-shadow: var(--pl-btn-shadow-primary);
}

.prelaunch-body .btn-outline-primary {
    background: var(--pl-btn-surface);
    border-color: var(--pl-btn-surface-border);
    color: var(--sf-text);
    box-shadow: var(--pl-btn-shadow-surface);
}

.prelaunch-body .btn-outline-primary:hover,
.prelaunch-body .btn-outline-primary:focus-visible {
    background: var(--pl-btn-surface);
    border-color: var(--pl-btn-surface-border);
    color: var(--sf-text);
    box-shadow: var(--pl-btn-shadow-surface-hover);
}

.prelaunch-body .btn-outline-primary:active {
    box-shadow: var(--pl-btn-shadow-surface);
}

.prelaunch__form-intro {
    margin: 0 0 28px;
    padding: 0 0 28px;
    border-bottom: 1px solid var(--sf-border);
    text-align: center;
}

.prelaunch__form-intro .prelaunch__title {
    margin-bottom: 18px;
}

.prelaunch__form-intro .prelaunch__eyebrow {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.prelaunch__form-intro .prelaunch__lead--accent {
    margin: 0 0 20px;
}

.prelaunch__form-intro .prelaunch__founder-panel,
.prelaunch__form-intro .prelaunch__bonus {
    text-align: left;
}

.prelaunch__form-intro .prelaunch__founder-panel {
    margin-top: 28px;
}

.prelaunch__form-intro .prelaunch__bonus {
    margin-top: 26px;
}

.prelaunch__confirmation {
    padding: 32px 24px 36px;
    text-align: center;
    border-radius: calc(var(--pl-radius, 12px) - 2px);
    background:
        radial-gradient(120% 80% at 50% 0%, color-mix(in srgb, var(--pl-accent-pale) 88%, var(--sf-surface)) 0%, transparent 62%),
        color-mix(in srgb, var(--pl-warm-ground) 42%, var(--sf-surface));
}

.prelaunch__confirmation-logo {
    display: flex;
    justify-content: center;
    margin: 0 0 22px;
    line-height: 0;
}

.prelaunch__confirmation-logo .brand-logo-secondary {
    display: block;
    width: auto;
    max-width: min(240px, 58vw);
    max-height: 96px;
    object-fit: contain;
}

.prelaunch__confirmation-greeting {
    margin: 0 0 12px;
    color: var(--pl-accent-deep);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.prelaunch__confirmation .prelaunch__title {
    margin-bottom: 14px;
    font-size: clamp(1.625rem, 3.6vw, 2.125rem);
    line-height: 1.15;
}

.prelaunch__confirmation-message {
    margin: 0 auto;
    max-width: 44ch;
    color: var(--pl-ink-soft);
    font-size: 1.0625rem;
    line-height: 1.65;
}

.prelaunch__confirmation-message + .prelaunch__confirmation-message {
    margin-top: 16px;
}

.prelaunch__confirmation-link {
    color: var(--pl-navy);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.prelaunch__confirmation-link:hover,
.prelaunch__confirmation-link:focus-visible {
    color: var(--pl-navy-hover);
    text-decoration-thickness: 2px;
}

.prelaunch__card {
    padding: 28px 22px;
    border: 1px solid var(--sf-border);
    border-radius: var(--pl-radius);
    background: var(--sf-surface, #fff);
    box-shadow: 0 24px 56px -46px color-mix(in srgb, var(--sf-text) 40%, transparent);
}

.prelaunch__card--producer {
    border-top: 3px solid var(--sf-primary);
}

.prelaunch__status-note {
    margin: 12px 0 0;
    color: var(--sf-text-muted, #5c6570);
    font-size: 0.95rem;
    line-height: 1.45;
}

.prelaunch__status-card--pending {
    border-top-color: var(--pl-navy, #002B7F);
}

.prelaunch__status-card--selected {
    border-top-color: var(--pl-accent, #C4623A);
}

.prelaunch__status-card--rejected,
.prelaunch__status-card--withdrawn {
    border-top-color: var(--sf-border, #d7d7d7);
}

.prelaunch__form-card {
    max-width: 899px;
    margin: 0 auto;
    overflow: visible;
}

.prelaunch-consent {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 20px;
    padding: 16px 18px;
    border: 1px solid var(--sf-border);
    border-radius: var(--sf-radius, 12px);
    background: color-mix(in srgb, var(--sf-page-bg) 70%, var(--sf-surface));
}

.prelaunch-consent input[type="checkbox"] {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-top: 2px;
}

.prelaunch-consent label {
    margin: 0;
    font-size: .9375rem;
    line-height: 1.55;
}

.prelaunch-consent label a {
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prelaunch-consent-validation {
    display: block;
    min-height: 15px;
    margin-top: 6px;
}

.prelaunch .validation {
    display: block;
    min-height: 15px;
    margin-top: 3px;
    color: #d9363e;
    font-size: .77rem;
}

.prelaunch .prelaunch-producer-summary:empty {
    display: none;
}

.prelaunch .seller-required {
    color: #dc3545;
}

.prelaunch .seller-application-list-container {
    position: relative;
}

.prelaunch .seller-application-field {
    position: relative;
}

.prelaunch .seller-application-autocomplete {
    position: absolute;
    z-index: 40;
    top: 100%;
    right: 0;
    left: 0;
    display: none;
    max-height: 220px;
    margin-top: 4px;
    padding: 6px;
    overflow-y: auto;
    background: var(--sf-surface, #fff);
    border: 1px solid var(--sf-border, #d8dee8);
    border-radius: var(--sf-radius, 8px);
    box-shadow: 0 12px 28px color-mix(in srgb, var(--sf-text) 16%, transparent);
}

.prelaunch .seller-application-autocomplete button {
    display: block;
    width: 100%;
    min-height: 0;
    margin: 0;
    padding: 8px 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    box-shadow: none;
    color: var(--sf-text, #25344a);
    font-weight: 500;
    line-height: 1.35;
    text-align: left;
}

.prelaunch .seller-application-autocomplete button:hover,
.prelaunch .seller-application-autocomplete button:focus,
.prelaunch .seller-application-autocomplete button:focus-visible {
    background: color-mix(in srgb, var(--sf-primary, #002B7F) 10%, var(--sf-surface, #fff));
    color: var(--sf-primary, #002B7F);
    transform: none;
}

.prelaunch .alert {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

/* ------------------------------------------------------------- footer */

.prelaunch-footer {
    flex-shrink: 0;
    margin-top: auto;
    padding: 28px var(--pl-gutter) 36px;
    border-top: 1px solid var(--sf-border);
    background: color-mix(in srgb, var(--sf-surface) 92%, var(--sf-page-bg));
}

.prelaunch-footer__inner {
    max-width: var(--pl-shell-max);
    margin: 0 auto;
    text-align: center;
}

.prelaunch-footer__nav {
    margin-bottom: 16px;
}

.prelaunch-footer__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.prelaunch-footer__item {
    display: flex;
    align-items: center;
}

.prelaunch-footer__item:not(:last-child)::after {
    content: "·";
    margin: 0 12px;
    color: color-mix(in srgb, var(--sf-text) 42%, transparent);
    font-weight: 700;
    pointer-events: none;
    user-select: none;
}

.prelaunch-footer__link {
    display: inline-block;
    color: color-mix(in srgb, var(--sf-text) 74%, transparent);
    font-size: .875rem;
    line-height: 1.4;
    text-decoration: none;
    white-space: nowrap;
}

.prelaunch-footer__link:hover,
.prelaunch-footer__link:focus-visible {
    color: var(--sf-primary);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prelaunch-footer__link--button {
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
    font: inherit;
}

.prelaunch-footer .platform-footer-bar--legal-strip {
    margin-top: 20px;
    width: 100%;
    max-width: var(--pl-shell-max);
    margin-inline: auto;
}

.prelaunch-footer .platform-footer-bar--legal-strip .platform-footer-bar__start {
    color: color-mix(in srgb, var(--sf-text) 56%, transparent);
    font-size: .8125rem;
}

.prelaunch-footer .platform-footer-bar--legal-strip .platform-footer-bar__cookie .cookie-preferences-link--legal-strip {
    min-height: auto;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: color-mix(in srgb, var(--sf-text) 56%, transparent);
    font-size: .8125rem;
    font-weight: inherit;
    text-decoration: none;
    cursor: pointer;
}

.prelaunch-footer .platform-footer-bar--legal-strip .platform-footer-bar__cookie .cookie-preferences-link--legal-strip:hover,
.prelaunch-footer .platform-footer-bar--legal-strip .platform-footer-bar__cookie .cookie-preferences-link--legal-strip:focus-visible {
    color: color-mix(in srgb, var(--sf-text) 72%, transparent);
}

/* ---------------------------------------- authentication inside the shell */

.prelaunch-auth {
    padding: 32px 0 56px;
}

.prelaunch-auth #loginFormContainer {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 20px;
}

.prelaunch-auth .login-popup {
    background: none;
    position: relative;
    width: 100%;
}

.prelaunch-auth .login-popup .close-back {
    display: none;
}

.prelaunch-auth .login-popup .popup,
.prelaunch-auth .login-popup .popup.popup-large,
.prelaunch-auth .login-popup .auth-card {
    width: 100%;
    max-width: 1020px;
    max-height: none;
    margin: 0 auto;
    border: 1px solid var(--sf-border);
    background: var(--sf-surface);
    border-radius: var(--pl-radius);
    box-shadow: 0 24px 60px -42px color-mix(in srgb, var(--sf-text) 28%, transparent);
    overflow: hidden;
}

.prelaunch-auth .login-popup .auth-card__grid {
    min-height: 620px;
}

.prelaunch-auth .popup-heading .h4 {
    display: none;
}

/* --------------------------------------------------------- legal pages */

.prelaunch-legal-page {
    padding-bottom: 48px;
}

/* Article width is authoritative (1000px); .container stays fluid so Bootstrap 960px cap does not shrink it. */
.prelaunch-legal-page > .container {
    width: 100%;
    max-width: none;
    --bs-gutter-x: 0;
    padding-inline: var(--pl-gutter);
}

.prelaunch-legal-page__article {
    box-sizing: border-box;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 12px 0 24px;
}

.prelaunch-legal-page__content {
    padding: 28px 24px;
    border: 1px solid var(--sf-border);
    border-radius: var(--pl-radius);
    background: var(--sf-surface);
    line-height: 1.65;
    /* CMS bodies contain long unbreakable URLs (ANPC / EU ODR) */
    overflow-wrap: anywhere;
}

.prelaunch-legal-page__content img,
.prelaunch-legal-page__content table {
    max-width: 100%;
}

.prelaunch-legal-page__content table {
    display: block;
    overflow-x: auto;
}

/* ------------------------------------------------------ responsive rules */

@media (max-width: 389px) {
    .pl-founder-offer__hero {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .pl-founder-offer__rate {
        font-size: clamp(2.2rem, 12.8vw, 2.8rem);
    }
}

@media (min-width: 560px) {
    .pl-highlights {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pl-path__actions .pl-btn {
        width: auto;
        min-width: 270px;
    }

    .pl-path--producer .pl-path__actions .pl-btn,
    .pl-path--buyer .pl-path__actions .pl-btn {
        width: min(100%, var(--pl-path-cta-width, 330px));
        min-width: min(100%, var(--pl-path-cta-width, 330px));
    }

    .prelaunch__actions {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }

    .prelaunch__actions .btn {
        min-width: 270px;
    }
}

@media (min-width: 640px) {
    .pl-lanes {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
        gap: 22px;
    }

    .pl-lanes .pl-lane {
        height: 100%;
    }

    .pl-lanes--closing {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(36px, 5vw, 56px);
    }
}

@media (min-width: 768px) {
    .prelaunch-body {
        --pl-gutter: 28px;
        --pl-section-gap: 64px;
    }

    .prelaunch-header__inner {
        min-height: 76px;
    }

    .prelaunch-header__brand img,
    .prelaunch-header__brand .brand-logo-secondary {
        max-width: min(170px, 34vw);
        max-height: 50px;
    }

    .prelaunch-header__brand--centered img,
    .prelaunch-header__brand--centered .brand-logo-secondary {
        max-width: min(196px, 36vw);
        max-height: 60px;
    }

    .pl-path {
        padding: 40px 36px;
    }

    .pl-manifesto__title {
        max-width: min(100%, 42rem);
    }

    .pl-manifesto__text {
        max-width: min(100%, 48rem);
    }

    .pl-how__steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px 32px;
    }

    .pl-how__step {
        grid-template-columns: minmax(0, 1fr);
    }

    .pl-how__num {
        margin-bottom: 8px;
    }

    .pl-how__step-title,
    .pl-how__step-text {
        grid-column: 1;
    }

    .pl-how__step-title {
        margin: 0 0 8px;
    }

    .pl-how__step:not(:last-child)::after {
        left: var(--pl-how-num);
        top: calc(var(--pl-how-num) / 2);
        width: calc(100% + 32px - var(--pl-how-num));
        height: var(--pl-how-line-size);
        transform: none;
    }

    .pl-how__step:nth-child(even)::after {
        content: none;
    }

    .pl-diversity__img {
        aspect-ratio: 2 / 1;
        object-position: 50% 82%;
    }

    .pl-diversity__panel {
        padding: 36px 40px 40px;
    }

    .prelaunch__card {
        padding: 36px 34px;
    }

    .prelaunch-legal-page__content {
        padding: 36px 40px;
    }
}

@media (min-width: 992px) {
    .pl-hero__logo {
        margin: -12px 0 18px;
    }

    .pl-hero__logo img,
    .pl-hero__logo .brand-logo-secondary {
        max-width: min(449px, 46vw);
        max-height: clamp(138px, 13vw, 179px);
    }

    .pl-hero__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: stretch;
        gap: 0;
        min-height: clamp(560px, 62vh, 680px);
        overflow: hidden;
        border: none;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        border-bottom: 1px solid var(--sf-border);
    }

    .pl-hero .pl-lanes .pl-btn {
        padding: 15px 22px;
        font-size: .9375rem;
    }

    .pl-hero__media {
        order: 2;
        position: relative;
        align-self: stretch;
        width: 100%;
        min-height: 100%;
        aspect-ratio: unset;
        border-radius: 0;
        box-shadow: none;
    }

    .pl-hero__media picture {
        position: absolute;
        inset: 0;
    }

    .pl-hero__media .pl-media__img {
        width: 100%;
        height: 100%;
        min-height: 100%;
        aspect-ratio: auto;
        object-fit: cover;
        object-position: 50% 42%;
    }

    .pl-hero__content {
        order: 1;
        justify-content: center;
        padding: 40px 44px 48px;
        border-right: 1px solid var(--sf-border);
    }

    .pl-hero__title {
        max-width: 40ch;
    }

    .pl-hero__subtitle {
        max-width: 52ch;
    }

    .pl-paths {
        padding-top: calc(var(--pl-section-gap) - 8px);
    }

    .pl-paths__inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
        gap: var(--pl-path-card-gap);
    }

    .prelaunch-body {
        --pl-path-card-gap: 20px;
    }

    .pl-path {
        height: 100%;
    }

    .pl-path--producer .pl-path__actions,
    .pl-path--buyer .pl-path__actions {
        margin-top: auto;
    }

    .pl-path--producer .pl-founder-offer,
    .pl-path--buyer .pl-buyer-offer {
        flex: 1 1 auto;
    }

    .pl-path--buyer .prelaunch-join-form {
        display: flex;
        flex-direction: column;
        width: 100%;
        margin-top: auto;
    }

    .pl-path--buyer .prelaunch-join-form .pl-path__actions {
        margin-top: 0;
        padding-top: var(--pl-buyer-btn-gutter-top, 25px);
    }

    .pl-highlights {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pl-how__steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 26px 32px;
    }

    .pl-editorial__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 48px;
    }

    .pl-editorial__media {
        min-height: clamp(360px, 34vw, 460px);
    }

    .pl-editorial__img {
        min-height: clamp(360px, 34vw, 460px);
    }

    .pl-diversity__img {
        aspect-ratio: 21 / 9;
        object-position: 50% 84%;
    }

    /* Fixed dark scrim: contrast of the overlaid copy must not depend on Style tokens. */
    .pl-diversity__frame::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
            100deg,
            rgba(7, 15, 28, .93) 0%,
            rgba(7, 15, 28, .76) 42%,
            rgba(7, 15, 28, .14) 100%);
    }

    .pl-diversity__panel {
        position: absolute;
        inset: 0 auto 0 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        max-width: 640px;
        padding: 48px 52px;
    }

    .pl-diversity__lead,
    .pl-diversity__close {
        max-width: none;
    }
}

@media (min-width: 992px) and (max-width: 1279.98px) {
    /* The hero column is too narrow for two side-by-side calls to action here. */
    .pl-hero .pl-lanes {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
    }
}

@media (min-width: 1280px) {
    .pl-how__steps {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 26px 32px;
    }

    .pl-how__step-text {
        line-height: 1.65;
    }

    .pl-how__step:nth-child(even)::after {
        content: "";
    }

    .pl-how__step:last-child::after {
        content: none;
    }

    .pl-how__step:not(:last-child)::after {
        width: calc(100% + 28px - var(--pl-how-num));
        height: var(--pl-how-line-size);
        background: var(--pl-how-line-color);
    }
}

/* Path cards: negative header margin and zero vertical padding are tuned for the
   equal-height two-column layout (992px+). On narrow viewports, keep eyebrows
   and CTAs inside the card surface with explicit inset padding. */
@media (max-width: 991.98px) {
    .pl-path--producer,
    .pl-path--buyer {
        --pl-producer-btn-gutter-bottom: 4px;
        --pl-buyer-btn-gutter-bottom: 4px;
        padding-top: clamp(18px, 4.5vw, 24px);
        padding-bottom: clamp(20px, 5vw, 28px);
    }

    .pl-path--producer .pl-path__header,
    .pl-path--buyer .pl-path__header {
        margin-top: 0;
    }

    .pl-path--producer .pl-path__actions,
    .pl-path--buyer .pl-path__actions,
    .pl-path--buyer .prelaunch-join-form .pl-path__actions {
        margin-top: 0;
        margin-bottom: 0;
    }

    .pl-path--producer .pl-path__actions--status,
    .pl-path--buyer .pl-path__actions--status {
        margin-top: 0;
    }
}

@media (max-width: 767.98px) {
    .prelaunch-auth #loginFormContainer {
        padding: 0 12px;
    }

    .prelaunch-auth .login-popup .auth-card {
        min-height: auto;
    }

    .prelaunch-auth .login-popup .auth-card__grid {
        min-height: auto;
    }

    .prelaunch-footer__link {
        white-space: normal;
        text-align: center;
    }

    .prelaunch-footer__item:not(:last-child)::after {
        margin: 0 8px;
    }

    .prelaunch__actions .btn {
        width: 100%;
    }

    .prelaunch__actions--submit .btn {
        width: auto;
        min-width: min(100%, 320px);
    }
}

/* Email verification reminder — warm pale ocru, visible but calm. */
.prelaunch-body .email-verification-reminder.email-verification-reminder--prelaunch {
    background: var(--pl-reminder-banner-bg);
    border-bottom: 1px solid var(--pl-reminder-banner-border);
}

.prelaunch-body .email-verification-reminder.email-verification-reminder--prelaunch .email-verification-reminder__body {
    color: color-mix(in srgb, var(--sf-text-primary, #1a1a2e) 78%, #5c4a38);
}

/* Resend-verification toasts (design.css defaults to black). */
.prelaunch-body .toast,
.prelaunch-body .toast.toast-success,
.prelaunch-body .toast.toast-info,
.prelaunch-body .toast.toast-warning,
.prelaunch-body .toast.toast-danger,
.prelaunch-body .toast.toast-submit {
    background: var(--pl-navy) !important;
    color: #fff;
    box-shadow: 0 0.35rem 1rem color-mix(in srgb, var(--pl-navy) 40%, transparent) !important;
}

@media (prefers-reduced-motion: reduce) {
    .prelaunch-body *,
    .prelaunch-body *::before,
    .prelaunch-body *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }

    .pl-btn:hover,
    .pl-btn:focus-visible,
    .prelaunch__actions .btn:hover,
    .prelaunch__actions .btn:focus-visible {
        transform: none;
    }
}