.content {
    /* font */

    --prog-font-size-2xl: 1.57143rem; /* = font-size-in-rem($font_size_2xl) */
    --prog-font-size-xl: 1.28571rem; /* = font-size-in-rem($font_size_xl) */
    --prog-font-size-lg: 1.14286rem; /* = font-size-in-rem($font_size_lg) */
    --prog-font-size-sm: 0.85714rem; /* = font-size-in-rem($font_size_sm) */

    /* grid */

    --prog-grid-space-xl: 48px; /* = $grid_space_xl */
    --prog-grid-space-lg: 36px; /* = $grid_space_lg */
    --prog-grid-space-md: 24px; /* = $grid_space_md */
    --prog-grid-space-sm: 18px; /* = $grid_space_sm */
    --prog-grid-space-xs: 12px; /* = $grid_space_xs */
    --prog-grid-space-2xs: 6px; /* = $grid_space_2xs */
    --prog-grid-space-ex-xs: 8px; /* = $grid_space_ex_xs */

    --prog-base-xl: 360px; /* = $grid_base_xl */
    --prog-base-lg: 300px; /* = $grid_base_lg */
    --prog-base-md: 240px; /* = $grid_base_md */
    --prog-base-sm: 180px; /* = $grid_base_sm */

    /* border */

    --prog-border-radius-inf: 9999px;

    /* outline */

    --prog-outline-width: 4px; /* = $outline_width */

    /* block */

    --prog-block-margin: var(--gr-block-margin);

    /* color */

    --prog-color-asu-red: #ff1552;
    --prog-color-asu-red-rgb: 255, 21, 82;
    --prog-color-asu-green: #97bd00;
    --prog-color-asu-green-rgb: 151, 189, 0;
    --prog-color-asu-blue: #008ad5;
    --prog-color-asu-blue-rgb: 0, 138, 213;
    --prog-color-asu-orange: #ff8e00;
    --prog-color-asu-orange-rgb: 255, 142, 0;

    --prog-color-asu-accent: var(--asu-accent, #2e94d2);
}

/* {{{ spans */

.span_red {
    color: var(--prog-color-asu-red);
}

.span_green {
    color: var(--prog-color-asu-green);
}

.span_blue {
    color: var(--prog-color-asu-blue);
}

.span_orange {
    color: var(--prog-color-asu-orange);
}

/* }}} */

/* {{{ .states-section */

.states-section, /* TODO: удалить */
.states-section .states-container { /* TODO: удалить */
    display: block;
}

.states-section {
    margin: var(--prog-block-margin) 0;
}

.states-section:first-child {
    margin-top: 0;
}

.states-section:last-child {
    margin-bottom: 0;
}

.states-section .states-container .states-wrapper {
    display: grid; /* grid box */
    grid-template-columns: repeat(auto-fill, minmax(var(--prog-base-lg), 1fr)); /* grid box */
    grid-gap: var(--gr-grid-h-gap); /* grid box */
}

.states-section .states-container .states-wrapper .states-item {
    --item-color: var(--gr-color-gray-base);
    --bg-color--hover: rgba(var(--gr-color-gray-base-rgb), .1);
    --text-color: var(--item-color);
    --icon-color: var(--item-color);
    border: 1px solid var(--item-color);
    border-radius: var(--gr-card-border-radius);
    background: transparent;
    transition: background-color .25s;
}

.states-section .states-container .states-wrapper .states-item:hover {
    /* --text-color: var(--gr-color-white); */
    /* --icon-color: transparent; */
    background-color: var(--bg-color--hover);
}

/*
.states-section .states-container .states-wrapper .states-item:hover .states-item_icon {
    margin: calc(-1 * var(--gr-card-padding) / 2) calc(-1 * var(--gr-card-padding) / 2) 0 0;
}
*/

.states-section .states-container .states-wrapper .states-item h5.states-item_text { /* TODO: удалить, в том числе в шаблоне */
    display: block;
    width: 100%;
    height: 100%;
    font-weight: normal;
}

.states-section .states-container .states-wrapper .states-item .states-item_wrapper {
    display: flex; /* flex box */
    flex-flow: row nowrap; /* flex box */
    gap: var(--gr-card-h-gap); /* flex box */
    outline-offset: 1px;
    border-radius: var(--gr-card-border-radius);
    padding: var(--gr-card-padding);
    width: 100%;
    height: 100%;
    font-size: 1rem;
}

.states-section .states-container .states-wrapper .states-item .states-item_wrapper span {
    flex: 1; /* flex cell */
}

.states-section .states-container .states-wrapper .states-item .states-item_wrapper .states-item_icon {
    flex: none; /* flex cell */
}

.states-section .states-container .states-wrapper .states-item .span_red,
.states-section .states-container .states-wrapper .states-item .span_green,
.states-section .states-container .states-wrapper .states-item .span_blue,
.states-section .states-container .states-wrapper .states-item .span_orange {
    color: var(--text-color);
}

.states-section .states-container .states-wrapper .states-item .states-item_icon {
    --icon-size: 64px;
    /*
    position: relative;
    margin: 0;
    */
    border-radius: var(--gr-border-radius-l3);
    padding: 12px;
    width: var(--icon-size);
    height: var(--icon-size) !important;
    background: var(--icon-color);
    /* transition: margin .25s, background-color .25s; */
}

.states-section .states-container .states-wrapper .states-item.states-item_red {
    --item-color: var(--prog-color-asu-red);
    --bg-color--hover: rgba(var(--prog-color-asu-red-rgb), .1);
}

.states-section .states-container .states-wrapper .states-item.states-item_green {
    --item-color: var(--prog-color-asu-green);
    --bg-color--hover: rgba(var(--prog-color-asu-green-rgb), .1);
}

.states-section .states-container .states-wrapper .states-item.states-item_blue {
    --item-color: var(--prog-color-asu-blue);
    --bg-color--hover: rgba(var(--prog-color-asu-blue-rgb), .1);
}

.states-section .states-container .states-wrapper .states-item.states-item_orange {
    --item-color: var(--prog-color-asu-orange);
    --bg-color--hover: rgba(var(--prog-color-asu-orange-rgb), .1);
}

/* }}} */

/* {{{ .programs--banner */

.programs--banner {
    display: flex; /* flex box */
    flex-flow: row nowrap; /* flex box */
    gap: calc(2 * var(--gr-grid-h-gap)); /* flex box */
    margin-bottom: var(--prog-block-margin);
}

.programs--banner .programs--banner__heading {
    flex: 2; /* flex cell */
    display: grid; /* grid box */
    grid-template-columns: auto 1fr; /* grid box */
    grid-gap: var(--gr-grid-h-gap); /* grid box */
    padding-top: var(--gr-card-padding);
    line-height: 1.2; /* WARN: см. .page_title */
    /* font-weight: 600; */
    font-weight: 800; /* WARN: см. .page_title */
    /* font-size: var(--prog-font-size-2xl); */
    font-size: 2rem; /* WARN: см. .page_title */
    color: var(--prog-color-asu-accent);
}

.programs--banner .programs--banner__heading .programs--banner__emblem {
    grid-column: 1 / 2; /* grid cell */
    margin-top: calc(-1 * var(--gr-card-padding));
    border: 1px solid var(--prog-color-asu-accent);
    border-radius: var(--gr-card-border-radius);
    padding: var(--gr-card-padding);
    width: 128px;
}

.programs--banner .programs--banner__heading p.program--description {
    grid-column: 1 / -1; /* grid cell */
    margin: 0;
    font-weight: normal;
    font-size: 1rem;
    color: var(--gr-color-gray-xdark);
}

.programs--banner .programs--banner__heading .programs--image__content {
    grid-column: 1 / -1; /* grid cell */
    justify-self: start; /* grid cell */
    display: flex; /* flex box */
    flex-flow: row nowrap; /* flex box */
    gap: var(--gr-block-padding); /* flex box */
    /* border: 1px solid var(--prog-color-asu-accent); */
    /* border-radius: var(--gr-card-border-radius); */
    border-radius: var(--gr-block-border-radius);
    padding: var(--gr-block-padding);
    background: var(--gr-block-bg-color);
    font-weight: normal;
    font-size: 1rem;
    color: var(--gr-color-gray-xdark);
}

.programs--banner .programs--banner__heading .programs--image__content .programs--image__content_divider {
    flex: none; /* flex cell */
    width: 1px;
    /* background: var(--prog-color-asu-accent); *//* v1 */
    background: rgba(var(--gr-color-gray-base-rgb), 0.25); /* v2 */
}

.programs--banner .programs--banner__heading .programs--image__content .programs--image__content_item {
    display: flex; /* flex box */
    flex-flow: column; /* flex box */
    gap: var(--prog-grid-space-xs); /* flex box */
    align-items: center; /* flex box */
}

.programs--banner .programs--banner__heading .programs--image__content .programs--image__content_item span.description {
    order: 1;
}

.programs--banner .programs--banner__heading .programs--image__content .programs--image__content_item span.numbers {
    order: 2;
}

.programs--banner .programs--banner__heading .programs--image__content .programs--image__content_item span {
    order: 3;
    text-align: center;
}

.programs--banner .programs--banner__heading .programs--image__content .programs--image__content_item .numbers {
    border-radius: var(--prog-border-radius-inf);
    padding: var(--prog-grid-space-xs) var(--prog-grid-space-md) !important; /* TODO: удалить в шаблоне атрибут style */
    line-height: 1;
    background: var(--prog-color-asu-accent);
    font-weight: 600;
    font-size: var(--prog-font-size-2xl) !important; /* TODO: удалить в шаблоне атрибут style */
    color: var(--gr-color-white);
}

.programs--banner .programs--banner__heading .programs--image__content .programs--image__content_item:first-child .numbers {
    font-size: 3rem !important; /* TODO: удалить в шаблоне атрибут style */
}

.programs--banner .programs--banner__heading .programs--image__content .programs--image__content_item span.description {
    text-transform: uppercase;
}

.programs--banner .programs--banner__lottie {
    flex: 1; /* flex cell */
}

/* }}} */

/* {{{ .programs--profile-header */

.programs--profile-header { /* см. .section_title */
    display: block;
    margin: var(--prog-block-margin) 0;
    line-height: 1.2;
    font-weight: 800;
    font-size: var(--prog-font-size-2xl);
    color: var(--gr-color-accent);
    text-transform: uppercase;
}

#dropdown .dropdown--content .programs--profile-header {
    /* margin: calc(.75 * var(--prog-block-margin)) 0; */
    margin: var(--prog-grid-space-lg) 0;
}

