/**
 * Dependency-free editorial presentation for the FCMS Steps widget.
 */
.fcmsSteps {
    --fcms-steps-accent: var(--palette-primary, #176b57);
    --fcms-steps-accent-strong: var(--palette-primary-dark, #0f5444);
    --fcms-steps-accent-soft: rgba(23, 107, 87, .12);
    --fcms-steps-accent-soft: color-mix(in srgb, var(--fcms-steps-accent) 12%, transparent);
    --fcms-steps-background: var(--palette-background, #ffffff);
    --fcms-steps-surface: var(--palette-surface, #ffffff);
    --fcms-steps-ink: var(--palette-text, #17211d);
    --fcms-steps-muted: var(--palette-muted, #637269);
    --fcms-steps-line: rgba(23, 107, 87, .27);
    --fcms-steps-line: color-mix(in srgb, var(--fcms-steps-accent) 27%, transparent);
    --fcms-steps-border: rgba(23, 33, 29, .14);
    --fcms-steps-border: color-mix(in srgb, var(--fcms-steps-ink) 14%, transparent);
    --fcms-steps-space: clamp(1.15rem, 2.4vw, 2rem);
    position: relative;
    isolation: isolate;
    container-type: inline-size;
    margin-block: clamp(2rem, 5vw, 4rem);
    color: var(--fcms-steps-ink);
    font: inherit;
}

.fcmsSteps,
.fcmsSteps *,
.fcmsSteps *::before,
.fcmsSteps *::after {
    box-sizing: border-box;
}

.fcmsSteps[data-fcms-steps-theme="ink"] {
    --fcms-steps-accent: #a6492d;
    --fcms-steps-accent-strong: #74311f;
    --fcms-steps-background: #f5f0e6;
    --fcms-steps-surface: #fffdf8;
    --fcms-steps-ink: #17211d;
    --fcms-steps-muted: #68716b;
}

.fcmsSteps[data-fcms-steps-theme="paper"] {
    --fcms-steps-accent: #a6492d;
    --fcms-steps-accent-strong: #79331f;
    --fcms-steps-background: #fffaf0;
    --fcms-steps-surface: #ffffff;
    --fcms-steps-ink: #2c2924;
    --fcms-steps-muted: #71695e;
}

.fcmsSteps[data-fcms-steps-theme="ocean"] {
    --fcms-steps-accent: #0c6371;
    --fcms-steps-accent-strong: #074752;
    --fcms-steps-background: #e8f5f4;
    --fcms-steps-surface: #f9ffff;
    --fcms-steps-ink: #12343a;
    --fcms-steps-muted: #557379;
}

.fcmsSteps[data-fcms-steps-theme="forest"] {
    --fcms-steps-accent: #315c3b;
    --fcms-steps-accent-strong: #21452b;
    --fcms-steps-background: #edf3e7;
    --fcms-steps-surface: #fbfdf8;
    --fcms-steps-ink: #223228;
    --fcms-steps-muted: #617065;
}

.fcmsSteps[data-fcms-steps-theme="sunset"] {
    --fcms-steps-accent: #bd4b32;
    --fcms-steps-accent-strong: #8b3423;
    --fcms-steps-background: #fff0e3;
    --fcms-steps-surface: #fffaf5;
    --fcms-steps-ink: #3b2924;
    --fcms-steps-muted: #80685f;
}

.fcmsSteps[data-fcms-steps-theme="night"] {
    --fcms-steps-accent: #f2b862;
    --fcms-steps-accent-strong: #ffd28d;
    --fcms-steps-background: #172229;
    --fcms-steps-surface: #202f37;
    --fcms-steps-ink: #f7f2e8;
    --fcms-steps-muted: #b6c4c8;
    --fcms-steps-border: rgba(255, 255, 255, .14);
    --fcms-steps-line: rgba(242, 184, 98, .42);
}

.fcmsStepsHeader {
    max-width: 68ch;
    margin-bottom: clamp(1.4rem, 3vw, 2.4rem);
}

.fcmsSteps .visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    border: 0 !important;
    margin: -1px !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
}

.fcmsStepsEyebrow {
    margin: 0 0 .45rem;
    color: var(--fcms-steps-accent-strong);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .14em;
    line-height: 1.25;
    text-transform: uppercase;
}

.fcmsStepsTitle {
    margin: 0;
    color: var(--fcms-steps-ink);
    font-size: clamp(1.55rem, 3vw, 2.55rem);
    font-weight: 700;
    letter-spacing: -.035em;
    line-height: 1.08;
}

p.fcmsStepsTitle {
    font-size: 1em;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
}

.fcmsStepsIntro {
    max-width: 62ch;
    margin: .75rem 0 0;
    color: var(--fcms-steps-muted);
    font-size: clamp(.96rem, 1.5vw, 1.08rem);
    line-height: 1.65;
}

.fcmsStepsList {
    display: grid;
    gap: var(--fcms-steps-space);
    margin: 0;
    padding: 0;
    list-style: none;
}

.fcmsStepsItem {
    position: relative;
    min-width: 0;
}

.fcmsStepsItem > article {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    min-width: 0;
}

.fcmsStepsMarker {
    position: relative;
    z-index: 2;
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid var(--fcms-steps-accent);
    border-radius: 50%;
    background: var(--fcms-steps-accent);
    color: #ffffff;
    box-shadow: 0 0 0 .35rem var(--fcms-steps-background);
    font-family: inherit;
    font-size: .88rem;
    font-weight: 800;
    line-height: 1;
}

.fcmsSteps[data-fcms-steps-theme="night"] .fcmsStepsMarker {
    color: #172229;
}

.fcmsStepsContent {
    min-width: 0;
    padding-top: .12rem;
}

.fcmsStepsItemMeta {
    display: flex;
    flex-wrap: wrap;
    gap: .38rem;
    align-items: center;
    min-height: .2rem;
    margin-bottom: .28rem;
}

.fcmsStepsItemLabel,
.fcmsStepsStatus {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    border-radius: 999px;
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .055em;
    line-height: 1.25;
    text-transform: uppercase;
}

.fcmsStepsItemLabel {
    color: var(--fcms-steps-accent-strong);
}

.fcmsStepsStatus {
    padding: .2rem .48rem;
    background: var(--fcms-steps-accent-soft);
    color: var(--fcms-steps-accent-strong);
}

.fcmsStepsItem--important .fcmsStepsStatus {
    background: #fbe4df;
    color: #9d311f;
}

.fcmsStepsItem--optional {
    opacity: .72;
}

.fcmsStepsItem--complete .fcmsStepsMarker {
    border-color: #2c744c;
    background: #2c744c;
}

.fcmsStepsItem--current .fcmsStepsMarker {
    box-shadow: 0 0 0 .35rem var(--fcms-steps-background), 0 0 0 .58rem var(--fcms-steps-accent-soft);
}

.fcmsStepsItemTitle {
    margin: 0;
    color: var(--fcms-steps-ink);
    font-size: clamp(1.08rem, 1.7vw, 1.34rem);
    font-weight: 700;
    letter-spacing: -.018em;
    line-height: 1.24;
}

.fcmsStepsDescription {
    max-width: 65ch;
    margin-top: .48rem;
    color: var(--fcms-steps-muted);
    font-size: .94rem;
    line-height: 1.63;
}

.fcmsStepsDescription > :first-child {
    margin-top: 0;
}

.fcmsStepsDescription > :last-child {
    margin-bottom: 0;
}

.fcmsStepsLink {
    display: inline-flex;
    gap: .25rem;
    align-items: center;
    margin-top: .7rem;
    color: var(--fcms-steps-accent-strong);
    font-size: .83rem;
    font-weight: 800;
    text-decoration-thickness: .08em;
    text-underline-offset: .2em;
}

.fcmsStepsLink:hover,
.fcmsStepsLink:focus-visible {
    color: var(--fcms-steps-accent);
}

.fcmsStepsSource {
    width: fit-content;
    margin-top: clamp(1.3rem, 3vw, 2rem);
    padding-top: .7rem;
    border-top: 1px solid var(--fcms-steps-border);
    color: var(--fcms-steps-muted);
    font-size: .75rem;
    line-height: 1.4;
}

.fcmsSteps--compact {
    --fcms-steps-space: .82rem;
}

.fcmsSteps--airy {
    --fcms-steps-space: clamp(1.8rem, 4vw, 3.2rem);
}

/* Timeline */
.fcmsSteps--timeline .fcmsStepsItem:not(:last-child)::before {
    position: absolute;
    z-index: 0;
    top: 2.4rem;
    bottom: calc(-1 * var(--fcms-steps-space) - .3rem);
    left: 1.3rem;
    width: 2px;
    background: linear-gradient(var(--fcms-steps-line), var(--fcms-steps-accent));
    content: "";
}

.fcmsSteps--timeline .fcmsStepsContent {
    padding-bottom: .35rem;
}

/* Cards */
.fcmsSteps--cards {
    padding: clamp(1.2rem, 3vw, 2.4rem);
    border-radius: clamp(.8rem, 1.8vw, 1.35rem);
    background: var(--fcms-steps-background);
}

.fcmsSteps--cards .fcmsStepsList {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
}

.fcmsSteps--vertical.fcmsSteps--cards .fcmsStepsList {
    grid-template-columns: 1fr;
}

.fcmsSteps--cards .fcmsStepsItem > article {
    height: 100%;
    grid-template-columns: 1fr;
    align-content: start;
    padding: clamp(1rem, 2.4vw, 1.45rem);
    border: 1px solid var(--fcms-steps-border);
    border-radius: .85rem;
    background: var(--fcms-steps-surface);
    box-shadow: 0 .6rem 1.8rem color-mix(in srgb, var(--fcms-steps-ink) 7%, transparent);
}

.fcmsSteps--cards .fcmsStepsMarker {
    box-shadow: none;
}

.fcmsSteps--cards .fcmsStepsDescription {
    font-size: .9rem;
}

/* Numbered guide */
.fcmsSteps--numbered .fcmsStepsList {
    counter-reset: editorialStep;
}

.fcmsSteps--numbered .fcmsStepsItem {
    counter-increment: editorialStep;
    padding-block: .35rem;
    border-bottom: 1px solid var(--fcms-steps-border);
}

.fcmsSteps--numbered .fcmsStepsItem:last-child {
    border-bottom: 0;
}

.fcmsSteps--numbered .fcmsStepsMarker {
    width: 3.35rem;
    height: auto;
    min-height: 3.35rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--fcms-steps-accent);
    font-size: 1.65rem;
}

/* Checklist */
.fcmsSteps--checklist {
    padding: clamp(1.2rem, 3vw, 2.35rem);
    border: 1px solid var(--fcms-steps-border);
    border-radius: 1rem;
    background: var(--fcms-steps-background);
}

.fcmsSteps--checklist .fcmsStepsList {
    gap: .25rem;
}

.fcmsSteps--checklist .fcmsStepsItem {
    padding: .95rem 0;
    border-bottom: 1px solid var(--fcms-steps-border);
}

.fcmsSteps--checklist .fcmsStepsItem:last-child {
    border-bottom: 0;
}

.fcmsSteps--checklist .fcmsStepsMarker,
.fcmsSteps--marker-check .fcmsStepsMarker {
    width: 2.1rem;
    height: 2.1rem;
    border-radius: .5rem;
    box-shadow: none;
    font-size: 0;
}

.fcmsSteps--checklist .fcmsStepsMarker::before,
.fcmsSteps--marker-check .fcmsStepsMarker::before {
    font-family: inherit;
    font-size: .95rem;
    font-weight: 900;
    content: "✓";
}

/* Editorial chapters */
.fcmsSteps--editorial {
    overflow: hidden;
    padding: clamp(1.3rem, 4vw, 3rem);
    border-radius: 1rem;
    background: var(--fcms-steps-background);
}

.fcmsSteps--editorial::before {
    position: absolute;
    z-index: -1;
    top: -7rem;
    right: -5rem;
    width: 17rem;
    height: 17rem;
    border: 1px solid var(--fcms-steps-line);
    border-radius: 50%;
    box-shadow: 0 0 0 2.5rem color-mix(in srgb, var(--fcms-steps-accent) 4%, transparent), 0 0 0 5rem color-mix(in srgb, var(--fcms-steps-accent) 3%, transparent);
    content: "";
}

.fcmsSteps--editorial .fcmsStepsItem > article {
    grid-template-columns: minmax(4rem, .28fr) minmax(0, 1fr);
    gap: clamp(1rem, 4vw, 3rem);
    align-items: start;
    padding-block: clamp(1rem, 2.8vw, 2rem);
    border-top: 1px solid var(--fcms-steps-border);
}

.fcmsSteps--editorial .fcmsStepsMarker {
    justify-self: end;
    width: auto;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--fcms-steps-accent);
    font-size: clamp(1.8rem, 5vw, 3.5rem);
    line-height: .9;
}

/* Arrow process */
.fcmsSteps--arrows {
    padding: clamp(.85rem, 2.6vw, 1.7rem);
    border-radius: 1rem;
    background:
        linear-gradient(135deg, var(--fcms-steps-accent-soft), transparent 42%),
        var(--fcms-steps-background);
}

.fcmsSteps--arrows .fcmsStepsList {
    gap: .55rem;
}

.fcmsSteps--arrows .fcmsStepsItem > article {
    isolation: isolate;
    height: 100%;
    min-height: 8.5rem;
    padding: 1rem 1.1rem 2rem;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: var(--fcms-steps-border);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 1rem), 50% 100%, 0 calc(100% - 1rem));
}

.fcmsSteps--arrows .fcmsStepsItem > article::before {
    position: absolute;
    z-index: 0;
    inset: 1px;
    background: var(--fcms-steps-surface);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 1rem), 50% 100%, 0 calc(100% - 1rem));
    content: "";
}

