.legal-accordion {
    width: 100%;
    max-width: 855px;
    margin: 0 auto;
	overflow: hidden;

    font-family: Arial, sans-serif;
    color: #3d454a;
	box-shadow: 10px 7px 16px rgba(35, 48, 55, .18);
	border-radius: 18px;
}


/* ========================================
   ITEM
   ======================================== */

.legal-accordion__item {
    overflow: visible;
	border-bottom: #E4F5F3 1px solid;
    background: #f7fcfe;    
}
.legal-accordion__item:hover {
	position: relative;
    z-index: 1; /* поднимает hover-элемент над соседями */
    box-shadow: 0 10px 12px -8px rgba(0, 0, 0, 0.35);   
}
.legal-accordion__item:first-child {
	border-radius: 18px 18px 0 0;
}
.legal-accordion__item:last-child {
	border-radius: 0 0 18px 18px;
}


/* ========================================
   HEADER
   ======================================== */

.legal-accordion__header {
    min-height: 86px;

    padding: 0 30px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    box-sizing: border-box;

    background: #f9fcfd;

    cursor: pointer;

    user-select: none;
}

.legal-accordion__title {
    font-size: 24px;
    line-height: 1.25;
    font-weight: 400;
}


/* ========================================
   ARROW
   ======================================== */

.legal-accordion__arrow {
    width: 32px;
    height: 32px;

    flex: 0 0 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-left: 20px;

    transition: transform .3s ease;
}

.legal-accordion__arrow svg {
    width: 22px;
    height: 22px;

    fill: none;

    stroke: #858d90;
    stroke-width: 1.7;

    stroke-linecap: round;
    stroke-linejoin: round;
}

.legal-accordion__item.is-open
.legal-accordion__arrow {
    transform: rotate(180deg);
}


/* ========================================
   BODY
   ======================================== */

.legal-accordion__body {
    display: none;

    background: #effaff;
}

.legal-accordion__item.is-open
.legal-accordion__body {
    display: block;
}


/* ========================================
   Обычное содержимое
   ======================================== */

.legal-accordion__content {
    padding: 30px;

    font-size: 18px;
    line-height: 1.5;
}


/* ========================================
   FILES
   ======================================== */

.legal-accordion__files {
    background: #effaff;
}


/* ========================================
   FILE
   ======================================== */

.legal-file {
    min-height: 100px;

    padding: 0 30px;

    display: flex;
    align-items: center;

    box-sizing: border-box;

    border-top: 1px solid #dceff5;

    color: #3d454a;
    text-decoration: none;

    transition:
        background-color .2s ease,
        color .2s ease;
}

.legal-file:first-child {
    border-top: 0;
}


/* ========================================
   ИКОНКА ФАЙЛА
   ======================================== */

.legal-file__icon {
    width: 56px;
    height: 60px;

    flex: 0 0 56px;

    display: flex;
    align-items: center;
    justify-content: center;
}


/*
 * Само изображение.
 *
 * Можно использовать SVG, PNG, WebP и т.д.
 */

.legal-file__icon img {
    display: block;

    width: 46px;
    height: 52px;
	border-radius: 0px;
	box-shadow: none;
    object-fit: contain;
}
.legal-file__action img {
	border-radius: 0px;
	box-shadow: none;	
}


/* ========================================
   INFO
   ======================================== */

.legal-file__info {
    min-width: 0;

    flex: 1;

    display: flex;
    flex-direction: column;

    margin-left: 25px;
}

.legal-file__name {
    margin-bottom: 5px;

	font-family: Roboto;
	font-weight: 400;
	font-style: Regular;
	font-size: 20px;
	line-height: 36px;

    color: #424a4f;

}

.legal-file__size {
    font-size: 14px;
    line-height: 1.2;

    color: #c9d4d8;
}


/* ========================================
   ACTION
   ======================================== */

.legal-file__action {
    width: 32px;
    height: 32px;

    flex: 0 0 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-left: 20px;

    color: #858d90;
}

.legal-file__action svg {
    /*width: 23px;
    height: 23px;*/

    fill: none;

    stroke: currentColor;
    /*stroke-width: 1.7;*/

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* ========================================
   HOVER
   ======================================== */

.legal-file:hover {
    background: #e8f8fc;
}

.legal-file:hover .legal-file__name,
.legal-file:hover .legal-file__action {
    color: #13b8c0;
}
.legal-file__descr {
	line-height: 27px;
	margin-top: 8px;
    font-size: 14px;
    
}

/* ========================================
   MOBILE
   ======================================== */

@media (max-width: 600px) {

    .legal-accordion__header {
        min-height: 70px;

        padding: 0 20px;
    }

    .legal-accordion__title {
        font-size: 20px;
    }

    .legal-file {
        min-height: 85px;

        padding: 0 20px;
    }

    .legal-file__icon {
        width: 50px;
        height: 55px;

        flex-basis: 50px;
    }

    .legal-file__icon img {
        width: 42px;
        height: 48px;
    }

    .legal-file__info {
        margin-left: 15px;
    }

    .legal-file__name {
        font-size: 17px;
    }

    .legal-file__size {
        font-size: 13px;
    }

    .legal-file__action {
        margin-left: 10px;
    }
}