/* }}} */

/* {{{ .dropdown */

#dropdown {
    display: block;
    margin: var(--prog-block-margin) 0;
}

#dropdown .dropdown--header {
    display: flex; /* flex box */
    flex-flow: row wrap; /* flex box */
    gap: var(--prog-grid-space-xs); /* flex box */
}

#dropdown .dropdown--header button.dropdown--button {
    --min-height: 32px;
    --border-color: var(--gr-button-border-color);
    --border-color--hover: var(--gr-button-border-color--hover);
    --text-color: var(--gr-button-text-color);
    --text-color--hover: var(--gr-button-text-color--hover);
    display: inline-block;
    vertical-align: middle;
    outline: 0 solid transparent;
    border: 1px solid var(--border-color);
    border-radius: var(--gr-button-border-radius);
    padding: var(--prog-grid-space-2xs) var(--prog-grid-space-sm);
    min-height: var(--min-height);
    background: transparent;
    white-space: nowrap;
    font-weight: 600;
    font-size: var(--prog-font-size-lg);
    color: var(--text-color);
    cursor: pointer;
}

#dropdown .dropdown--header button.dropdown--button.active:not(:disabled),
#dropdown .dropdown--header button.dropdown--button:not(:disabled):hover,
#dropdown .dropdown--header button.dropdown--button:not(:disabled):focus {
    border-color: var(--border-color--hover);
    background-color: var(--border-color--hover);
    color: var(--text-color--hover);
}