.fcmsSteps--arrows .fcmsStepsItem--current > article::before,
.fcmsSteps--arrows .fcmsStepsItem--important > article::before {
    background:
        linear-gradient(135deg, var(--fcms-steps-accent-soft), transparent 72%),
        var(--fcms-steps-surface);
}

.fcmsSteps--arrows .fcmsStepsMarker {
    width: 2.15rem;
    height: 2.15rem;
    box-shadow: none;
    font-size: .76rem;
}

.fcmsSteps--arrows .fcmsStepsContent {
    position: relative;
    z-index: 1;
    padding-top: 0;
}

.fcmsSteps--arrows .fcmsStepsItemTitle {
    font-size: clamp(1rem, 1.45vw, 1.18rem);
    line-height: 1.22;
}

.fcmsSteps--arrows .fcmsStepsDescription {
    margin-top: .38rem;
    font-size: .86rem;
    line-height: 1.5;
}

.fcmsSteps--arrows .fcmsStepsItemMeta {
    margin-bottom: .22rem;
}

.fcmsSteps--arrows .fcmsStepsLink {
    margin-top: .5rem;
}

.fcmsSteps--marker-dot .fcmsStepsMarker {
    width: 1.15rem;
    height: 1.15rem;
    margin: .72rem;
    box-shadow: 0 0 0 .35rem var(--fcms-steps-background);
    font-size: 0;
}

