@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

:root {
    --default-color: #fa4d00;
    --default-lighten-color: #0c77e6;
    --default-catifsh-color: rgb(0, 0, 0);
    --default-header-color: #003266;
    --default-footer-color: #04386e;
    --btn-text: #fff;
	  --bs-primary: #1079d7;
  --theme-rounded-button: 8px; /* Пример значения */
  --theme-rounded-section: 16px; /* Пример значения */
  --theme-block-margin-bottom: 24px; /* Пример значения */
  --theme-block-margin-bottom-mob: 16px; /* Пример значения */
  --button_primary_color: #ffffff;
  --button_primary_bg: #FF5722;
  --button_secondary_color: #ffffff;
  --button_secondary_bg: #4f99e9; /* Пример значения */
}

*, :after, :before {
    box-sizing: border-box
}

li, ol, ol[class], ul, ul[class] {
    margin: 0;
    padding: 0
}

blockquote, body, dd, dl, figcaption, figure, h1, h2, h3, h4, li, ol[class], p, ul[class] {
    margin: 0
}

body {
    line-height: 1.5;
    min-height: 100vh;
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed
}

body.-toggle,
html.-toggle {
    overflow: hidden
}

li, ol[class], ul[class] {
    list-style: none
}

a {
    text-decoration: none
}

a:not([class]) {
    -webkit-text-decoration-skip: ink;
    text-decoration-skip-ink: auto
}

img {
    display: block;
    max-width: 100%
}

button, input, select, textarea {
    border: none;
    font: inherit
}

[role=button], button {
    cursor: pointer
}

@media (prefers-reduced-motion:reduce) {
    * {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important
    }
}

body {
    background: #fff;
    color: #000;
    font-family: "Ubuntu", sans-serif;
    font-size: 16px;
    letter-spacing: .5px;
    line-height: 1.4
}

@media (max-width:768px) {
    body {
        font-size: 14px;
        overflow-x: hidden
    }
}