#dropdown .dropdown--header button.dropdown--button:not([disabled]):focus {
    outline: var(--prog-outline-width) solid var(--gr-outline-color);
}

#dropdown .dropdown--container {
    display: none;
    margin-top: var(--prog-grid-space-lg);
}

#dropdown .dropdown--container.active {
    display: block;
}

/* }}} */

/* {{{ .programs--numbers__banner */

.programs--numbers__banner {
    display: flex; /* flex box */
    flex-flow: row nowrap; /* flex box */
    gap: var(--gr-block-padding); /* flex box */
    /* border: 1px solid var(--prog-color-asu-accent); */
    /* border-radius: var(--gr-card-border-radius); */
    border-radius: var(--gr-block-border-radius);
    padding: var(--gr-block-padding);
    background: var(--gr-block-bg-color);
    font-weight: normal;
    font-size: 1rem;
}

.programs--numbers__banner .programs--numbers__divider {
    flex: none; /* flex cell */
    width: 1px;
    /* background: var(--prog-color-asu-accent); *//* v1 */
    background: rgba(var(--gr-color-gray-base-rgb), 0.25); /* v2 */
}

.programs--numbers__banner .programs--numbers__item {
    display: flex; /* flex box */
    flex-flow: column; /* flex box */
    gap: var(--prog-grid-space-xs); /* flex box */
    align-items: center; /* flex box */
}