.fcmsSteps--marker-none .fcmsStepsMarker {
    display: none;
}

.fcmsSteps--marker-none .fcmsStepsItem > article {
    grid-template-columns: minmax(0, 1fr);
}

.fcmsSteps--marker-none.fcmsSteps--timeline .fcmsStepsItem::before {
    display: none;
}

@media (min-width: 768px) {
    .fcmsSteps--horizontal.fcmsSteps--timeline .fcmsStepsList,
    .fcmsSteps--auto.fcmsSteps--timeline .fcmsStepsList {
        grid-auto-columns: minmax(11.5rem, 1fr);
        grid-auto-flow: column;
        overflow-x: auto;
        padding: .6rem .2rem 1rem;
        scrollbar-width: thin;
    }

    .fcmsSteps--horizontal.fcmsSteps--timeline .fcmsStepsItem:not(:last-child)::before,
    .fcmsSteps--auto.fcmsSteps--timeline .fcmsStepsItem:not(:last-child)::before {
        top: 1.3rem;
        right: calc(-1 * var(--fcms-steps-space));
        bottom: auto;
        left: 1.8rem;
        width: auto;
        height: 2px;
        background: linear-gradient(90deg, var(--fcms-steps-accent), var(--fcms-steps-line));
    }

    .fcmsSteps--horizontal.fcmsSteps--timeline .fcmsStepsItem > article,
    .fcmsSteps--auto.fcmsSteps--timeline .fcmsStepsItem > article {
        grid-template-columns: 1fr;
    }

    .fcmsSteps--horizontal.fcmsSteps--timeline .fcmsStepsContent,
    .fcmsSteps--auto.fcmsSteps--timeline .fcmsStepsContent {
        padding-right: .7rem;
    }

}