.container {
    margin-left: auto;
    margin-right: auto;
    max-width:1220px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

.header {
    background: var(--default-header-color);
    padding: 24px 0;
}

.header-wrap {
    grid-gap: 20px;
    align-items: center;
    display: grid;
    grid-template-columns: max-content 1fr;
}

.header-logo__img {
    height: auto;
    width: 180px;
}

.menu-wrap {
    grid-gap: 20px;
    align-items: center;
    display: grid;
    grid-template-columns: 1fr max-content max-content;
	z-index:10;
}

.main-nav {
    padding-right: 45px;
    text-align: right;
}

.main-nav__list {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 32px;
}

.nav-item {
    font-size: 16px;
    position: relative;
    font-weight: bold;
}

.nav-item__link, .menu-item > a {
    color: #fff;
}

.main-nav__list li:hover>a {
    color: var(--default-color);

}

.header-lang {
    display: flex;
    align-items: center;
    color: #fff;
}

.btn {
    background: var(--default-color);
    border-radius: 4px;
    font-size: 15px;
    font-weight: 500;
    line-height: 42px;
    text-transform: uppercase;
	width: fit-content;
}

.btn a {
    color: var(--btn-text);
    display: block;
    padding: 0 42px;
    font-weight: bold;   
}

.btn:hover {
    opacity: .86
}

.menu-mob-btn {
    background: var(--default-color) url(../assets/img/mob-menu-icon.svg) no-repeat 50%;
    background-size: 15px;
    border: 1px solid var(--default-color);
    border-radius: 4px;
    display: none;
    height: 42px;
    justify-self: flex-end;
    width: 42px;
}

.menu-mob-btn.-toggle {
    background: var(--default-color) url(../assets/img/mob-menu-close-icon.svg) no-repeat 50%;
    background-size: 15px
}

.main {
    padding: 54px 0;
}

/*POST*/
.post-entry p:not(:last-child) {
    margin-bottom: 24px;
}

.post-entry h1,
.post-entry h2,
.post-entry h3,
.post-entry h4,
.post-entry h5,
.post-entry h6 {
    line-height: 1.2;
    margin-bottom: 14px
}

.post-entry h1 {
    font-size: 32px
}

.post-entry h2 {
    font-size: 28px
}

.post-entry h3 {
    font-size: 24px
}

.post-entry h4 {
    font-size: 20px
}

.post-entry a {
    color: #0855cc
}

.post-entry a:hover {
    color: #0b4e35
}

.post-entry table {
    font-size: 14px;
    margin-bottom: 24px;
    width: 100%
}

.post-entry table tr:first-child {
    background: var(--default-color) !important
}

.post-entry table tr:first-child td {
    color: #fff;
    font-weight: 700
}

.post-entry table tr:nth-child(odd) {
    background: var(--default-lighten-color)
}

.post-entry table tr td,
.post-entry table tr th {
    padding: 16px 12px
}

.post-entry .wp-block-image {
    margin-bottom: 24px
}

.post-entry .wp-block-image img {
	border-radius:15px;
    margin: 0 auto;
}

.post-entry img {
    height: auto !important;
}

.post-entry ol,
.post-entry ul{
    counter-reset: num;
    list-style-type: none;
    margin-bottom: 24px;
    margin-left: 32px
}

.post-entry ol li,
.post-entry ul li{
    margin: 0 0 16px;
    padding: 0;
    position: relative
}

.post-entry ol li:before {
    background: var(--default-color);
    border-radius: 50%;
    color: #fff;
    content: counter(num);
    counter-increment: num;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    left: -32px;
    line-height: 24px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 24px
}

.post-entry ul li:before{
    background: var(--default-color);
    border-radius: 50%;
    color: #fff;
    content: "✔";
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    left: -32px;
    line-height: 24px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 24px
}

.post-entry .btn {
	margin-bottom: 24px;
}

.post-entry .btn a {
	color: #fff;
}

.post-entry blockquote {
    margin-bottom:1.2rem;
    background-color: var(--default-color);
    color: #FFFFFF;
    padding:40px;
    padding-left:80px;
    position: relative;
        border-radius: 8px;
}
.post-entry blockquote::before{
    position: absolute;
    left:20px;
    top:20px;
    width:40px;
    height:40px;
content: url("data:image/svg+xml,%3Csvg fill='%23FFFFFF' width='40px' height='40px' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M464 256h-80v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8c-88.4 0-160 71.6-160 160v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48zm-288 0H96v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8C71.6 32 0 103.6 0 192v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48z'/%3E%3C/svg%3E");
}

@media(max-width:580px){
    .post-entry blockquote {
        padding:24px;
        padding-left:56px;
    }
    .post-entry blockquote::before{
        top:16px;
        left:16px;
        width:24px;
        height:24px;
content: url("data:image/svg+xml,%3Csvg fill='%23FFFFFF' width='24px' height='24px' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M464 256h-80v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8c-88.4 0-160 71.6-160 160v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48zm-288 0H96v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8C71.6 32 0 103.6 0 192v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48z'/%3E%3C/svg%3E");
    }
}

/*AUTHOR*/
.author-block {
    grid-gap: 30px;
    background: #fff;
    border: 1px solid #d8d8d8;
    border-radius: 20px;
    box-shadow: 0 0 16px 0 rgba(0, 0, 0, .078);
    display: grid;
    grid-template-columns: max-content 1fr;
    margin-bottom: 32px;
    padding: 32px
}

@media (max-width:768px) {
    .author-block {
        grid-gap: 20px;
        grid-template-columns: 1fr;
        padding: 20px 16px
    }
}

.author-block .author-block__photo img {
    border-radius: 50%;
    height: 168px;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: 168px
}

.author-block .author-block__top-grid {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr max-content;
    margin-bottom: 20px
}

@media (max-width:768px) {
    .author-block .author-block__top-grid {
        grid-gap: 20px;
        grid-template-columns: 1fr
    }
}

.author-block .author-block__line {
    color: #828282;
    font-size: 18px
}

.author-block .author-block__name {
    color: #2d2d2c;
    font-size: 24px;
    font-weight: 700
}

.author-block .author-block__socials {
    display: flex;
    gap: 10px
}

.author-block .author-block__socials .author-block__socials__item {
    background: #f2f2f2;
    border-radius: 4px;
    display: inline-block;
    height: 32px;
    overflow: hidden;
    width: 32px
}

.author-block .author-block__socials .author-block__socials__item:hover {
    opacity: .86
}

.author-block .author-block__socials .author-block__socials__item i {
    display: inline-block;
    height: 32px;
    width: 32px
}

.author-block .author-block__socials .author-block__socials__item i.icon-fb {
    background: url(../assets/img/icon-fb.svg) no-repeat 50%;
    background-size: 22px
}

.author-block .author-block__socials .author-block__socials__item i.icon-tw {
    background: url(../assets/img/icon-tw.svg) no-repeat 50%;
    background-size: 22px
}

.author-block .author-block__socials .author-block__socials__item i.icon-email {
    background: url(../assets/img/icon-email.svg) no-repeat 50%;
    background-size: 22px
}

.author-block .author-block__text {
    color: #2d2d2c;
    font-size: 18px
}

.author-block .author-block__text p:not(:last-child) {
    margin-bottom: 20px
}

/*FAQ*/
.faq-block {
    margin-bottom: 32px;
    margin-top: 32px
}

.faq-block .faq-block--title {
    color: #000;
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 16px
}

.faq-block .faq-block--subtitle {
    color: #000;
    font-size: 16px;
    margin-bottom: 16px;
    margin-top: -4px
}

.faq-block .faq-block--items .faq-block--items__item:not(:last-child) {
    margin-bottom: 16px
}

.faq-block .faq-block--items .faq-block--items__item .faq-block--items__item--header {
    background: #f7f7f7;
    border: 1px solid var(--default-color);
    border-radius: 4px;
    font-size: 18px;
    font-weight: 700;
    padding: 20px;
    position: relative
}

.faq-block .faq-block--items .faq-block--items__item .title-faq {
    max-width: 80%;
    width: 80%;
	margin-right:55px;
}

.faq-block .faq-block--items .faq-block--items__item .title-faq:after {
    background: var(--default-color) url(../assets/img/icon-arrow-b.svg) no-repeat 50%;
    background-size: 14px;
    border-radius: 4px;
    content: "";
    height: 42px;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    width: 42px
}

.faq-block .faq-block--items .faq-block--items__item .faq-block--items__item--content {
    display: none
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--header {
    background: var(--default-color);
    color: #fff
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--header:after {
    background: var(--default-color) url(../assets/img/icon-arrow-b.svg) no-repeat 50%;
    background-size: 14px;
    transform: translateY(-50%) rotate(-90deg)
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--content {
    display: block;
    padding: 20px
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--content p:not(:last-child) {
    margin-bottom: 8px
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--content a {
    color: #0855cc
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--content a:hover {
    color: #0b4e35
}


/*WP STYLE*/
.wp-block-media-text .wp-block-media-text__media {
    float: right;
    max-width: 50%;
    margin-left: 20px;
    margin-bottom: 20px;
}

.alignright{
    float: right;
    margin-left: 20px;
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .alignright {
        max-width: 100%;
        margin: 16px auto 24px auto;
        float: none;
        order: 2;
    }
}

.alignleft{
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}

.footer {
    background: var(--default-footer-color);
    padding: 42px 0;
    color: #fff;
}

.footer-wrap {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.footer-left {
    width: 40%;
}

.footer-logo {
    display: block;
    width: 100%;
    max-width: 200px;
    margin-bottom: 30px;
}

.footer-left__text {
    font-size: 14px;
    opacity: .5;
    line-height: 150%;
}

.footer-right {
    width: 55%;
}

.footel-menu__list {
    display: block;
    columns: 2;
    margin-bottom: 30px;
}

.footel-menu__list li {
    display: block;
    margin-bottom: 10px;
}

.footel-menu__list li a {
    color: #fff;
    font-size: 15px;
}

.footel-menu__list li a:hover {
    text-decoration: underline;
}

.footer-info {
	display: flex;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding-top: 20px;
}

.footer-info__img {
	margin: 0 auto;
    object-fit: contain;
}

.footer-container {
    display: flex;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    gap: 30px;
    flex-wrap: wrap;
}

.footer-column {
    flex: 1;
    min-width: 200px;
}

.footer-column h3 {
    color: #2f9df2;
    font-size: 18px;
    margin-bottom: 15px;
    text-align: right;
}

.footer-column ul {
    list-style: none;
    padding: 0;
    text-align: right;
}

.footer-column li {
    margin-bottom: 8px;
}

.footer-column a {
    color: white;
    text-decoration: none;
    transition: color 0.3s ease;
    display: inline-block;
}

.footer-column a:hover {
    color: #2f9df2;
}


@media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: stretch;
    }

    .footer-column {
        margin-bottom: 25px;
        padding: 0 10px;
    }
}


/*MOBILE*/
@media (max-width:768px) {
    .menu-mob-btn {
        display: block
    }

    .header-logo__img {
        max-height: 42px;
        max-width: 180px;
        width: auto;
    }

    .menu-wrap {
        grid-gap: 16px;
        background: #000;
        display: none;
        grid-template-columns: 86px 1fr;
        height: calc(100% - 82px);
        left: 0;
        padding: 20px;
        place-content: flex-start;
        position: fixed;
        top: 82px;
        width: 100%;
    }

    .menu-wrap.-toggle {
        display: grid
    }

    .main-nav {
        grid-column: 1 / 3;
        grid-row: 1;
        margin-bottom: 64px;
        padding: 0;
        text-align: left;
        padding-right: 44px;
    }

    .main-nav__list {
        display: block;
    }

    .main-nav__list li:not(:last-child) {
        border-bottom: 1px solid hsla(0, 0%, 100%, .1);
        display: block;
        margin-bottom: 20px;
        padding-bottom: 20px
    }

    .header .btn {
        grid-row: 2;
        text-align: center;
    }

    .header .btn a {
        padding: 0 10px;
    }
}

/*Btn block*/
.btn-block {
	align-items: center;
    display: flex;
    gap: 16px;
    justify-content: center;
    margin-bottom: 16px;
}

.btn-block__link {
	align-items: center;
    background: rgb(254,88,2);
    border-radius: 25px;
    color: #fff!important;
    display: flex;
    flex: 1 0;
    font-size: 16px;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    line-height: 24px;
    max-width: 320px;
    padding: 12px;
    text-decoration: none;
}

.btn-block__link:hover {
   opacity: .86;
}

.btn-block__link svg {
	margin-top: -2px;
}

@media (max-width: 520px) {
	.btn-block {
        flex-direction: column;
		gap: 5px;
    }
	
   .btn-block .btn-block__link {
        max-width: none;
        width: 100%;
    }
}

#toc_container {
  border-radius: 30px;
}
#toc_container p.toc_title+ul.toc_list {
	padding-left: 35px;
}

.toc_list li {
	padding-bottom: 10px!important;
}

.scroll-top{position:fixed;bottom:60px;right:15px;z-index:9;}
.scroll-top__button{border:none;width:40px;height:40px;border-radius:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;}
@media (hover: hover), screen and (min-width: 0\0 ){
.scroll-top__button:hover{-webkit-transform:scale(1.2);-ms-transform:scale(1.2);transform:scale(1.2);opacity:.7;}
}
.scroll-top{bottom:85px;}


.language-switcher {
    position: relative;
    display: flex;
    justify-content: end; /* Это свойство уже логическое, оставляем */
    margin-bottom: 10px;
}

.language-switcher-toggle {
    background-color: #f0f0f0;
    border: 1px solid #ddd;
    border-radius: 25px;
    cursor: pointer;
    padding: 8px 16px;
    display: flex;
    align-items: center;
    transition: background-color 0.2s ease;
}

.language-switcher-toggle:hover {
    background-color: #e0e0e0;
}


.language-switcher .flag-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-inline-end: 10px; 
}

.language-switcher .flag-icon svg {
    width: 24px;
    height: auto;
    border-radius: 3px;
    box-shadow: 0 0 1px rgba(0,0,0,0.5);
}

.language-switcher-toggle .flag-icon svg {
    box-shadow: none;
    width: 20px;
}

.language-switcher-toggle .arrow-down {
    font-size: 10px;
    color: #555;
    transition: transform 0.2s ease;
}

.language-switcher.active .language-switcher-toggle {
    background-color: #e0e0e0;
}

.language-switcher.active .arrow-down {
    transform: rotate(180deg);
}

.language-switcher-dropdown {
    position: absolute;
    top: calc(100% + 5px);
    inset-inline-end: 0; 
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    list-style: none;
    margin: 0;
    padding: 5px 0;
    min-width: 160px;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

.language-switcher.active .language-switcher-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.language-switcher-dropdown li {
    margin: 0;
    padding: 0;
}

.language-switcher-dropdown a {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    text-decoration: none;
    color: #333;
    font-size: 14px;
    white-space: nowrap;
    transition: background-color 0.2s ease;
}

.language-switcher-dropdown a:hover {
    background-color: #f5f5f5;
}

.language-switcher-dropdown a .lang-code {
    font-weight: 500;
}

/* Для выпадания вверх ничего менять не нужно, bottom - это логическое свойство по вертикали */
.language-switcher.drop-up .language-switcher-dropdown {
    top: auto;
    bottom: calc(100% + 5px);
    transform: translateY(-10px);
}

.language-switcher.drop-up.active .language-switcher-dropdown {
    transform: translateY(0);
}

/* Дублирующиеся стили из вашего кода убраны для чистоты, 
   основные исправления выше. */

/* Уменьшаем флаг в главной кнопке для лучшего вида */
.language-switcher-toggle .flag-icon svg {
    width: 20px;
}

/* Отдельный стиль для иконки глобуса, чтобы убрать тень.
   Срабатывает только когда есть класс .is-globe */
.language-switcher-toggle .flag-icon.is-globe svg {
    box-shadow: none;
}

.scroll-top{position:fixed;bottom:60px;right:15px;z-index:9;}
.scroll-top__button{border:none;width:40px;height:40px;border-radius:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;}
@media (hover: hover), screen and (min-width: 0\0 ){
.scroll-top__button:hover{-webkit-transform:scale(1.2);-ms-transform:scale(1.2);transform:scale(1.2);opacity:.7;}
}
.scroll-top{bottom:85px;}

.welcome-section .btn { display: inline-flex; justify-content: center; align-items: center; padding: 10px 40px; text-decoration: none; font-weight: 600; font-size: 15px; text-align: center; border: none; border-radius: var(--theme-rounded-button); color: var(--button_primary_color) !important; background: var(--button_primary_bg) !important; box-shadow: 0px 0px 8px 0px #000000; }
.btn--secondary { color: var(--button_secondary_color) !important; background: var(--button_secondary_bg) !important; }

.welcome-section {
  --welcome_apps_color: #ffffff;
  --welcome_apps_background: radial-gradient(#17527e 0%, #17527e 100%);
  --welcome_promocode_background: #fa4f00;

  display: grid;
  grid-template-columns: 1fr 282px;
  gap: 24px;
  margin-bottom: var(--theme-block-margin-bottom);
  margin-top: 30px;
}

.app-card {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  min-height: 300px;
  padding: 32px;
  color: var(--welcome_apps_color);
  background: var(--welcome_apps_background);
  border-radius: var(--theme-rounded-section);
  text-align: left;
  overflow: hidden;
}

.app-card__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  max-width: 462px;
  width: 100%;
  z-index: 1;
}

.app-card__subtitle { display: flex; flex-direction: column; gap: 8px; font-size: 12px; font-style: italic; margin: 0; }
.app-card__subtitle span:first-child { opacity: 0.5; }
.app-card h1 { font-size: 36px; line-height: 1.1; margin-bottom: 0; }
.app-card__description { margin: 0; }
.app-card__buttons { display: flex; gap: 12px; width: 100%; }

.app-card__buttons .btn {
  flex: 1;
  gap: 14px;
  padding: 8px 16px;
  font-size: 12px;
  line-height: normal;
  text-align: left;
}

.app-card__buttons svg { width: 36px; height: 36px; flex-shrink: 0; }
.app-card__image { position: absolute; bottom: 0; right: 0; max-width: 340px; height: auto; pointer-events: none; }

/* Правая карточка (Промокод) */
.promo-card { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 12px; padding: 12px; background-color: var(--welcome_promocode_background); border-radius: var(--theme-rounded-section); overflow: hidden; color: #fff; }
.promo-card__content { display: flex; flex-direction: column; justify-content: space-between; height: 100%; z-index: 1; }
.promo-card__bonus { flex-grow: 1; display: flex; align-items: center; font-size: 28px; line-height: normal; }
.promo-card__actions { display: flex; flex-direction: column; gap: 12px; }

.copy-block { position: relative; height: 45px; border: 1px dashed #fff; background-color: rgba(0, 0, 0, 0.15); border-radius: var(--theme-rounded-button); }
.copy-block input { width: 100%; height: 100%; padding: 0 40px 0 10px; background-color: transparent; border: none; outline: none; box-shadow: none; color: #fff; font-size: 0.9rem; font-weight: 600; text-align: center; cursor: pointer; }
.copy-icon { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); width: 24px; height: 24px; background: url('../img/copy.svg') no-repeat center; cursor: pointer; }
.promo-card__image { position: absolute; bottom: -18px; right: 0; width: 196px; height: auto; pointer-events: none; }
.app-card__buttons a svg { display: flex; width: 36px; height: 36px; justify-content: center; align-items: center; fill: var(--button_primary_color); }

/* Адаптивность */
@media (max-width: 1130px) {
  .app-card { justify-content: center; text-align: center; }
  .app-card__content { align-items: center; }
  .app-card__image { display: none; }
}

@media (max-width: 991px) {
  .welcome-section { grid-template-columns: 1fr; gap: 12px; margin-bottom: var(--theme-block-margin-bottom-mob); }
}

@media (max-width: 767px) {
  .app-card { padding: 12px; padding-top: 150px; text-align: center; }
  .app-card__content { gap: 12px; }
  .app-card h1 { font-size: 28px; }
  .app-card__image { display: block; top: -20px; left: 50%; transform: translateX(-50%); bottom: auto; right: auto; width: auto; height: 160px; }
  .promo-card { align-items: center; text-align: center; }
  .promo-card__bonus { font-size: 23px; justify-content: center; }
  .promo-card__actions { width: 100%; max-width: 300px; }
}

/* Стили для копирования */
.copy-block, .copy-icon { transition: all 0.3s ease; }
.copy-block.is-copied { border-color: #4CAF50; border-style: solid; }
.copy-block.is-copied .copy-icon { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234CAF50' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E"); }
.copy-block.is-copied input { color: #4CAF50; }

[dir="rtl"] .welcome-section {
  direction: rtl;
}

[dir="rtl"] .app-card {
  text-align: right; 
}

[dir="rtl"] .app-card__content {
   align-items: flex-start;
}

[dir="rtl"] .app-card__buttons .btn {
  flex-direction: row-reverse; 
  text-align: right; 
}

[dir="rtl"] .app-card__image {
  right: auto;
  left: 0;
}

[dir="rtl"] .promo-card__image {
  right: auto;
  left: 0;
}

[dir="rtl"] .promo-card__bonus {
    text-align: right;
}

[dir="rtl"] .copy-block input {
  padding: 0 10px 0 40px; 
}

[dir="rtl"] .copy-icon {
  right: auto;
  left: 10px;
}


@media (max-width: 1130px) {
  [dir="rtl"] .app-card__content {
    align-items: center;
  }
}

@media (max-width: 991px) {
 
  [dir="rtl"] .welcome-section {
    direction: ltr; 
  }
	
  [dir="rtl"] .app-card {
	  text-align: center; 
	}
	
	 [dir="rtl"] .app-card__image {
		right: auto;
		left: 50%;
	}
	.promo-card__bonus {
		padding:25px;
	}
	.promo-card__content {
		align-items:center;
	}
}

.background-block {
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.text-image {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    padding: 32px;
    background-color: #17527e;
    border-radius: 16px;
    margin-bottom: 20px;
    color: #fff;
}

.text-image h2,
.text-image h3 {
    margin-bottom: 20px;
    color: #fff;
}

.text-image__content p {
	margin-bottom: 10px;
}

.text-image__content a {
	color: var(--button_primary_bg);
	font-weight:bold;
}

.text-image__content a:hover {
	text-decoration:underline;
}

.text-image__content {
    margin: 10px 0;
    line-height: 1.6;
}


.text-image__content ul {
    list-style: none;
    padding-left: 1.5em;
    margin: 15px 0;
}

.text-image__content ul li {
    position: relative;
    padding-left: 1.2em;
    margin-bottom: 0.8em;
    line-height: 1.6;
}


.text-image__content ul li::before {
    content: "•";
    color: #ff5722;
    font-size: 1.4em;
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(2px);
}

/* Для RTL (арабский) — меняем позицию маркера */
[dir="rtl"] .text-image__content ul,
body.rtl .text-image__content ul {
    padding-right: 1.5em;
    padding-left: 0;
}

[dir="rtl"] .text-image__content ul li,
body.rtl .text-image__content ul li {
    padding-right: 1.2em;
    padding-left: 0;
    text-align: right;
}

[dir="rtl"] .text-image__content ul li::before {
    right: 0;
    left: auto;
    transform: translateY(2px);
}

/* Опционально: кастомные маркеры (иконки или стрелки) */
.text-image__content ul li::before {
    content: "▹";
    font-weight: bold;
    font-size: 1.2em;
}

.text-image__content ol {
    counter-reset: list-counter;
    margin: 15px 0;
    padding-left: 1.5em;
}

[dir="rtl"] .text-image__content ol {
    padding-right: 1.5em;
    padding-left: 0;
}

.text-image__content ol li {
    list-style: none;
    counter-increment: list-counter;
    position: relative;
    padding-left: 2em;
    margin-bottom: 0.8em;
}

[dir="rtl"] .text-image__content ol li {
    padding-right: 2em;
    padding-left: 0;
    text-align: right;
}

.text-image__content ol li::before {
    content: counter(list-counter);
    position: absolute;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    background-color: #ff5722;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8em;
    font-weight: bold;
}

[dir="rtl"] .text-image__content ol li::before {
    right: 0;
    left: auto;
}

.text-image__content blockquote {
    border-left: 4px solid #ff5722;
    margin: 20px 0;
    padding: 15px 20px;
    background-color: rgba(255, 255, 255, 0.1);
    font-style: italic;
    color: #fff;
}

.text-image__content table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    background-color: rgba(255, 255, 255, 0.05);
}

.text-image__content table th,
.text-image__content table td {
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 10px;
    color: #fff;
    text-align: left;
}

.text-image__content table th {
    background-color: #ff5722;
    color: white;
}

.text-image__item--content {
    overflow: hidden;
}

.text-image__item--image {
    display: flex;
    align-items: center;
    justify-content: center;
}

.text-image.reversed .text-image__item--content {
    order: 2;
}

.text-image.reversed .text-image__item--image {
    order: 1;
}

.text-image__item_img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

/* Кнопка по центру */
.text-image__button-wrapper {
    text-align: center;
    margin-top: 20px;
}

.text-image__button {
    display: inline-block;
    padding: 12px 24px;
    background-color: #ff5722;
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

.text-image__button:hover {
    background-color: #e64a19;
}

/* Без изображения — одна колонка */
.text-image.no-image {
    grid-template-columns: 1fr;
    text-align: center;
}

.text-image.no-image .text-image__button-wrapper {
    text-align: center;
}

/* Адаптив */
@media (max-width: 1024px) {
    .text-image {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 24px;
    }

    .text-image.reversed .text-image__item--image {
        order: 2;
    }

    .text-image.no-image .text-image__button-wrapper {
        text-align: center;
    }
	
	.text-image__content p {
		font-size:16px;
	}
}