/* Zelto info pages — shared typography (Kaip veikia, Apie mus, Misija, Marketplace) */

:root {
    --z-font: "Open Sans", sans-serif;
    --z-text: #1a1a1a;
    --z-muted: #8c8c8c;
    --z-blue: #006aff;
    --z-green: #19c56c;

    --z-h1-size: 40px;
    --z-h1-weight: 700;
    --z-h1-lh: 1.15;
    --z-h1-ls: -0.02em;

    --z-h1-accent-size: 28px;
    --z-h1-accent-lh: 1.25;
    --z-h1-accent-weight: 700;

    --z-lead-size: 16px;
    --z-lead-lh: 1.55;
    --z-lead-weight: 400;

    --z-h2-size: 28px;
    --z-h2-weight: 600;
    --z-h2-lh: 1.2;

    --z-h2-lg-size: 32px;
    --z-h2-lg-weight: 600;
    --z-h2-lg-lh: 1.2;

    --z-section-lead-size: 16px;
    --z-section-lead-lh: 1.6;
    --z-section-lead-weight: 400;

    --z-h3-size: 18px;
    --z-h3-weight: 600;
    --z-h3-lh: 1.3;

    --z-body-size: 15px;
    --z-body-lh: 1.55;
    --z-body-weight: 400;

    --z-caption-size: 14px;
    --z-caption-lh: 1.45;
    --z-caption-weight: 400;

    --z-eyebrow-size: 11px;
    --z-eyebrow-weight: 700;
    --z-eyebrow-ls: 0.1em;

    --z-stat-value-size: 26px;
    --z-stat-value-weight: 700;
    --z-stat-value-lh: 1.2;

    --z-stat-label-size: 14px;
    --z-stat-label-lh: 1.45;
    --z-stat-label-weight: 400;
}

.how-page,
.about-page,
.mission-page,
.marketplace-page {
    font-family: var(--z-font);
    color: var(--z-text);
}

/* Hero */
.how-page .how-hero__text h1,
.about-page .about-hero__text h1,
.mission-page .mission-hero__text h1,
.marketplace-page .hero-block .hero-block__text h1 {
    font-size: var(--z-h1-size);
    line-height: var(--z-h1-lh);
    font-weight: var(--z-h1-weight);
    letter-spacing: var(--z-h1-ls);
    color: var(--z-text);
}

.how-page .how-hero__text h1 span:not(.how-hero__lead) {
    font-size: var(--z-h1-accent-size);
    line-height: var(--z-h1-accent-lh);
    font-weight: var(--z-h1-accent-weight);
    color: var(--z-blue);
}

.about-page .about-hero__text h1 span:not(.about-hero__lead) {
    font-size: var(--z-h1-accent-size);
    line-height: var(--z-h1-accent-lh);
    font-weight: var(--z-h1-accent-weight);
    color: var(--z-blue);
}

.mission-page .mission-hero__text h1 span:not(.mission-hero__lead) {
    font-size: var(--z-h1-accent-size);
    line-height: var(--z-h1-accent-lh);
    font-weight: var(--z-h1-accent-weight);
    color: var(--z-blue);
    text-wrap: balance;
}

.marketplace-page .hero-block .hero-block__text p {
    font-size: var(--z-lead-size);
    line-height: var(--z-lead-lh);
    font-weight: var(--z-lead-weight);
    color: var(--z-muted);
    letter-spacing: 0;
}