.programs--numbers__banner .programs--numbers__item span {
    border-radius: var(--prog-border-radius-inf);
    padding: var(--prog-grid-space-xs) var(--prog-grid-space-md);
    line-height: 1;
    background: var(--prog-color-asu-accent);
    white-space: nowrap;
    font-weight: 600;
    font-size: var(--prog-font-size-2xl);
    color: var(--gr-color-white);
    text-align: center;
}

.programs--numbers__banner .programs--numbers__item span.negative {
    border: 1px solid var(--prog-color-asu-accent);
    background: transparent;
    color:  var(--prog-color-asu-accent);
}

.programs--numbers__banner .programs--numbers__item span p {
    margin: 0 !important; /* TODO: удалить в шаблоне атрибут style */
    margin-top: var(--prog-grid-space-2xs) !important;
    padding: 0 !important; /* TODO: удалить в шаблоне атрибут style */
    font-size: 1rem !important; /* TODO: удалить в шаблоне атрибут style */
    color: inherit !important; /* TODO: удалить в шаблоне атрибут style */
}

.programs--numbers__banner .programs--numbers__item small {
    font-size: var(--prog-font-size-sm);
    text-align: center;
}

.programs--numbers__banner .programs--numbers__item ul { /* WARN: переопределяем некотрые стили .content ul */
    padding-left: 0;
    font-size: var(--prog-font-size-sm);
}

.programs--numbers__banner .programs--numbers__item ul > li + li { /* WARN: переопределяем некотрые стили .content ul */
    margin-top: var(--prog-grid-space-2xs) !important;
}

.programs--numbers__banner .programs--numbers__item ul > li::before { /* WARN: переопределяем некотрые стили .content ul */
    display: none !important;
}

@media (max-width: 840px) {
    body:not(._fd) .programs--banner__lottie {
        display: none;
    }
}

@media (max-width: 1068px) {
    body:not(._fd) .programs--numbers__banner {
        flex-flow: row wrap; /* flex box */
    }

    body:not(._fd) .programs--numbers__banner .programs--numbers__item + .programs--numbers__item + .programs--numbers__item + .programs--numbers__divider {
        width: 100%;
        height: 1px;
    }

    body:not(._fd) .programs--numbers__banner .programs--numbers__item.programs--numbers__price {
        flex: none; /* flex cell */
    }

    body:not(._fd) .programs--numbers__banner .programs--numbers__item.programs--numbers__exams {
        flex: 1; /* flex cell */
        align-items: flex-start; /* flex box */
    }

    body:not(._fd) .programs--numbers__banner .programs--numbers__item.programs--numbers__exams + .programs--numbers__divider {
        width: 100%;
        height: 1px;
    }
}

@media (max-width: 552px) {
    body:not(._fd) .states-section .states-container .states-wrapper {
        grid-template-columns: 1fr; /* grid box */
    }
}