.tls-step {
    content-visibility: auto;
    contain-intrinsic-size: 500px;
    padding: 5rem 3rem;
    font-family: 'Lato', sans-serif;
}

/* ── Background variants ── */
.tls-step.bg-dark  { background: #1a1a1a !important; }
.tls-step.bg-white { background: #ffffff !important; }
.tls-step.bg-light { background: #f5f5f5 !important; }

/* ── Label ── */
.tls-step__label {
    font-family: 'League Spartan', sans-serif;
    font-size: 0.7rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    display: block;
    margin-bottom: 1rem;
    font-weight: 400;
}
.tls-step.bg-dark  .tls-step__label { color: rgba(255, 255, 255, 0.28); }
.tls-step.bg-white .tls-step__label,
.tls-step.bg-light .tls-step__label { color: rgba(0, 0, 0, 0.45); }

/* ── Title ── */
.tls-step__title {
    font-family: 'League Spartan', sans-serif;
    font-size: clamp(1.9rem, 3.2vw, 2.75rem);
    font-weight: 300;
    line-height: 1.15;
    letter-spacing: -0.01em;
    margin: 0 0 4rem 0;
    padding: 0;
    max-width: none !important;
}
.tls-step__title em {
    font-family: 'Lato', sans-serif;
    font-style: italic;
    font-weight: 300;
    font-size: 0.93em;
    letter-spacing: 0;
}
.tls-step.bg-dark  .tls-step__title { color: #ffffff; }
.tls-step.bg-white .tls-step__title,
.tls-step.bg-light .tls-step__title { color: #1a1a1a; }

/* ── Steps wrapper ── */
.tls-step__steps {
    display: flex;
    align-items: flex-start;
}

/* ── Horizontal connector ── */
.tls-step__connector {
    flex: 1;
    height: 1px;
    align-self: flex-start;
    margin-top: 28px;
}
.tls-step.bg-dark  .tls-step__connector { background: rgba(255, 255, 255, 0.12); }
.tls-step.bg-white .tls-step__connector,
.tls-step.bg-light .tls-step__connector { background: rgba(0, 0, 0, 0.12); }

/* ── Single step ── */
.tls-step__step {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    flex: 0 0 22%;
    max-width: 22%;
    padding: 0 0.5rem;
}

/* ── Number circle ── */
.tls-step__num {
    width: 56px;
    height: 56px;
    min-width: 56px;
    border-radius: 50%;
    border: none !important;
    background: #119199;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'League Spartan', sans-serif;
    font-size: 1.35rem;
    font-weight: 300;
    color: #ffffff;
    margin-bottom: 1.25rem;
    flex-shrink: 0;
    box-shadow: none !important;
}

/* ── Step name ── */
.tls-step__name {
    font-family: 'League Spartan', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin: 0 0 0.6rem 0;
    padding: 0;
    display: block;
}
.tls-step.bg-dark  .tls-step__name { color: #ffffff; }
.tls-step.bg-white .tls-step__name,
.tls-step.bg-light .tls-step__name { color: #1a1a1a; }

/* ── Step description ── */
.tls-step__desc {
    font-family: 'Lato', sans-serif;
    font-size: 0.9375rem;
    line-height: 1.75;
    font-weight: 300;
    margin: 0;
    padding: 0;
}
.tls-step.bg-dark  .tls-step__desc { color: rgba(255, 255, 255, 0.42); }
.tls-step.bg-white .tls-step__desc,
.tls-step.bg-light .tls-step__desc { color: rgba(0, 0, 0, 0.55); }

/* ── CTA ── */
.tls-step__cta-wrap {
    text-align: center;
    margin-top: 3rem;
}
.tls-step__cta {
    display: inline-block;
    font-family: 'League Spartan', sans-serif;
    font-size: 0.75rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 600;
    padding: 14px 32px;
    text-decoration: none;
    transition: opacity 0.2s;
    background: #119199;
    border: 1px solid #119199;
    color: #ffffff;
    border-radius: 4px;
}
.tls-step__cta:hover {
    opacity: 0.85;
    color: #ffffff;
    text-decoration: none;
}

/* ── Mobile ── */
@media (max-width: 767px) {
    .tls-step {
        padding: 3.5rem 1.25rem;
    }
    .tls-step__title {
        margin-bottom: 2.5rem;
    }
    .tls-step__steps {
        flex-direction: column;
    }
    .tls-step__connector {
        display: none;
    }
    .tls-step__step {
        flex: none;
        max-width: 100%;
        width: 100%;
        flex-direction: row;
        text-align: left;
        padding: 0 0 2rem 0;
        gap: 1.25rem;
        align-items: flex-start;
    }
    .tls-step__step:last-child {
        padding-bottom: 0;
    }
    .tls-step__num {
        margin-bottom: 0;
        flex-shrink: 0;
    }
    .tls-step__step-text {
        padding-top: 0.75rem;
    }
}