.about-page .about-hero__text p,
.how-page .how-hero__text p {
    font-size: var(--z-lead-size);
    line-height: var(--z-lead-lh);
    font-weight: var(--z-lead-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

.mission-page .mission-hero__text p {
    font-size: var(--z-lead-size);
    line-height: var(--z-lead-lh);
    font-weight: var(--z-lead-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

/* Section headings */
.how-page .how-detail__title,
.about-page .about-purpose__head h2,
.about-page .about-join__heading,
.mission-page .mission-values__heading,
.marketplace-page .title-columns .title-columns__heading {
    font-size: var(--z-h2-size);
    line-height: var(--z-h2-lh);
    font-weight: var(--z-h2-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

.how-page .how-protection__title,
.how-page .how-cta__title,
.marketplace-page .countries-block .countries-block__title,
.marketplace-page .steps--marketplace .steps__text h2,
.marketplace-page .mp-cta-cards__heading {
    font-size: var(--z-h2-lg-size);
    line-height: var(--z-h2-lg-lh);
    font-weight: var(--z-h2-lg-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

/* Section lead */
.how-page .how-protection__lead,
.about-page .about-purpose__head p,
.marketplace-page .countries-block .countries-block__text {
    font-size: var(--z-section-lead-size);
    line-height: var(--z-section-lead-lh);
    font-weight: var(--z-section-lead-weight);
    color: var(--z-muted);
    letter-spacing: 0;
}

/* Card headings (icon + title row) */
.how-page .how-detail__card h3,
.about-page .about-purpose__card h3,
.about-page .about-join__tile-head h3,
.mission-page .mission-value h3,
.mission-page .mission-mv__card h2,
.marketplace-page .title-columns .title-column__item h3 {
    font-size: var(--z-h3-size);
    line-height: var(--z-h3-lh);
    font-weight: var(--z-h3-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

/* Card body */
.how-page .how-detail__card p,
.about-page .about-purpose__card p,
.about-page .about-join__tile > p,
.mission-page .mission-value p,
.mission-page .mission-mv__card p,
.marketplace-page .title-columns .title-column__item p,
.marketplace-page .steps--marketplace .steps__text ul li p,
.marketplace-page .mp-cta-card > p {
    font-size: var(--z-body-size);
    line-height: var(--z-body-lh);
    font-weight: var(--z-body-weight);
    color: var(--z-muted);
    letter-spacing: 0;
}

/* Eyebrow labels */
.mission-page .mission-mv__card-label {
    font-size: var(--z-eyebrow-size);
    font-weight: var(--z-eyebrow-weight);
    letter-spacing: var(--z-eyebrow-ls);
    text-transform: uppercase;
}

/* Stats */
.mission-page .mission-stat__value {
    font-size: var(--z-stat-value-size);
    font-weight: var(--z-stat-value-weight);
    line-height: var(--z-stat-value-lh);
    letter-spacing: 0;
}

.mission-page .mission-stat__label {
    font-size: var(--z-stat-label-size);
    line-height: var(--z-stat-label-lh);
    font-weight: var(--z-stat-label-weight);
    color: var(--z-muted);
    letter-spacing: 0;
}

/* Metrics captions */
.about-page .about-metrics__text span {
    font-size: var(--z-caption-size);
    line-height: var(--z-caption-lh);
    font-weight: var(--z-caption-weight);
    color: var(--z-muted);
    letter-spacing: 0;
}

/* Protection & feature cards */
.how-page .how-protection__head-text h3,
.marketplace-page .mp-cta-card__head h3 {
    font-size: var(--z-h3-size);
    line-height: var(--z-h3-lh);
    font-weight: var(--z-h3-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

.how-page .how-protection__head-text p {
    font-size: var(--z-caption-size);
    line-height: var(--z-caption-lh);
    font-weight: var(--z-caption-weight);
    color: var(--z-muted);
    letter-spacing: 0;
}

.how-page .how-cta__box h2 {
    font-size: var(--z-h2-lg-size);
    line-height: var(--z-h2-lg-lh);
    font-weight: var(--z-h2-lg-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

.how-page .how-cta__box p {
    font-size: var(--z-section-lead-size);
    line-height: var(--z-section-lead-lh);
    font-weight: var(--z-section-lead-weight);
    color: var(--z-muted);
    letter-spacing: 0;
}

.mission-page .main-content {
    letter-spacing: 0;
}

.mission-page .mission-quote__box p {
    font-size: var(--z-h2-size);
    line-height: var(--z-h3-lh);
    font-weight: var(--z-h2-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

.mission-page .mission-quote__author {
    font-size: var(--z-lead-size);
    font-weight: var(--z-h3-weight);
    color: var(--z-text);
    letter-spacing: 0;
}

.marketplace-page .steps--marketplace .steps__text ul li h3 {
    font-size: var(--z-h3-size);
    font-weight: var(--z-h3-weight);
    line-height: var(--z-h3-lh);
    color: var(--z-text);
    letter-spacing: 0;
}

/* ── Responsive typography ───────────────────────── */
@media (max-width: 992px) {
    .how-page .how-hero__text h1,
    .about-page .about-hero__text h1,
    .mission-page .mission-hero__text h1,
    .marketplace-page .hero-block .hero-block__text h1 {
        font-size: 34px;
        line-height: 1.32;
    }

    .how-page .how-hero__text h1 span:not(.how-hero__lead),
    .about-page .about-hero__text h1 span:not(.about-hero__lead),
    .mission-page .mission-hero__text h1 span:not(.mission-hero__lead) {
        font-size: 22px;
    }

    .how-page .how-detail__title,
    .about-page .about-purpose__head h2,
    .about-page .about-join__heading,
    .mission-page .mission-values__heading,
    .marketplace-page .title-columns .title-columns__heading,
    .how-page .how-protection__title,
    .how-page .how-cta__title,
    .marketplace-page .countries-block .countries-block__title,
    .marketplace-page .steps--marketplace .steps__text h2,
    .marketplace-page .mp-cta-cards__heading {
        font-size: 24px;
        line-height: 1.35;
    }

    .mission-page .mission-stat__value {
        font-size: 22px;
    }

    .mission-page .mission-stat__label {
        font-size: 13px;
        line-height: 1.45;
    }

    .mission-page .mission-mv__card h2,
    .mission-page .mission-value h3,
    .marketplace-page .title-columns .title-column__item h3 {
        font-size: 17px;
    }
}

@media (max-width: 576px) {
    .how-page .how-hero__text h1,
    .about-page .about-hero__text h1,
    .mission-page .mission-hero__text h1,
    .marketplace-page .hero-block .hero-block__text h1 {
        font-size: 28px;
    }

    .how-page .how-hero__text h1 span:not(.how-hero__lead),
    .about-page .about-hero__text h1 span:not(.about-hero__lead),
    .mission-page .mission-hero__text h1 span:not(.mission-hero__lead) {
        font-size: 19px;
    }

    .how-page .how-hero__text p,
    .about-page .about-hero__text p,
    .mission-page .mission-hero__text p,
    .marketplace-page .hero-block .hero-block__text p {
        font-size: 15px;
        line-height: 1.55;
    }

    .how-page .how-detail__title,
    .how-page .how-protection__title,
    .how-page .how-cta__box h2,
    .about-page .about-join__heading,
    .mission-page .mission-values__heading {
        font-size: 22px;
    }

    .how-page .how-detail__card h3,
    .about-page .about-purpose__card h3,
    .mission-page .mission-value h3,
    .mission-page .mission-mv__card h2 {
        font-size: 17px;
    }

    .how-page .how-detail__card p,
    .about-page .about-purpose__card p,
    .mission-page .mission-value p,
    .mission-page .mission-mv__card p,
    .marketplace-page .title-columns .title-column__item p {
        font-size: 14px;
        line-height: 1.55;
    }
}

/* ── Info puslapių CTA — kompaktiški, poroje vienodo pločio ── */
.marketplace-page .mp-cta-card__btn,
.about-page .about-join__link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 220px !important;
    padding: 13px 24px !important;
    text-align: center;
    gap: 0 !important;
    box-sizing: border-box !important;
}

.how-page .how-cta__btn {
    justify-content: center !important;
    text-align: center;
    gap: 0 !important;
    box-sizing: border-box;
}

.marketplace-page .hero-block .hero-block__buttons .button {
    justify-content: center !important;
    text-align: center;
    gap: 8px !important;
    box-sizing: border-box;
    font-size: 16px;
}