@container (min-width: 680px) {
    .fcmsSteps--horizontal.fcmsSteps--arrows .fcmsStepsList,
    .fcmsSteps--auto.fcmsSteps--arrows .fcmsStepsList {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 12.5rem), 1fr));
        gap: .45rem;
        overflow: visible;
    }

    .fcmsSteps--horizontal.fcmsSteps--arrows .fcmsStepsItem > article,
    .fcmsSteps--auto.fcmsSteps--arrows .fcmsStepsItem > article {
        display: block;
        min-height: 12.5rem;
        padding: 1rem 1.8rem 1.15rem 1.15rem;
        clip-path: polygon(0 0, calc(100% - 1rem) 0, 100% 50%, calc(100% - 1rem) 100%, 0 100%, 1rem 50%);
    }

    .fcmsSteps--horizontal.fcmsSteps--arrows .fcmsStepsItem:first-child > article,
    .fcmsSteps--auto.fcmsSteps--arrows .fcmsStepsItem:first-child > article {
        clip-path: polygon(0 0, calc(100% - 1rem) 0, 100% 50%, calc(100% - 1rem) 100%, 0 100%);
    }

    .fcmsSteps--horizontal.fcmsSteps--arrows .fcmsStepsItem > article::before,
    .fcmsSteps--auto.fcmsSteps--arrows .fcmsStepsItem > article::before {
        clip-path: polygon(0 0, calc(100% - 1rem) 0, 100% 50%, calc(100% - 1rem) 100%, 0 100%, 1rem 50%);
    }

    .fcmsSteps--horizontal.fcmsSteps--arrows .fcmsStepsItem:first-child > article::before,
    .fcmsSteps--auto.fcmsSteps--arrows .fcmsStepsItem:first-child > article::before {
        clip-path: polygon(0 0, calc(100% - 1rem) 0, 100% 50%, calc(100% - 1rem) 100%, 0 100%);
    }

    .fcmsSteps--horizontal.fcmsSteps--arrows .fcmsStepsMarker,
    .fcmsSteps--auto.fcmsSteps--arrows .fcmsStepsMarker {
        margin-bottom: .75rem;
    }

    .fcmsSteps--horizontal.fcmsSteps--arrows .fcmsStepsContent,
    .fcmsSteps--auto.fcmsSteps--arrows .fcmsStepsContent {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .fcmsSteps {
        --fcms-steps-space: 1.15rem;
    }

    .fcmsSteps--cards,
    .fcmsSteps--arrows,
    .fcmsSteps--checklist,
    .fcmsSteps--editorial {
        padding: 1rem;
    }

    .fcmsSteps--cards .fcmsStepsList {
        grid-template-columns: 1fr;
    }

    .fcmsSteps--editorial .fcmsStepsItem > article {
        grid-template-columns: 3rem minmax(0, 1fr);
        gap: .75rem;
    }

    .fcmsSteps--editorial .fcmsStepsMarker {
        font-size: 1.65rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .fcmsSteps *,
    .fcmsSteps *::before,
    .fcmsSteps *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

@media print {
    .fcmsSteps {
        --fcms-steps-background: #ffffff;
        --fcms-steps-surface: #ffffff;
        --fcms-steps-ink: #000000;
        --fcms-steps-muted: #333333;
        break-inside: avoid;
        color: #000000;
    }

    .fcmsStepsItem {
        break-inside: avoid;
    }

    .fcmsSteps--cards .fcmsStepsItem > article,
    .fcmsSteps--arrows .fcmsStepsItem > article {
        box-shadow: none;
    }
}