@font-face {
  font-family: "Nunito";
  src: url('/fonts/Nunito-Regular.eot');
  src: local('Nunito Regular'), local('Nunito-Regular'),
    url('/fonts/Nunito-Regular.woff2') format('woff2'),
    url('/fonts/Nunito-Regular.woff') format('woff'),
    url('/fonts/Nunito-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Nunito";
  src: url('/fonts/Nunito-Italic.eot');
  src: local('Nunito Italic'), local('Nunito-Italic'),
    url('/fonts/Nunito-Italic.woff2') format('woff2'),
    url('/fonts/Nunito-Italic.woff') format('woff'),
    url('/fonts/Nunito-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: "Nunito";
  src: url('/fonts/Nunito-Bold.eot');
  src: local('Nunito Bold'), local('Nunito-Bold'),
    url('/fonts/Nunito-Bold.woff2') format('woff2'),
    url('/fonts/Nunito-Bold.woff') format('woff'),
    url('/fonts/Nunito-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Nunito";
  src: url('/fonts/Nunito-BoldItalic.eot');
  src: local('Nunito Bold Italic'), local('Nunito-BoldItalic'),
    url('/fonts/Nunito-BoldItalic.woff2') format('woff2'),
    url('/fonts/Nunito-BoldItalic.woff') format('woff'),
    url('/fonts/Nunito-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
}
@font-face {
    font-family: "Rubik";
    src: url('/fonts/Rubik-Medium.eot');
    src: local('Rubik Medium'), local('Rubik-Medium'),
      url('/fonts/Rubik-Medium.woff2') format('woff2'),
      url('/fonts/Rubik-Medium.woff') format('woff'),
      url('/fonts/Rubik-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
  font-family: "Rubik";
  src: url('/fonts/Rubik-MediumItalic.eot');
  src: local('Rubik Medium Italic'), local('Rubik-MediumItalic'),
    url('/fonts/Rubik-MediumItalic.woff2') format('woff2'),
    url('/fonts/Rubik-MediumItalic.woff') format('woff'),
    url('/fonts/Rubik-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
}

:root {
    --tc: #22273C;
    --tc1: #288FFE;
    --tc2: #FFF;
    --tc3: #ADDBFF;
    --tc4: #FFF4E2;
    --tc5: #F2EBDE;
    --tc6: #BDD0ED;
    --tc7: #59A9FF;
    --tc8: #E9E6DE;
    --tc9: #BDBFC3;
    --tc10: #ADACA8;
    --tc11: #FFF0B3;
    --tc12: #E0EDFE;
    --tc13: #F3F8FF;
    --tc14: #E30000;

    --bg: #FFFEF5;
    --bg2: #F8F3E7;
    --bg3: #FFFEF5;
    --bg4: #F3C053;
    --bg5: #2AABEE;
    --bg5: #1A79DF;
    --bg6: #FFFFFC;
    --bg7: #EAECF6;

    --fs_44_36: 2.75rem;
    --fs_40_32: 2.5rem;
    --fs_38_34: 2.375rem;
    --fs_34_30: 2.125rem;
    --fs_30_28: 1.875rem;
    --fs_26_24: 1.625rem;
    --fs_24_22: 1.5rem;
    --fs_22_20: 1.375rem;
    --fs_20_18: 1.25rem;
    --fs_18_17: 1.125rem;
    --fs_17_16: 1.0625rem;
    --fs_16_15: 1rem;

    --offset: 0.375rem;
    --offset03: 0.5rem;
    --offset02: 0.625rem;
    --offset01: 0.75rem;
    --offset0: 0.875rem;
    --offset04: 0.9375rem;
    --offset1: 1rem;
    --offset2: 1.25rem;
    --offset20: 1.5rem;
    --offset21: 1.75rem;
    --offset3: 2rem;
    --offset4: 2.5rem;
    --offset40: 2.625rem;
    --offset41: 2.875rem;
    --offset5: 3rem;
    --offset51: 3.5rem;
    --offset50: 3.75rem;
    --offset6: 5rem;
    --offset7: 6rem;
    --offset8: 7.5rem;

    --rset: 1.5rem;
    --rset0: 1.5rem;
    --rset2: 2.5rem;
    --rset4: 5rem;

    @media (width >= 1200px) {
        --rset: 2.5rem;
        --rset0: 3rem;
        --rset2: 3.5rem;
        --rset4: 7rem;
    }
    @media (width < 1200px) {
        --fs_44_36: 2.25rem;
        --fs_40_32: 2rem;
        --fs_38_34: 2.125rem;
        --fs_34_30: 1.875rem;
        --fs_30_28: 1.75rem;
        --fs_26_24: 1.5rem;
        --fs_24_22: 1.375rem;
        --fs_22_20: 1.25rem;
        --fs_20_18: 1.125rem;
        --fs_18_17: 1.0625rem;
        --fs_17_16: 1rem;
        --fs_16_15: 0.9375rem;
    }
}
html {background-color: var(--bg);color: var(--tc);scrollbar-gutter: stable;height: 100%;}
body {display: flex;flex-direction: column;font: 400 100% "Nunito", sans-serif;min-height: 100vh;margin: 0;padding: 0;position: relative;text-align: left;}
body:has(.info_menu.open, [popover]:popover-open:not(.anchor)) {overflow: hidden;}
img {border:0;}
h1 {color: var(--tc);font: 500 var(--fs_40_32) / var(--fs_44_36) "Rubik", sans-serif;margin: 0 0 var(--offset21);padding: 0;text-align: left;hyphens: auto;overflow-wrap: break-word;word-break: normal;}
h2 {color: var(--tc);font: 500 var(--fs_34_30) / var(--fs_38_34) "Rubik", sans-serif;margin: var(--offset6) 0 var(--offset21);padding: 0;text-align: left;hyphens: auto;overflow-wrap: break-word;word-break: normal;}
h3 {color: var(--tc);font: 500 var(--fs_26_24) / var(--fs_30_28) "Rubik", sans-serif;margin: var(--offset4) 0 var(--offset20);padding: 0;text-align: left;hyphens: auto;overflow-wrap: break-word;word-break: normal;}
p {margin: var(--offset1) 0;hyphens: auto;overflow-wrap: break-word;word-break: normal;}
a {outline: none;}
* {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
article, footer, nav, section {display: block;}

.header {padding: var(--offset3) var(--offset2) 0;
    & +nav {padding: 0 var(--offset2);margin: var(--offset6) 0 var(--offset3);
        & +main {margin-top: 0;}
    }
}
.header_info {align-items: center;display: flex;gap: var(--offset2);}
.header_info >.more {margin-top: 0;}
.logo {flex: 0 0 auto;width: 124px;
  & >a {display: block;height: 58px;text-decoration: none;line-height: 0;position: relative;
        & >img {margin: auto;max-width: 100%;max-height: 100%;outline: none;position: absolute;inset: 0;}
  }
}
.info_menu {display: flex;flex-grow: 1;justify-content: center;
    & >ul {display: flex;gap: var(--offset2);margin: 0;padding: 0;
        & >li {list-style: none;white-space: nowrap;position: relative;
            & >a {color: var(--tc);font-size: var(--fs_16_15);line-height: var(--fs_22_20);text-decoration: none;
              &:hover {color: var(--tc1);}
            }
            &.active:before {background-color: var(--tc12);border-radius: 10px;filter: blur(6px);content: '';height: 20px;position: absolute;inset: 0;margin: auto;width: 40px;z-index: -1;}
            & ul {display: none;}
        }
    }
}
/*меню 2+ ур комп*/
.header_info:not(:has(>.burger)) {
    & >.info_menu ul >li:has(>ul) {position: relative;
        >a {align-items: center;display: flex;gap: 6px;
            &:after {background-color: var(--tc);-webkit-mask-image: url("/images/open.svg");mask-image: url("/images/open.svg");content: '';height: 10px;width: 10px;}
            &:hover:after {background-color: var(--tc1);}
        }
        &:hover >ul {display: block;}
        & ul {margin: 0;padding: 0 12px;position: absolute;z-index: 2;min-width: 240px;}
        & ul:before {background-color: var(--tc2);box-shadow: 0 2px 10px rgba(174, 170, 161, 0.2);border-radius: 23px;content: '';position: absolute;top: 8px;left: -8px;right: -8px;bottom: 0;z-index: -1;}
        & >ul {top: 100%;left: -16px;padding: var(--offset2) 0 var(--offset01);}
        & >ul >li >ul {top: 0;left: 100%;padding-left: 20px;padding-top: 0;
            &:before {left: 12px;top: -12px;}
        }
        & ul >li {list-style: none;
            &:hover {background-color: var(--tc13);border-radius: 23px;}
            & >a {color: var(--tc);display: block;font-size: var(--fs_16_15);line-height: var(--fs_22_20);text-decoration: none;padding: 8px 16px;
                &:hover {color: var(--tc1);}
            }
            &:has(>ul) {position: relative;
                & >a {align-items: center;display: flex;gap: 6px;justify-content: space-between;
                    &:after {background-color: var(--tc);-webkit-mask-image: url("/images/open.svg");mask-image: url("/images/open.svg");content: '';height: 10px;width: 10px;transform: rotate(-90deg);}
                    &:hover:after {background-color: var(--tc1);}
                }
            }
        }
    }
}
.phone {font: 500 0.9375rem / 1.375rem "Rubik", sans-serif;white-space: nowrap;}
.burger {background: url("/images/burger.svg") no-repeat 50% 50%;cursor: pointer;height: 28px;text-indent: 100%;white-space: nowrap;overflow: hidden;width: 28px;flex: 0 0 auto;}
.header_info:has(>.burger) {justify-content: flex-end;
    & .logo {margin-right: auto;}
    & >.info_menu {background-color: var(--bg);justify-content: flex-start;flex-direction: column;padding: 0 var(--offset2);position: fixed;overflow-y: auto;
    inset: 0;transition: clip-path 0.4s ease-in-out;clip-path: inset(0 0 0 100%);z-index: 4;
        &.open {clip-path: inset(0);}
        & >.nav_menu {align-items: center;border-bottom: 1px solid var(--tc5);display: flex;gap: 1rem;justify-content: space-between;padding: var(--offset40) var(--offset2) var(--offset3);margin-inline: calc(var(--offset2) * -1);
            & >.close {background: url("/images/close.svg") no-repeat 50% 50%;cursor: pointer;height: 28px;text-indent: 100%;white-space: nowrap;overflow: hidden;width: 28px;}
            & >.title {color: var(--bg5);font: 500 1.125rem / 1.375rem "Rubik", sans-serif;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
            & >.backward {background: url("/images/back.svg") no-repeat 50% 50%;cursor: pointer;height: 28px;text-indent: 100%;white-space: nowrap;overflow: hidden;width: 28px;}
        }
        & >ul {flex-direction: column;flex-grow: 1;gap: var(--offset3);padding: var(--offset4) 0;
            & >li:before {display: none;}
            & li {padding-right: 1.5rem;position: relative;}
            & li:has(>ul):after {background-color: var(--tc);-webkit-mask-image: url("/images/arrow.svg");mask-image: url("/images/arrow.svg");content: '';height: 10px;position: absolute;top: 50%;transform: translate(0,-50%) rotate(90deg);right: 0;width: 20px;}
            & li >a {color: var(--tc);font-size: 1.125rem;line-height: 1.5rem;text-decoration: none;}
            & li >ul {background-color: var(--bg);bottom: 0;display: flex;flex-direction: column;gap: var(--offset3);margin: 0;padding: var(--offset4) var(--offset2);position: fixed;right: -100%;top: 103px;width: 100vw;transition: right 0.4s ease-in-out;z-index: 1;
                @media (width >= 768px) {width: 40vw;}
            }
            & li >ul >li {list-style: none;white-space: normal;opacity: 0;transition: opacity 0.3s ease-in-out;}
            & li.open >ul {right: 0;}
            & li.open >ul >li {opacity: 1;}
        }
        & >.phone {border-top: 1px solid var(--tc5);padding: var(--offset3) var(--offset2);margin-inline: calc(var(--offset2) * -1);}
        @media (width >= 768px) {border-left: 1px solid var(--bg2);left: auto;width: 40vw;}
    }
}


main {display: flex;justify-content: center;flex: 1 0 auto;font-size: var(--fs_18_17);line-height: 1.5rem;padding: 0 var(--offset2);margin: var(--offset6) 0 var(--rset4);
    article {max-width: 1300px;width: 100%;
        & :is(.one_three, .two_four, .one_two) {margin: var(--offset4) 0;}
        & .bg_cloud {position: relative;
            &:before {background: url("/images/bor-bg.png") no-repeat 50% 50% / contain;content: '';inset: 0;height: 420px;margin: auto;position: absolute;z-index: -1;}
        }
        & div:has(h2) >h2:nth-of-type(1) {margin-top: 0;}
        & .topic:has(h2)  {margin-top: var(--offset6);}
        & >h2 +.price_block {margin-top: var(--offset4);}
        @media (width >= 1200px) {
            & .topic >div:first-child::after {bottom: 0;}
        }
    }
    &:has(>aside) {flex-direction: column;gap: var(--offset6);
        & >aside {display: flex;flex-direction: column;gap: var(--offset4);width: 100%;
            & div:has(h2) >h2:nth-of-type(1) {margin-top: 0;}
            & div:has(h3) >h3:nth-of-type(1) {margin-top: 0;}
            & >.form {background-color: var(--bg2);border-radius: 23px;overflow: hidden;padding: 2rem var(--offset4);
                & .more +.more:after {background-color: var(--bg2);}
            }
        }
    }
    @media (width < 1200px) {
        &:has(>aside) >aside >.form {padding: var(--offset5) var(--offset20);
            & h3 {font-size: var(--fs_34_30);line-height: var(--fs_38_34);margin-bottom: var(--offset21);}
        }
    }
    @media (width >= 1200px) {
        &:has(>aside) {flex-direction: row;justify-content: center;
            & >article {max-width: 900px;}
            & >aside {flex: 0 0 auto;width: 320px;
                & >.promo_test  {padding-inline: 0;
                    & >div {width: 100%;
                      &:first-child {padding: 2rem var(--offset4) 0;}
                      & +div {padding-right: 0;}
                      & >h2 {font-size: var(--fs_26_24); line-height: var(--fs_30_28);margin-bottom: var(--offset20);}
                      & >.more.text {flex-direction: column;align-items: flex-start;font-size: 1rem;line-height: 137.5%;
                          & >a {text-align: center;width: 100%;}
                       }
                    }
                }
            }
        }
    }
}
section {padding: var(--rset4) var(--offset2);
    &:has(>.white_yellow) {background: url("/images/clouds-bg.png") no-repeat 0 100%;}
    &:has(>.promo_block) {padding-top: var(--offset4);padding-bottom: 0;overflow: hidden;}
    &:has(>.grad) {background: linear-gradient(to bottom, #FFFEF5, #FFF);}
    &:has(>.grad_top) {background: linear-gradient(to top, #FFFEF5, #FFF);}
    &:has(>.grad_white) {background-color: #FFF;}
    &:has(>.bg_cloud) {position: relative;
        &:before {background: url("/images/bor-bg.png") no-repeat 50% 100%;content: '';position: absolute;inset: 0;}
    }
    &:has(.text_limit) >div >:is(h2,p) {max-width: 720px;}
    & p:has(+div) {margin-bottom: 0;}
    &:has(h2) {padding-top: var(--rset2);}
    &:has(h2) h2:nth-of-type(1) {margin-top: 0;}
    & h2:nth-of-type(1):not(:has(+p)) {text-align: center;margin-bottom: var(--rset2);margin-top: 0;}
    & div >h2:first-child +* {margin-top: 0;}
}
:is(section, article) ul:not([class]) {display: flex;flex-direction: column;gap: var(--offset01);margin: var(--offset20) 0;padding: 0;
    & >li {list-style: none;position: relative;padding-left: calc(1rem + 8px);
        &:before {background-color: var(--bg5);border-radius: 50%;content: '';height: 8px;position: absolute;left: 0;top: 8px;width: 8px;}
    }
}
.b_link {display: flex;flex-direction: column;gap: var(--offset2);margin: var(--offset20) 0;padding: 0;
    & >li {align-items: center;display: flex;flex-wrap: wrap;gap: var(--offset2);font-style: italic;
        & >a {background-color: var(--bg6);border:  2px solid var(--tc8);border-radius: 23px;color: var(--tc);font-weight: 700;font-style: normal;min-width: 244px;text-decoration: none;padding: 9px var(--offset01);text-align: center;
          &:hover {color: var(--tc1);border-color: var(--tc1);}
        }
    }
    &.row {flex-direction: row;flex-wrap: wrap;}
}
:is(section, article, .preview_content) a {color: var(--bg5);text-decoration: underline;
    &:hover {color: var(--tc1);text-decoration: none;}
}

.block_center, section >div {margin-inline: auto;max-width: 1300px;position: relative;}
.text_block p {font-size: var(--fs_18_17);line-height: 1.5rem;}
.bor >div {border-radius: 23px;border: 2px solid var(--bg5);overflow: hidden;}
:is(article, .quote) >* {
    &:first-child {margin-top: 0;}
    &:last-child {margin-bottom: 0;}
}
.icon_hide {display: flex;flex-wrap: wrap;gap: var(--offset2);margin-top: var(--offset2);
    & >a {line-height: 0;text-decoration: none;height: 28px;width: 28px;text-indent: 100%;white-space: nowrap;overflow: hidden;position: relative;
        &:before {content: '';position: absolute;inset: 0;}
        &.tg:before {background-color: var(--tc);-webkit-mask-image: url("/images/telegram.svg");mask-image: url("/images/telegram.svg");}
        &.tg:hover:before {background-color: var(--bg5);}
    }
}
/*крошки*/
.crumb {display: flex;flex-wrap: wrap;gap: 1rem;margin: 0 auto;padding: 0;max-width: 1300px;
    & >li {list-style: none;
        & >a {color: var(--tc);font-size: var(--fs_16_15);line-height: var(--fs_22_20);text-decoration: none;
            &:hover {color: var(--tc1);}

        }
        &:last-child >a {color: var(--tc10);}
        &:not(:last-child) {align-items: center;display: flex;
          &:after {border-radius: 50%;background-color: var(--tc8);content: "";height: 4px;margin-left: var(--offset04);width: 4px;}
        }
    }
}
/*блоки*/
.two, .one_two, .one_three, .two_four, .two_five {display: flex;flex-wrap: wrap;gap: var(--offset2);}
:is(.two, .two_four, .two_five) >div {width: calc(50% - var(--offset2)/2);}
:is(.two_four,.two_five, .one_three).vc >div {display: flex;flex-direction: column;justify-content: center;}
@media (width < 768px) {
    :is(.one_two,.one_three) >div {width: 100%;}
}
@media (width >= 768px) {
    .two_four >div {width: calc(25% - var(--offset2)*3/4);}
    .one_two >div {width: calc(50% - var(--offset2)/2);}
    .one_three >div {width: calc(100%/3 - var(--offset2)*2/3);}
}
@media (768px <= width < 1200px) {
    .two_five >div {width: calc(25% - var(--offset2)*3/4);}
}
@media (width >= 1200px) {
    .two_five >div {width: calc(20% - var(--offset2)*4/5);}
}
/*картинки*/
.photo {line-height: 0;
    & >img {display: block;outline: none;user-select: none;width: 100%;}
    &.br {border-radius: 23px;overflow: hidden;}
    &.mr {margin: var(--offset4) 0;}
}
/*кнопки*/
.more {display: flex;flex-wrap: wrap;gap: var(--offset2);margin-top: var(--offset4);
    & >:is(span, a) {background-color: var(--tc2);border-radius: 23px;cursor: pointer;color: var(--bg5);border: 2px solid var(--bg5);font: 500 0.9375rem / 1.375rem "Rubik", sans-serif;padding: var(--offset02) var(--offset2);white-space: nowrap;text-decoration: none;user-select: none;
        &:not([class]):hover {border-color: var(--tc1);color: var(--tc1);}
        &.blue {background-color: var(--bg5);color: var(--tc2);
            &:not(.disable):hover {background-color: var(--tc1);border-color: var(--tc1);}
        }
        &.send_mail {background-image: url("/images/share.svg");background-position: 50% 50%;background-repeat: no-repeat;text-indent: 100vw;white-space: nowrap;overflow: hidden;width: 46px;anchor-name: --popover-anchor;}
        &.download {background-image: url("/images/download.svg");background-position: 50% 50%;background-repeat: no-repeat;text-indent: 100vw;white-space: nowrap;overflow: hidden;width: 46px;}
    }
    &.text {align-items: center;font-weight: 700;flex-wrap: nowrap;}
    &.all >:is(span, a) {flex-grow: 1;text-align: center;}
    & +.more {margin-top: var(--offset41);position: relative;
        &:before {background-color: var(--tc8);content: '';height: 1px;position: absolute;left: 0;right: 0;top: -24px;}
        &:after {background-color: var(--bg3);color: var(--tc9);content: 'или';font: 500 0.9375rem / 1.375rem "Rubik", sans-serif;margin-inline: auto;position: absolute;left: 0;right: 0;top: -35px;text-align: center;width: 52px;}
    }
    &.icons.all >* {align-items: center;display: flex;justify-content: center;gap: var(--offset02);}
    &.icons >*:before {align-items: center;background-position: 0 0;background-repeat: no-repeat;content: '';display: flex;height: 16px;width: 16px;}
    &.icons.tg >*:before {background-image: url("/images/telegram_small.svg");}
    &:has( >[popovertarget]) {container-type: inline-size;}
}
/*иконки*/
.icon >div {background-color: var(--bg6);padding: var(--offset3) var(--rset);
  & >p {font-size: var(--fs_17_16);line-height: var(--fs_24_22);margin: 0;
        &:first-child {font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;margin-bottom: var(--offset0);}
  }
  &:is([data-icon],[data-icons]) >p:first-child {display: flex;flex-direction: column;}
  &[data-icon] >p:first-child:before {background-image: var(--icon-url);background-position: 0 0;background-repeat: no-repeat;content: '';height: 24px;margin-bottom: 1rem;}
  &[data-icons] >p:first-child:before {background-image: var(--icon-url);background-position: 0 0;background-repeat: no-repeat;content: '';height: 40px;margin-bottom: var(--offset20);}
  &[data-icons='4'] >p:first-child:before {background-image: url("/images/icon/book.svg");}
  &[data-icons='5'] >p:first-child:before {background-image: url("/images/icon/puzzle.svg");}
  &[data-icons='6'] >p:first-child:before {background-image: url("/images/icon/guidance.svg");}
}
.icon_ul {margin: var(--offset4) 0;padding: 0;
    & >li {align-items: center;display: flex;gap: 1rem;list-style: none;font: 500 0.9375rem / 1.375rem "Rubik", sans-serif;
        &:not(:first-child) {margin-top: var(--offset2);}
        & >a {color: var(--tc);text-decoration: none;}
        &:before {background-position: 0 0;background-repeat: no-repeat;content: '';flex: 0 0 auto;height: 40px;width: 40px;}
        &[data-icon='1']:before {background-image: url("/images/icon/phone.svg");}
        &[data-icon='2']:before {background-image: url("/images/icon/mail.svg");}
        &[data-icon='3']:before {background-image: url("/images/icon/telegram.svg");}
    }
}
/*popover*/
[popover]:not(.anchor) {background-color: transparent;border: none;position: fixed;inset: 0;width: auto;height: auto;margin: auto;padding: var(--offset02);
    &::backdrop {background-color: rgba(249, 246, 235, 0.9);backdrop-filter: blur(10px);}
    &:popover-open {display: grid;overflow-y: auto;}
}
[popover].anchor {background-color: transparent;border: none;position: fixed;inset: auto;width: fit-content;height: fit-content;margin: -1rem 0 0;padding: 0;top: anchor(top);left: anchor(left);position-anchor: --popover-anchor;transform: translateY(-100%);max-width: 100cqi;
    & h3 {text-align: left;}
}
.preview_content {display: flex;flex-direction: column;gap: var(--offset02);margin: auto;max-width: 960px;position: relative;width: 100%;
    & >button {align-self: flex-end;appearance: none;border: 0;background-color: transparent;outline: none;cursor: pointer;position: relative;padding: 0;text-indent: 100%;white-space: nowrap;overflow: hidden;height: 28px;width: 28px;
        &:before {background-color: var(--tc);content: '';height: 28px;position: absolute;inset: 0;width: 28px;transition: background-color 0.4s linear;}
        &:hover:before {transition: background-color 0s linear;}
        &.close:before {mask-image: url('../images/close.svg');}
        &.close:hover:before {background-color: var(--tc1);}
    }
    & >div {background-color: var(--bg3);border-radius: 23px;padding: var(--offset3) var(--rset);
        & >h3 {margin-top: var(--offset03);text-align: center;
            &:has(+.head) {margin-bottom: 0;}
            & +.head {color: var(--bg5);font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;margin: var(--offset03) 0 var(--offset20);text-align: center;}
        }
    }
}
[popover] >.form {max-width: 500px;}
[popover] >.reviews {max-width: 720px;
    & >p {font-size: var(--fs_18_17);line-height: 1.5rem;margin: 0;
        &:last-child {color: var(--bg5);font-size: var(--fs_16_15);line-height: var(--fs_22_20);font-weight: 700;margin-top: 1rem;}
    }
}
/*форма*/
.form form {
    & >fieldset {border: 0;margin: 0;padding: 0;
        & >.row_block {display: flex;gap: var(--offset2);
            & .more {margin-top: 0;}
             @media (width < 481px) {flex-direction: column;}
        }
        & .form_block:not(:first-child) {margin-top: var(--offset2);}
        & .form_block:has([type="checkbox"]) {display: flex;gap: var(--offset02);
            & >input {align-self: flex-start;appearance: none;background-color: var(--bg6);border-radius: 7px;border: 2px solid var(--tc8);cursor: pointer;height: 20px;flex: 0 0 auto;margin: 0;width: 20px;outline: none;
                &:checked {background: var(--bg5) url("/images/check.svg") no-repeat 50% 50%;border-color: var(--bg5);}
                &.error:invalid {border-color: var(--tc14);color: var(--tc14);
            }
            }
            & >p {color: var(--tc);font-size: var(--fs_16_15);line-height: var(--fs_22_20);margin: 0;
                & >a:not(:hover) {color: var(--tc);}
            }
        }
        & :is(input.query_text, textarea) {background-color: var(--bg6);border: 2px solid var(--tc8);border-radius: 12px;box-shadow: none;color: var(--tc);font: 400 var(--fs_16_15) / var(--fs_22_20) "Nunito", sans-serif;outline: none;margin: 0;padding: var(--offset02) var(--offset2);-webkit-appearance: none;width: 100%;
            &::-moz-placeholder {color: var(--tc9);opacity: 1;}
            &::-webkit-input-placeholder {color: var(--tc9);opacity: 1;}
            &:focus {border-color: var(--tc1);}
            &.error:invalid {border-color: var(--tc14);color: var(--tc14);
                &::-moz-placeholder {color: var(--tc14);opacity: .5;}
                &::-webkit-input-placeholder {color: var(--tc14);opacity: .5;}
            }
        }
        & textarea {height: 106px;resize: none;}

    }
}
.form >.msg_send {text-align: center;
    & >h3 {text-align: center;margin-top: 0;}
    & >p {font-size: var(--fs_18_17);line-height: 1.5rem;margin: 0;}
    & >.photo >img {max-width: 380px;margin-inline: auto;}
}
/*квиз*/
.quiz {background: var(--bg2) url("/images/quiz-bg.jpg") no-repeat 50% 50% / cover;border-radius: 23px;display: flex;gap: var(--rset2);flex-direction: column;margin: var(--rset2) 0;min-height: 582px;padding: var(--rset2) var(--offset20);
    & >.quiz_title {font: 500 var(--fs_16_15) / 1.375rem  "Rubik", sans-serif;margin: 0;text-align: center;}
    & >.quiz_text {font: 500 var(--fs_34_30) / var(--fs_38_34)  "Rubik", sans-serif;margin: auto 0 0;text-align: center;
        & >span {background-color: var(--tc);border-radius: 3px;display: inline-block;height: 3px;width: 180px;}
    }
    & >.quiz_reply {text-align: center;margin: 0 auto;max-width: 660px;width: 100%;
        & >div {background-color: var(--bg6);border: 2px solid var(--tc8);border-radius: 30px;cursor: pointer;font-weight: 700;padding: 9px var(--offset2);user-select: none;
            &:hover {border-color: var(--tc1);color: var(--tc1);}
            &.active {background-color: var(--bg5);border-color: transparent;color: var(--tc2);}
        }
    }
    & >.quiz_nav {justify-content: center;margin-top: auto;
        & >.back {text-indent: 100vw;white-space: nowrap;overflow: hidden;position: relative;width: 46px;
            &:before {background-color: var(--tc2);-webkit-mask-image: url("/images/arrow.svg");mask-image: url("/images/arrow.svg");content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) rotate(-90deg);transform-origin: center;height: 10px;width: 20px;}
        }
    }
    &:not(:has(>.quiz_reply >.active)) .forward, &[data-ask="0"] .back {background-color: rgba(from var(--bg5) r g b / 0.3);border-color: transparent;cursor: default;
        &:hover {background-color: rgba(from var(--bg5) r g b / 0.3);border-color: transparent;}
    }
    @media (width >= 1200px) {padding-inline: var(--offset8);}
}
/*gl block*/
.promo_block {display: flex;gap: var(--offset51) var(--offset2);align-items: center;
    @media (width < 768px) {flex-direction: column;}
    @media (width >= 1200px) {column-gap: 80px;}
    & >div {
        & >p {font-size: var(--fs_18_17);line-height: 1.5rem;}
        & >img {display: block;position: relative;width: 100%;z-index: -2;
            @media (width < 1200px) {top: calc(var(--offset4) * -1);left: var(--offset4);max-width: 560px;}
            @media (width >= 1200px) {top: calc(var(--offset6) * -1);left: var(--offset6);}
        }
        & .rating {margin-top: var(--offset4);}
        & .rating >div {max-width: 120px;
          &:first-child >p:first-child {background: url("/images/star.svg") no-repeat 0 50%;padding-left: 20px;}
          & >p {font-size: var(--fs_16_15);line-height: var(--fs_22_20);margin: 0;
            &:first-child {font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;margin-bottom: var(--offset);}
            & >a{
                color: var(--tc);
                text-decoration: none;
                &:hover{color: var(--tc1);}
            }
          }
          @media (width >= 1200px) {max-width: 200px;}
        }
        @media (width >= 768px) {width: 50%;}
        @media (width >= 1200px) {
          &:first-child {flex-grow: 1;}
        }
    }
    & >div:first-child {background: url("/images/head.png") no-repeat 0 0 / cover;aspect-ratio: 1/1;position:relative;
    &:before {position: absolute;content: '';display: block;background: var(--bg);z-index: -1;width: 100vw;height: 100vh;left: 0;top: calc(100% - 120px);filter: blur(20px);}
    @media (width < 768px) {margin-inline: calc(var(--offset2) * -1);}
    @media (width >= 768px) {order: 2;}
    }
    & >div +div {
        @media (width >= 1200px) {max-width: 480px;}
    }
}
/*промо текст + картинка*/
.promo_test {align-items: center;border-radius: 23px;background-color: var(--tc);justify-content: space-around;
    & >div {color: var(--tc2);
        & >h2 {color: var(--tc2);
            & >span {color: var(--tc7);}
        }
        & >p {color: var(--tc6);}
        &:first-child {padding: var(--offset5) var(--offset20) 0;}
    }
    &.result {margin: var(--rset2) 0;
      & .test_title {color: var(--tc6);margin: 0;}
      & h2 {margin-top: 1rem;
        & >span {color: var(--tc11);}
      }
      & p {color: var(--tc2);}
      & .msg_send >p {color: var(--tc);margin: 0;}
    }
    @media (width < 768px) {
        &.result {padding-bottom: var(--offset5);}
    }
    @media (width >= 768px) {
        & >div:first-child {padding-bottom: var(--offset5);padding-right: 0;}
        & >div+div {align-self: flex-end;padding-right: var(--offset20);max-width: 544px;}
        &.result >div+div {align-self: center;padding-bottom: var(--offset5);padding-top: var(--offset5);}
    }
    @media (width >= 1200px) {padding-inline: var(--offset7);}
}
.teacher_block {
    & >div >*:last-child {margin-bottom: 0;}
    & >.teacher_slide {margin-top: var(--rset2);position: relative;
        & >.teacher_photo {position: relative;aspect-ratio: 1/1;
            & >.photo {border-radius: 23px;visibility: hidden;position: absolute;top: 0;left: 0;overflow: hidden;}
            & >.photo.active {visibility: visible;}
        }
        & >.thumb_photo {align-items: flex-end;display: none;gap: var(--offset01);position: absolute;bottom: -2rem;left: 0;right: 0;justify-content: center;
            & >.photo {aspect-ratio: 1/1;border-radius: 23px;cursor: pointer;width: 80px;overflow: hidden;transition: width .3s ease-in-out;position: relative;
                &.active {border: 2px solid var(--bg5);cursor: default;width: 112px;}
                &:not(.active):before {background-color: var(--bg2);content: '';opacity: .6;position: absolute;inset: 0;}
            }
        }
        & >:is(.back, .forward) {align-self: center;cursor: pointer;position: relative;height: 46px;text-indent: 100%;white-space: nowrap;overflow: hidden;width: 46px;
        &:before {background-color: var(--bg5);-webkit-mask-image: url("/images/arrow.svg");mask-image: url("/images/arrow.svg");content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) rotate(90deg);transform-origin: center;height: 10px;width: 20px;}
        }
        & .back {transform: rotate(180deg);margin-left: 10px;}
        & .forward {margin-right: 10px;order: 2;}
    }
    & >.teacher_info {display: flex;overflow: hidden;
        & >div {visibility: hidden;width: 100%;flex: 0 0 auto;
            & >p {font-size: var(--fs_16_15);line-height: var(--fs_22_20);margin: 0;
                &:first-child {color: var(--bg5);font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;margin-bottom: var(--offset03);}
            }
            >ul {position: relative;margin: var(--offset2) 0 0;padding-top: var(--offset2);
                &:before {background-color: var(--bg2);content: '';height: 1px;position: absolute;top: 0;right: 0;width: 0;transition: width .3s ease-in-out;}
                & >li {padding-left: calc(var(--offset0) + 8px);
                    &:before {top: 7px;}
                }
            }
        }
        & >.active {visibility: visible;order: -1;
            & >ul:before {width: 100%;}
        }
    }
    @media (width < 768px) {
        & >.teacher_slide {display: flex;gap: var(--offset2);margin-inline: calc(var(--offset2) * -1);margin-bottom: var(--offset2);}
        & >.teacher_slide >.teacher_photo {flex-grow: 1;}
        & >.teacher_info >div >p {text-align: center;}
    }
    @media (768px <= width < 1200px) {display: flex;flex-wrap: wrap;
        & >div:first-child {width: 100%;}
        & >.teacher_slide {order: 2;width: 50%;
            & >.thumb_photo >.photo {width: 56px;
                &.active {width: 80px;}
            }
        }
        & >.teacher_info {align-self: flex-end;width: 50%;}

    }
    @media (width >= 768px) {
        & >.teacher_slide >.thumb_photo {display: flex;}
        & >.teacher_info {margin-top: var(--rset2);}
    }
    @media (width >= 1200px) {display: grid;grid-template-columns: 58% 42%;
        & >div:first-child {padding-right: 7.5rem;}
        & >.teacher_slide {margin-top: auto;grid-row: span 2;}
        & >.teacher_info {max-width: 440px;align-self: flex-end;margin-left: auto;width: 440px}
    }
}
/*отзывы на главной*/
.reviews_block {display: flex;gap: var(--offset2);flex-direction: column;margin-top: var(--rset2);
    & >.bor {display: flex;gap: var(--offset2);flex-direction: column;}
    & >.bor >div {background-color: var(--bg6);padding: var(--offset3) var(--rset);
        & >p:nth-of-type(1) {margin: 0;}
        & >input[name="show"] {background: transparent;appearance: none;border: 0;border-radius: 0;color: var(--tc);cursor: pointer;display: inline-flex;font: 700 var(--fs_16_15) / var(--fs_22_20) "Nunito", sans-serif;margin: 4px 0 0;padding: 0;outline: none;
            &:after {content: "Читать полностью";}
            &:hover {color: var(--tc1);}
        }
    }
    & +.more {margin-top: var(--offset2);}
    @media (width < 1200px) {
        & div >.reviews_head +p {-webkit-line-clamp: 4;display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden;}
        & div:has(input[name="show"]:checked) >.reviews_head + p {-webkit-line-clamp: unset;display: block;overflow: visible;}
        & div:has(input[name="show"]:checked) >input[name="show"] {display: none;}
    }
    @media (width >= 1200px) {flex-direction: row;position: relative;
        & >.bor {width: calc(100%/3 - var(--offset2)*2/3);
            & >div {align-items: center;display: grid;flex-grow: 1;
                & >.reviews_head {align-self: flex-start;}
                & >p:last-child {align-self: flex-end;}
                & >*{opacity: 1;transition: opacity .5s ease-out;}
                &.loading >*{opacity: 0;}
            }
        }
        & >.bor:nth-of-type(1) >div:nth-of-type(1),  >.bor:nth-of-type(3) >div:nth-of-type(2) {max-height: 220px;height: 220px;}
        & >.bor:nth-of-type(1) >div:nth-of-type(2),  >.bor:nth-of-type(3) >div:nth-of-type(1) {max-height: 364px;height: 364px;}
        & >.bor:nth-of-type(1) >div:nth-of-type(1) >.reviews_head +p {-webkit-line-clamp: 2;display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden;}
        & >.bor:nth-of-type(1) >div:nth-of-type(2) >.reviews_head +p {-webkit-line-clamp: 8;display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden;}
        & >.bor:nth-of-type(3) >div:nth-of-type(1) >.reviews_head +p {-webkit-line-clamp: 8;display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden;}
        & >.bor:nth-of-type(3) >div:nth-of-type(2) >.reviews_head +p {-webkit-line-clamp: 2;display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden;}
        & >.bor:nth-of-type(2) >div >.reviews_head +p {-webkit-line-clamp: 18;display: -webkit-box;-webkit-box-orient: vertical;overflow: hidden;}
        & >:is(.back, .forward) {align-self: center;background-color: var(--bg5);border-radius: 50%;cursor: pointer;position: absolute;top: calc(50% - 23px);height: 46px;text-indent: 100%;white-space: nowrap;overflow: hidden;width: 46px;
            &:hover {background-color: var(--tc1);}
            &:before {background-color: var(--tc2);-webkit-mask-image: url("/images/arrow.svg");mask-image: url("/images/arrow.svg");content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) rotate(90deg);transform-origin: center;height: 10px;width: 20px;}
        }
        & .back {transform: rotate(180deg);left: -10px;}
        & .forward {right: -10px;}
    }
    @media (width >= 1440px){
        & .back {left: -66px;}
        & .forward {right: -66px;}
    }
}
.reviews_head {align-items: center;display: flex;gap: 1rem;justify-content: space-between;margin-bottom: 1rem;
    & >a {text-decoration: none;line-height: 0;}
    & ~ *:last-child {color: var(--bg5);font-size: var(--fs_16_15);line-height: var(--fs_22_20);font-weight: 700;margin-bottom: 0;}
}
.stars {display: flex;gap: 2px;
    & >span {background-color: var(--bg7);display: flex;flex: 0 0 auto;-webkit-mask-image: url("/images/star.svg");mask-image: url("/images/star.svg");text-indent: 200%;white-space: nowrap;overflow: hidden;user-select: none;pointer-events: none;height: 16px;width: 16px;
        &[class] {background-color: var(--bg4)}
    }
}
/*отзывы*/
.reviews_list {display: flex;flex-direction: column;gap: var(--offset2);margin: var(--offset4) 0;
    & >div {background-color: var(--bg6);padding: var(--offset3) var(--rset);}
    & +.more {margin: var(--offset2) 0 var(--offset4);}
    &:has(+.more)  {margin-bottom: 0;}
}
/*контакты*/
.cont_block.one_two {gap: var(--offset4);
    & >div >h3 {margin-top: 0;}
    & >div >.photo {border-radius: 23px;overflow: hidden;}
    @media (width >= 768px) {
        & >div + div {order: -1;width: calc(60% - var(--offset4));}
        & >div {width: 40%;}
        & >div >.photo {position: relative;height: 100%;
            & >img {height: 100%;object-fit: cover;object-position: 50% 50%;max-width: 100%;max-height: 100%;position: absolute;inset: 0;margin: auto;}
        }
    }
    @media (width >= 1200px) {
        column-gap: var(--offset6);
        & >div + div {width: calc(60% - var(--offset6));}
    }
}

.application {display: flex;flex-wrap: wrap;gap: var(--offset2);
    & >div {width: 100%;
        & >p {font-size: var(--fs_18_17);line-height: 1.5rem;
            &:first-child {font-weight: 700;margin-top: 0;}
        }
        &:nth-of-type(1) {padding-inline: var(--rset2);}
        @media (width < 1200px) {
            &:nth-of-type(2) {order: -1;}
            & >.photo >img {max-width: 560px;margin-inline: auto;}
        }
        @media (width >= 1200px) {width: calc(50% - var(--offset2)/2);}
    }
}
.b_text >div {background-color: var(--bg6);padding: var(--offset3) var(--rset);
    & >p {font-size: var(--fs_17_16);line-height: var(--fs_24_22);margin: 0;font-weight: 700;}
}

.price_list {display: flex;gap: var(--offset2);margin-top: var(--rset2);flex-direction: column;
    & >div {background-color: var(--bg6);display: flex;gap: var(--offset2);flex-direction: column;padding: var(--offset3) var(--rset);
      & >div >p {margin: 0;}
      & >div:nth-of-type(1) >p {font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;}
      & >div:nth-of-type(2) >p {color: var(--bg5);font-weight: 700;}
      & >div >ul {display: flex;flex-direction: column;gap: var(--offset03);margin: 0;
        & >li {padding-left: 0;font-size: var(--fs_16_15);line-height: var(--fs_22_20);
            &:before {display: none;}
        }
      }
      & .more {margin-top: var(--offset2);}
      @media (width >= 768px) {align-items: center;flex-direction: row;justify-content: space-between;
            & .more {margin-top: 0;}
      }
    }
}
.price_block {margin: var(--offset6) 0 var(--offset4);
    & >div {background-color: var(--bg6);display: flex;gap: var(--offset2);flex-direction: column;padding: var(--offset3) var(--rset);
        & >div:nth-of-type(1) >p {font-size: var(--fs_17_16);line-height: var(--fs_24_22);margin: 0;
            &:first-child {font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;margin-bottom: var(--offset01);}
        }
        & >div:nth-of-type(2) >p {color: var(--bg5);font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;margin: 0;}
        & .more {margin-top: var(--offset2);}
    }
    @media (width >= 768px) {
            & >div {align-items: center;flex-direction: row;justify-content: space-between;
                & >div:nth-of-type(2) {margin-left: auto;}
            }
            & >div >div >.more {margin-top: 0;}
      }
}

.topic {
    &.one_two {row-gap: 0;}
    & >div {position: relative;
        & >h2 {position: relative;z-index: 1;}
        & >p {font-size: var(--fs_18_17);line-height: 1.5rem;position: relative;z-index: 1;}
        & >*:last-child {margin-bottom: 0;}
    }
    &.num >div {counter-reset: counter;
        & >details {counter-increment: counter;display: grid;grid-template-columns: auto 1fr;
            &:before {align-content: center;content: counter(counter) '.';font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;grid-row: span 2;width: 52px;}
        }
        &:first-child:after {background-image: url("/images/topic_num.png");}
    }
    & >div:first-child {display: flex;flex-direction: column;min-height: 480px;
        &:after {background: url("/images/topic.png") no-repeat 0 0 / contain;content: '';aspect-ratio: 16/9;margin-top: var(--offset20);position: relative;width: 120vw;z-index: 0;
            @media (width >= 768px) {width: 135%;}
        }
        @media (width < 768px) {flex-grow: 1;margin-inline: calc(var(--offset2) * -1);padding-inline: var(--offset2);overflow: hidden;}
    }
  @media (width >= 1200px) {
    & >div:first-child:after {position: absolute;left: 0;bottom: calc(var(--rset4)* -1);margin-top: 0;}
  }
}
details {border: 2px solid transparent;padding: var(--offset3) var(--rset);
    &:open {border-color: var(--bg5);background-color: var(--bg6);border-radius: 23px;}
    &:hover:not([open]){ cursor: pointer;
        & >summary {color: var(--tc1);}
    }
    & >summary {font: 500 var(--fs_20_18) / var(--fs_24_22) "Rubik", sans-serif;list-style: none;}
    & >p {font-size: var(--fs_17_16);line-height: var(--fs_24_22);margin: var(--offset0) 0 0;}
}
.quote {background-color: var(--bg6);border: 2px solid var(--bg5);border-radius: 23px;padding: var(--offset3) var(--rset);margin-inline: auto;position: relative;max-width: 480px;
    &:before {background: url("/images/quote.svg") no-repeat 0 0;content: '';height: 14px;width: 34px;position: absolute;left: 28px;top: -14px;}
    & >p >span {color: var(--bg5);font-weight: 700;
        &:last-child {font-size: var(--fs_16_15);line-height: var(--fs_22_20);}
    }
}
.quote_text {text-align: right;margin-top: var(--offset3);
    & >p {margin: 0;
        & >strong {color: var(--bg5);font-weight: 700;}
    }
}
.quote_photo >div >*:last-child {margin-bottom: 0;}
@media (width >= 768px) {
    .quote_photo {justify-content: center;
        & >div:nth-child(3) {width: 480px;}
    }
    .quote:before {left: auto;right: 28px;}
}
@media (width < 1200px) {
    .quote_photo >div >.photo >img {max-width: 560px;margin-inline: auto;}
}
@media (width >= 1200px) {
    .quote_photo >div:nth-child(3) {position: absolute;bottom: 2rem;margin-right: 9rem;}
}
.list_column {position: relative;
    &:before {background: url("/images/moon-bg.png") no-repeat 50% 50% / cover;content: '';position: absolute;}
    & >ul {margin: 0;padding: 0;
        & >li {list-style: none;display: flex;flex-direction: column;gap: var(--offset20) 1rem;font-size: var(--fs_17_16);line-height: var(--fs_24_22);font-weight: 700;
            &:before {align-self: center;background-position: 0 0;background-repeat: no-repeat;content: '';flex: 0 0 auto;height: 24px;width: 24px;}
            &:nth-child(1):before {background-image: url("/images/moon/m1.svg");}
            &:nth-child(2):before {background-image: url("/images/moon/m2.svg");}
            &:nth-child(3):before {background-image: url("/images/moon/m3.svg");}
            &:nth-child(4):before {background-image: url("/images/moon/m4.svg");}
            &:nth-child(5):before {background-image: url("/images/moon/m5.svg");}
            &:nth-child(6):before {background-image: url("/images/moon/m6.svg");}
            &:nth-child(7):before {background-image: url("/images/moon/m7.svg");}
            &:nth-child(8):before {background-image: url("/images/moon/m8.svg");}
        }
    }
    & >:is(.back, .forward) {align-self: center;cursor: pointer;position: relative;height: 46px;text-indent: 100%;white-space: nowrap;overflow: hidden;width: 46px;
        &:before {background-color: var(--bg5);-webkit-mask-image: url("/images/arrow.svg");mask-image: url("/images/arrow.svg");content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) rotate(90deg);transform-origin: center;height: 10px;width: 20px;}
    }
    & .back {transform: rotate(180deg);margin-left: 10px;}
    & .forward {margin-right: 10px;}

    @media (width < 768px) {display: flex;margin-inline: calc(var(--offset2) * -1);padding-top: 460px;justify-content: space-between;
        &:before {height: 460px;top: 0;width: 100vw;}
        & >ul {display: flex;gap: var(--offset2);width: calc(100vw - 112px - var(--offset2)*2);overflow: hidden;
            & >li {flex: 0 0 auto;text-align: center;width: 100%;}
        }
        & >.forward {order: 2;}
    }
    @media (width >= 768px) {
        &:before {inset: 0;}
        & >:is(.back, .forward) {display: none;}
        & >ul {display: grid;grid-auto-flow: column;grid-template-rows: repeat(4, auto);gap: var(--rset2);justify-content: space-between;position: relative;padding: 9vw 0;
            & >li {align-items: center;flex-direction: row;max-width: 280px;
                &:nth-child(n+5) {text-align: right;justify-content: flex-end;
                    &:before {order: 2;}
                }
            }
        }
    }
    @media (width >= 1200px) {
        & >ul >li {max-width: 308px;}
    }
}
/*блог*/
.blog_block {margin: var(--rset2) 0;
    & >div {transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
        & >a {background-color: var(--bg6);align-items: center;color: var(--tc);display: flex;padding: var(--offset3) var(--rset);font-weight: 700;text-decoration: none;height: 100%;min-height: 200px;justify-content: center;text-align: center;}
        &:has(>a:hover) {transform: translateY(-10px) scale(1.02);}
    }
    &.bor >div:not(:has(>a:hover)) {border-color: var(--tc8);}
}

footer {background-color: var(--bg2);padding: var(--rset2) var(--offset2);position: relative;
  &:before {background-color: var(--bg3);content: '';height: 432px;position: absolute;left: 0;right: 0;top: 0;
    @media (width >= 768px) {height: 128px;}
  }
  &:after {background: url("/images/footer.png") no-repeat 0 0 / cover;content: '';height: calc(100% - 432px);max-height: 240px;position: absolute;left: 0;right: 0;top: 432px;
    @media (width >= 768px) {height: calc(100% - 128px);top: 128px;}
  }
  & >div {z-index: 1;}
}
.down_menu {display: flex;gap: var(--offset4) var(--offset2);
    @media (width < 768px) {flex-wrap: wrap;}
}
.down_logo {display: flex;gap: var(--offset2);
    & >div {
        &:first-child {line-height: 0;}
        & >p {font-size: var(--fs_16_15);line-height: var(--fs_22_20);
            &:first-child {font: 500 var(--fs_16_15) / 1.375rem  "Rubik", sans-serif;margin-top: 0;}
        }
        & >p >a {color: var(--tc);text-decoration: none;
            &:hover {color: var(--tc1);}
        }
        @media (width < 768px) {width: 50%;}
    }
    @media (width < 768px) {flex-grow: 1;}
    @media (width >= 768px) {flex-direction: column;gap: var(--offset3);width: calc(100%/3);}
    @media (width >= 900px) {width: 25%;}
}
.down_menu >ul {margin: 0;padding: 0;columns: 2;column-gap: var(--offset2);flex-grow: 1;
    & >li {list-style: none;break-inside: avoid;margin-bottom: var(--offset1);
        & >a {color: var(--tc);font-size: var(--fs_16_15);line-height: var(--fs_22_20);text-decoration: none;}
        & >a:hover {color: var(--tc1);}
    }
    @media (width >= 900px) {columns: 3;}
}
.copyr {margin-top: var(--offset6);display: flex;font-size: var(--fs_16_15);line-height: var(--fs_22_20);justify-content: space-between;align-items: center;gap: var(--offset2);flex-wrap: wrap;
    & >p {margin: 0;}
    & >div {align-items: center;display: flex;gap: var(--offset);
        & >a {line-height: 0;text-decoration: none;}
    }
}
#up {background: var(--bg5) url("/images/arrow.svg") no-repeat 50% 50%;border-radius: 50%;cursor: pointer;height: 46px;position: fixed;bottom: var(--rset0);right: var(--rset0);width: 46px;text-indent: 100%;white-space: nowrap;overflow: hidden;transition: opacity 0.3s, visibility 0.3s;
    &:hover {background-color: var(--tc1);}
}
.cookie {background-color: var(--bg5);border-radius: 23px;position: fixed;bottom: var(--rset0);right: var(--rset0);margin-left: var(--rset0);padding: var(--offset3) var(--rset);max-width: 372px;
    & >p {color: var(--tc2);font-size: var(--fs_17_16);line-height: var(--fs_24_22);margin: 0;
        & >a {color: var(--tc3);text-decoration: underline;}
        & >a:hover {color: var(--tc4);}
    }
}