/* Адаптивы */
html {
    height: auto;
    overflow-y: auto;
    overflow-x: hidden;
}

:root {
    --body-height: auto;
  }

.body {
    background-image: url("../images/posts-bg.989c276d5f28.webp");
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
    min-height: 100vh;
    min-height: calc(var(--vh) * 100);
    height: auto;

    overflow-y: auto;
}

.body::before {
    display: none;
}

.container {
    display: flex; /* Адаптивы */
    min-height: 100vh;
    min-height: calc(var(--vh) * 100);
}

.modal {
    display: none;
}

.post {
    width: 95vw;
    max-width: 1096px;

    margin: 0 auto;
    margin-top: 48px;

    background-color: #fff;

    border-radius: 30px;

    padding: 6.4rem;

    /* Задаем переменную для позиционирования */
    --bg-position-y: 0px;

    /*background-image: url("../images/post-header.12f537ae5af7.png");*/
    background-image: url("../images/post-header.7cffe8c10633.webp");
    background-repeat: no-repeat;
    background-size: 100%, auto;
    background-position: center var(--bg-position-y);
}

.post.agreement {
    padding: 0;
    font-family: "Noto Sans", sans-serif; 
    /*font-family: 'Noto Sans Gunjala Gondi';*/
    background-image: none;
}

.agreement .post__header {
    padding: 4rem 6.4rem 0;
    background: center / cover no-repeat url("../images/post-header.7cffe8c10633.webp");
    border-radius: 30px;
}

.agreement .post__header-content {
    position: relative;
    top: 2.4rem;
    margin: 0;
}

.agreement .post__title {
    margin: 0;
}

.agreement .post__content {
    padding: 7.2rem 12.8rem 6.4rem;
}


.post__header-content {
    padding: 6.4rem;

    margin: 0 0 4.8rem 0;

    width: 100%;

    border-radius: 30px;
    box-shadow: 0 4px 32px 0 rgba(0, 0, 0, 0.1);

    background-color: #fff;

    /*min-height: 350px;*/
}

.post__title,
.post__title-input {
    font-size: 6rem;
    font-weight: 400;
    line-height: 6.6rem;

    color: rgba(34, 34, 34, 1);

    margin-bottom: 2.4rem;
}

.post__title {
    text-align: center;
}

.post__title-input{
    width: 100%;
    border: none;
    border-bottom: 1px solid #000;
}

.post__title-input::placeholder{
    color: rgba(34, 34, 34, .3);
}

.post__image-label {
    display: flex;
    flex-direction: column;

    font-size: 2.4rem;

    color: rgba(34, 34, 34, 1);
}

.post__image-label input {
    margin-top: 15px;
}

#new-post-editor {
    margin-bottom: 15px;
}

.new-post__submit {
    margin: 0 auto;
}

.post__info {
    font-size: 1.4rem;
    /*font-size: 1.4em;*/
    font-weight: 400;
    line-height: 1.4rem;

    color: rgba(173, 172, 199, 1);

    margin-bottom: 3.2rem;
    
    text-align: center;
}

.post__first-paragraph {
    /*font-size: 1.8rem;*/
    font-weight: 500;
    line-height: 150%;

    color: rgba(34, 34, 34, 1);

    width: 100%;

    text-align: center;
}

.post__content {
    width: 100%;

    padding: 0 6.4rem;
}

.post__content p{

    /*font-size: 1.8rem;*/
    font-weight: 400;
    line-height: 150%;

    color: rgba(107, 107, 129, 1)
}
/*
.post__content h2 {
    font-size: 2.4rem;
    font-weight: 500;
    line-height: 3.12rem;

    color: rgba(34, 34, 34, 1);
}*/


.post__content img {
   /* max-width: 100%;*/ /* Ограничение ширины изображений */
   /* height: auto; */   /* Сохраняет пропорции */
    border-radius: 30px;
    /*display: block;    */    /* Переводит <img> в блочный элемент */
    /*margin: 20px auto; */    /* Центрирует и добавляет отступ сверху/снизу */
}



/* Исправление проблемы с белым текстом body */
.post {
    --text-color: initial;
    /*color: initial !important;*/
    color: #333 !important;
    font-size: 1.8rem;
    width: 100%; /* Адаптив */
}

.post__edit {
    font-size: 1.4rem;
    font-weight: 400;
    /* line-height: 1.4rem; */
    color: darkmagenta;
    margin-bottom: 2.2rem;
    text-align: center;
}

.post__edit_link {
    font-size: 1.4rem;
    font-weight: 400;
    color: darkmagenta;
    padding-right: 20px;
}

/* Адаптивы */
@media (max-width: 743px) {
    .post {
        padding: 4rem;
    }

    .post__header-content {
        padding: 3.2rem;
    }
    
    .post__title {
        font-size: 4rem;
        line-height: 4rem;
    }

    .post__info {
        font-size: 1.6rem;
        margin-bottom: 2.8rem;
    }

    .post__edit_link {
        font-size: 1.8rem;
    }

    .post__first-paragraph {
        font-size: 2rem;
    }

    .post__content {
        padding: 0;
        font-size: 2rem;
    }

    .agreement .post__header {
        padding: 2.4rem 4rem 0;
    }
    
    .agreement .post__header-content {
        top: 1.6rem;
        padding: 3.2rem;
    }
    
    .agreement .post__content {
        padding: 5.6rem 6.4rem 4rem;
    }
}

@media (max-width: 480px) {
    .post {
        padding: 2.4rem;
        margin-top: 32px;
    }

    .post__header-content {
        padding: 3.2rem;
        margin-bottom: 4rem;
        border-radius: 24px;
    }

    .post__title {
        margin-bottom: 2.8rem;
    }

    .post__first-paragraph {
        line-height: 130%;
    }

    .agreement .post__header {
        padding: .8rem 2.4rem 0;
    }
    
    .agreement .post__header-content {
        top: 1.6rem;
        padding: 2.4rem;
        border-radius: 24px;
    }
    
    .agreement .post__content {
        padding: 4.8rem 3.2rem 2.4rem;
    }

    .post__content p {
        line-height: 130%;
    }
}

@media (max-width: 376px) {
    .agreement .post__title {
        font-size: 3.2rem;
    }
}


/* .agreement .post__header-content {
    min-height: 30rem;
    display: flex;
    justify-content: center;  
    align-items: center;     
} */

.agreement h1 { 
    /* font-weight: 800 !important; */
    text-align: center; 
} 

.agreement .post__content p:not(:last-child) {
    margin-bottom: 20px;
    font-size: 2.0rem;
    font-weight: 400;
}

.agreement .chapter {
    font-weight: 800 !important;
    text-align: center;
    /* margin-top: 10px;
    margin-bottom: 10px;*/
}

.image-style-align-left {
  float: left;
  margin-right: 1em;
  margin-top: 20px;
  margin-bottom: 20px;
}

.image-style-align-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}

.image-style-align-center img {
  display: inline-block;
  max-width: 100%;
  height: auto;
}

.image-style-align-right {
  float: right;
  margin-left: 1em;
  margin-top: 20px;
  margin-bottom: 20px;
}