/* Initial viewport: page shell, hero and highlights. */
.karaj-page {
    --karaj-container: var(--container-width);
    overflow: clip;
    color: var(--color-primary-dark);
}

@media (min-width: 1280px) {
    .karaj-page {
        --section-block-start: 56px;
        --section-block-end: 56px;
        --section-title-gap: 28px;
    }
}

.karaj-page [lang="en"],
.karaj-page [dir="ltr"] {
    direction: ltr;
    unicode-bidi: isolate;
}

.karaj-container {
    width: min(100%, calc(var(--karaj-container) + (2 * var(--page-gutter))));
    margin-inline: auto;
    padding-inline: var(--page-gutter);
}

.karaj-page h1,
.karaj-page h2,
.karaj-page h3,
.karaj-page p,
.karaj-page figure,
.karaj-page blockquote,
.karaj-page ul,
.karaj-page ol {
    margin-block-start: 0;
}

.karaj-page img {
    width: 100%;
}

.karaj-page figure {
    margin: 0;
}

.karaj-page .landing-highlights__item > span {
    display: grid;
    min-width: 0;
    text-align: start;
}

.karaj-page .landing-highlights__item strong,
.karaj-page .landing-highlights__item small {
    display: block;
}

.karaj-page .landing-highlights__icon {
    width: 56px;
    height: 56px;
}

@media (min-width: 640px) and (max-width: 1023.98px) {
    .karaj-page .landing-hero__media {
        margin-inline: auto;
    }

    .karaj-page .landing-highlights__item > span {
        text-align: center;
    }
}

@media (max-width: 639.98px) {
    .karaj-page .landing-highlights__item > span {
        text-align: center;
    }

    .karaj-page .landing-highlights__icon {
        width: 50px;
        height: 50px;
    }
}
