:root {
    --color-category-main: #323232;
    --color-category-optic: #868DCD;
    --color-category-clinic: #8CE1C8;
    --color-category-shop: #FFE27B;
    --color-category-current: var(--color-category-main);

    --color-yellow: #FFE27B;
    --color-yellow-dark: #f1ae17;
    --color-yellow-light: #FFE99B;
    --color-red: #F33D46;
    --color-accent: #F33D46;
    --color-white: #ffffff;
    --color-white-border: #eaeafc;
    --color-text-dark: #323232;
    --color-text-base: #323232;
    --color-gray: #f5f5f9;
    --color-grey: #f5f5f9;
    --color-gray-light: #F0F0F0;
    --color-grey-light: #F0F0F0;
    --color-333333: #333333;
    --color-262628: #262628;
    --color-gray-dark: #DEDEDE;
    --color-DEDEDE: #DEDEDE;
    --color-hint: #edf6fd;
    --color-hint-accent: #d0e8fa;
    --color-secondary: #9ab8c3;

    --font-size-70: 24px;
    --font-size-60: 24px;
    --font-size-55: 24px;
    --font-size-50: 24px;
    --font-size-40: 22px;
    --font-size-30: 20px;
    --font-size-24: 18px;
    --font-size-20: 16px;
    --font-size-16: 16px;
    --font-size-14: 14px;
    --font-size-12: 12px;
    --header-height: 64px;
    --header-height-compensation: -64px;
    --px-100: 64px;
    --px-100-minus: -64px;
    --wrap-padding: 16px;
    --wrap-padding-minus: -16px;
    --wrap-padding-2x: 24px;
    --wrap-padding-2x-minus: -24px;
    --gap-default: 24px;
    --left-panel-width: 158px;
    --px-5: 5px;
    --px-10: 10px;
    --px-16: 16px;
    --px-20: 20px;
    --px-20-minus: -20px;
    --px-30: 30px;
    --px-30-minus: -30px;
    --px-40: 40px;
    --px-50: 50px;
    --px-60: 60px;
    --px-70: 70px;
    --px-80: 80px;
    --px-90: 90px;
    --px-100: 100px;
    --px-100-minus: -100px;
    --px-200: 200px;
    --button-color: #323232;
    --button-color-backgroud: transparent;
    --button-color-hover: #ffffff;
    --button-color-background-hover: #323232;
    --button-backgroud-color: transparent;
    --button-border-color: #323232;
    --button-border-radius: 3px;
    
    --border-radius-default: 16px;
    --box-shadow: 0px 4px 12px 0px #0000001A;
}

.content-c {
    margin-left: var(--left-panel-width);
    border-left: 1px solid #f0f0f0;
    padding-bottom: var(--px-100);
    padding-right: 48px;
    color: var(--color-text-base);
  /*  background: var(--color-white);*/
    overflow-x: hidden;
    position: relative;
}

.content-c a {
    color: var(--color-text-base);
}

.content-c {
    margin-left: 0;
    border-left: 0;
    padding-right: 0;
}

@media (max-width: 768px) {
	.content-c {
		margin-left: 0;
		border-left: 0;
		padding-right: 0;
	}
}
h1, .h1 {
    font-size: var(--font-size-70);
    line-height: 1.1;
    font-weight: 700;
    padding-bottom: var(--px-20);
    display: block;
}

h2, .h2 {
    font-size: var(--font-size-30);
    line-height: 1.1;
    font-weight: 700;
    padding-bottom: var(--px-20);
    display: block;
}

.wrap {
    max-width: var(--wrap-max-width);
    margin: auto;
    padding: 0 var(--wrap-padding);
}

section + section {
    margin-top: var(--px-100);
}

.site-categories {
    display: flex;
    gap: var(--gap-default);
    position: relative;
    z-index: 20;
    margin-top: var(--wrap-padding-minus);
}

.site-categories__item.category-optic {
    background: linear-gradient(0deg, #D7DBFF, #ffffff);
}
.site-categories__item.category-clinic {
    background: linear-gradient(0deg, #CEF7EA, #ffffff);
}

.site-categories__item {
    padding: var(--px-30);
    text-decoration: none !important;
    border-radius: 16px;
    position: relative;
    z-index: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-basis: 100%;
}

.site-categories__item:before {
    content: '';
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(146.17deg, #FFFFFF 25.55%, rgba(255, 255, 255, 0) 83.48%);
}

.site-categories__item-title {
    display: block;
    width: 50%;
}

.site-categories__item-description {
    display: block;
    width: 50%;
    margin-bottom: 36px;
}

@media (max-width: 768px) {
	.site-categories {
		flex-direction: column;
		margin-top: 32px;
	}
	.site-categories__item-title {
		width: 100%;
	}
	.site-categories__item-description {
		width: 100%;
	}
}

.content-c .button.button__w-arrow {
    position: relative;
    padding-right: 36px;
}

.content-c .button {
  /*  height: 36px;*/
    line-height: 30px;
    padding: 0 20px;
    background: transparent;
    border: 1px solid var(--button-border-color);
    border-radius: var(--button-border-radius);
    text-decoration: none !important;
    transition: color 300ms, background-color 300ms;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-sizing: border-box;
    color: var(--color-text-base) !important;
}

.content-c .button.button__w-arrow:after {
    content: '';
    display: inline-block;
    right: 12px;
    top: 0;
    bottom: 0;
    width: 24px;
    position: absolute;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%0A%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 8L14 12L10 16' stroke='%23323232' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    transition: all 300ms;
}

.content-c a:hover .content-c .button, .content-c .button:hover {
    --svg-color-base: #ffffff;
}

.content-c a:hover .content-c .button, a.content-c .button:hover, .content-c .button.is-active, .content-c .button:hover {
    background-color: var(--button-color-background-hover);
    color: var(--button-color-hover) !important;
}

.content-c a:hover .content-c .button.button__w-arrow:after, .content-c .button.button__w-arrow:hover:after {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 8L14 12L10 16' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}


.wysiwyg p, .wysiwyg ul, .wysiwyg ol, .wysiwyg p {
    margin-bottom: var(--px-20);
}