.legal-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    padding: var(--space-40) var(--space-50) var(--space-80);
    width: 100%;
}

header {
    top: 36px;
}

body.auth-layout .legal-page {
    min-height: calc(100dvh - 120px);
}

.legal-page .page-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: var(--space-60);
    max-width: 800px;
    text-align: center;
}

.legal-page .page-header .h1 {
    margin-bottom: var(--space-16);
    color: var(--primary-text-main);
}

.legal-page .page-header .subtitle {
    color: var(--primary-text-secondary);
}

.legal-page .page-header .last-updated {
    display: flex;
    gap: var(--space-8);
    align-items: center;
    margin-top: var(--space-20);
    padding: var(--space-10) var(--space-20);
    color: var(--primary-main);
    background: var(--primary-main-10);
    border-radius: var(--radius-full);
}

.legal-content {
    padding: var(--space-50) var(--space-60);
    width: 100%;
    max-width: 900px;
    background: var(--background-surface);
    border-radius: var(--radius-l);
    box-shadow: var(--shadow);
}

.legal-content h2 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-28);
    font-weight: 700;
    line-height: 130%;
    display: flex;
    align-items: center;
    gap: var(--space-10);
    color: var(--primary-text-main);
    margin: var(--space-40) var(--space-0) var(--space-20) var(--space-0);
}

.legal-content h2:first-child {
    margin-top: var(--space-0);
}

.legal-content h3 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-22);
    font-weight: 700;
    line-height: 130%;
    color: var(--primary-text-main);
    margin: var(--space-30) var(--space-0) var(--space-16) var(--space-0);
}

.legal-content h4 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-18);
    font-weight: 700;
    line-height: 140%;
    color: var(--primary-text-main);
    margin: var(--space-24) var(--space-0) var(--space-12) var(--space-0);
}

.legal-content p {
    font-family: var(--font-family-base);
    font-size: var(--font-size-16);
    font-weight: 400;
    line-height: 170%;
    color: var(--primary-text-main-80);
    margin-bottom: var(--space-16);
}

.legal-content p:last-child {
    margin-bottom: var(--space-0);
}

.legal-content a {
    color: var(--primary-main);
    text-decoration: none;
    transition: color var(--transition-fast), background-size var(--transition-fast);
    background-image: linear-gradient(var(--primary-main), var(--primary-main));
    background-size: 0% 1px;
    background-position: left bottom;
    background-repeat: no-repeat;
}

.legal-content ul,
.legal-content ol {
    font-family: var(--font-family-base);
    font-size: var(--font-size-16);
    font-weight: 400;
    line-height: 170%;
    color: var(--primary-text-main-80);
    margin: var(--space-16) var(--space-0);
    padding-left: var(--space-24);
}

.legal-content ul {
    display: flex;
    flex-direction: column;
    gap: var(--space-0);
}

.legal-content ul li {
    position: relative;
    margin-bottom: var(--space-12);
    padding-left: var(--space-20);
    width: 100%;
}

.legal-content ul li::before {
    content: '';
    position: absolute;
    left: var(--space-0);
    top: var(--space-10);
    width: 6px;
    height: 6px;
    background: var(--primary-main);
    border-radius: var(--radius-full);
}

.legal-content ol {
    list-style-type: none;
    counter-reset: legal-counter;
}

.legal-content ol li {
    position: relative;
    margin-bottom: var(--space-12);
    padding-left: var(--space-32);
    counter-increment: legal-counter;
}

.legal-content ol li::before {
    position: absolute;
    left: var(--space-0);
    font-family: var(--font-family-display);
    content: counter(legal-counter) '.';
    color: var(--primary-main);
}

.legal-content ul ul,
.legal-content ol ol,
.legal-content ul ol,
.legal-content ol ul {
    margin: var(--space-12) var(--space-0);
}

.legal-content strong {
    font-weight: 600;
    color: var(--primary-text-main);
}

.legal-content em {
    font-style: italic;
}

.legal-content .highlight-block {
    margin: var(--space-24) var(--space-0);
    padding: var(--space-20) var(--space-24);
    background: var(--primary-main-5);
    border-left: 4px solid var(--primary-main);
    border-radius: 0 var(--radius-m) var(--radius-m) 0;
}

.legal-content .highlight-block p {
    margin-bottom: var(--space-0);
    color: var(--primary-text-main);
}

.legal-content .info-block {
    display: flex;
    gap: var(--space-16);
    margin: var(--space-24) var(--space-0);
    padding: var(--space-20) var(--space-24);
    background: var(--blue-main-5);
    border: 1px solid var(--blue-main-25);
    border-radius: var(--radius-m);
}

.legal-content .info-block .icon-wrapper {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--blue-main-15);
    border-radius: var(--radius-s);
}

.legal-content .info-block .icon-wrapper .icon {
    background-color: var(--blue-main);
}

.legal-content .info-block p {
    margin-bottom: var(--space-0);
    color: var(--blue-text-main);
}

.legal-content .warning-block {
    display: flex;
    gap: var(--space-16);
    margin: var(--space-24) var(--space-0);
    padding: var(--space-20) var(--space-24);
    background: var(--orange-main-5);
    border: 1px solid var(--orange-main-25);
    border-radius: var(--radius-m);
}

.legal-content .warning-block .icon-wrapper {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--orange-main-15);
    border-radius: var(--radius-s);
}

.legal-content .warning-block .icon-wrapper .icon {
    background-color: var(--orange-main);
}

.legal-content .warning-block p {
    margin-bottom: var(--space-0);
    color: var(--orange-text-main);
}

.legal-content table {
    overflow: hidden;
    margin: var(--space-24) var(--space-0);
    width: 100%;
    border: 1px solid var(--primary-text-main-10);
    border-radius: var(--radius-m);
    border-collapse: collapse;
}

.legal-content table th,
.legal-content table td {
    font-family: var(--font-family-base);
    font-size: var(--font-size-16);
    line-height: 150%;
    padding: var(--space-16) var(--space-20);
    text-align: left;
    border-bottom: 1px solid var(--primary-text-main-10);
}

.legal-content table th {
    font-weight: 600;
    color: var(--primary-text-main);
    background: var(--primary-main-5);
}

.legal-content table td {
    font-weight: 400;
    color: var(--primary-text-main-80);
    background: var(--background-surface);
}

.legal-content table tr:last-child td {
    border-bottom: none;
}

.legal-content table tr td {
    transition: background-color var(--transition-fast);
}

.legal-content dl {
    margin: var(--space-24) var(--space-0);
}

.legal-content dt {
    font-family: var(--font-family-display);
    font-size: var(--font-size-14);
    font-weight: 600;
    color: var(--primary-text-secondary);
    margin-bottom: var(--space-4);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.legal-content dd {
    font-family: var(--font-family-base);
    font-size: var(--font-size-18);
    font-weight: 400;
    color: var(--primary-text-main);
    margin-bottom: var(--space-20);
    padding-bottom: var(--space-20);
    border-bottom: 1px solid var(--primary-text-main-10);
}

.legal-content dd:last-child {
    margin-bottom: var(--space-0);
    padding-bottom: var(--space-0);
    border-bottom: none;
}

.legal-content hr {
    margin: var(--space-40) var(--space-0);
    height: 1px;
    background: var(--primary-text-main-10);
    border: none;
}

.legal-content .section-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: var(--space-0) var(--space-10);
    background: var(--primary-main);
    color: var(--text-inverted);
    font-family: var(--font-family-display);
    font-size: var(--font-size-14);
    font-weight: 700;
    line-height: 1;
    border-radius: var(--radius-s);
    margin-right: var(--space-12);
}

.legal-page .back-link {
    display: inline-flex;
    align-items: center;
    gap: var(--space-8);
    margin-bottom: var(--space-40);
    color: var(--primary-text-secondary);
    font-family: var(--font-family-base);
    font-size: var(--font-size-16);
    font-weight: 500;
    text-decoration: none;
    transition: color var(--transition-fast), transform var(--transition-fast);
}

.legal-page .back-link .icon {
    transform: rotate(90deg);
    transition: background-color var(--transition-fast);
}

.legal-content .contact-info {
    margin-top: var(--space-40);
    padding-top: var(--space-40);
    border-top: 1px solid var(--primary-text-main-10);
}

.legal-content .contact-info h3 {
    margin-top: var(--space-0);
}

@media (max-width: 1024px) {
    .legal-page {
        padding: var(--space-30) var(--space-30) var(--space-60);
    }

    .legal-page .page-header {
        margin-bottom: var(--space-40);
    }

    .legal-page .page-header .h1 {
        font-size: var(--font-size-38);
    }

    .legal-content {
        padding: var(--space-40) var(--space-40);
    }

    .legal-content h2 {
        margin: var(--space-32) var(--space-0) var(--space-16) var(--space-0);
        font-size: var(--font-size-24);
    }

    .legal-content h3 {
        margin: var(--space-24) var(--space-0) var(--space-14) var(--space-0);
        font-size: var(--font-size-20);
    }

    .legal-content h4 {
        font-size: var(--font-size-17);
    }

    .legal-content p,
    .legal-content ul,
    .legal-content ol {
        font-size: var(--font-size-15);
        line-height: 160%;
    }

    .legal-content table th,
    .legal-content table td {
        padding: var(--space-14) var(--space-16);
        font-size: var(--font-size-15);
    }

    #burger-menu .caption-page {
        text-align: center;
    }
}

@media (max-width: 480px) {
    .legal-page {
        padding: var(--space-20) var(--space-16) var(--space-50);
    }

    #burger-menu .caption-page {
        text-align: center;
    }

    .legal-page .page-header {
        margin-bottom: var(--space-30);
    }

    .legal-page .page-header .h1 {
        font-size: var(--font-size-28);
    }

    .legal-page .page-header .subtitle {
        font-size: var(--font-size-14);
    }

    .legal-page .page-header .last-updated {
        padding: var(--space-8) var(--space-16);
        font-size: var(--font-size-13);
    }

    .legal-page .back-link {
        margin-bottom: var(--space-24);
        font-size: var(--font-size-14);
    }

    .legal-content {
        padding: var(--space-24) var(--space-20);
        border-radius: var(--radius-m);
    }

    .legal-content h2 {
        margin: var(--space-28) var(--space-0) var(--space-14) var(--space-0);
        font-size: var(--font-size-20);
    }

    .legal-content h3 {
        margin: var(--space-20) var(--space-0) var(--space-12) var(--space-0);
        font-size: var(--font-size-18);
    }

    .legal-content h4 {
        margin: var(--space-18) var(--space-0) var(--space-10) var(--space-0);
        font-size: var(--font-size-16);
    }

    .legal-content p,
    .legal-content ul,
    .legal-content ol {
        font-size: var(--font-size-14);
        line-height: 160%;
    }

    .legal-content ul li,
    .legal-content ol li {
        margin-bottom: var(--space-10);
    }

    .legal-content .highlight-block,
    .legal-content .info-block,
    .legal-content .warning-block {
        margin: var(--space-20) var(--space-0);
        padding: var(--space-16) var(--space-18);
    }

    .legal-content .info-block,
    .legal-content .warning-block {
        flex-direction: column;
        gap: var(--space-12);
    }

    .legal-content table {
        display: block;
        overflow-x: auto;
    }

    .legal-content table th,
    .legal-content table td {
        padding: var(--space-12) var(--space-14);
        font-size: var(--font-size-14);
        white-space: nowrap;
    }

    .legal-content dl dt {
        font-size: var(--font-size-12);
    }

    .legal-content dl dd {
        margin-bottom: var(--space-16);
        padding-bottom: var(--space-16);
        font-size: var(--font-size-16);
    }

    .legal-content hr {
        margin: var(--space-30) var(--space-0);
    }

    .legal-content .section-number {
        margin-right: var(--space-10);
        height: 28px;
        min-width: 28px;
        font-size: var(--font-size-13);
    }
}

@media print {
    .legal-page {
        padding: var(--space-20);
    }

    .legal-content {
        border: 1px solid var(--neutral-stroke);
        box-shadow: none;
    }

    .legal-page .back-link,
    header,
    footer {
        display: none;
    }
}

.legal-content .copy-value,
.legal-content .phone-copy,
.legal-content .email-copy {
    display: inline-flex;
    gap: var(--space-8);
    align-items: center;
    overflow: visible;
    background-image: none;
}

@media (hover: hover) {
    .legal-content a:hover {
        background-size: 100% 1px;
    }

    .legal-content .copy-value:hover,
    .legal-content .phone-copy:hover,
    .legal-content .email-copy:hover {
        background-size: 0% 1px;
    }

    .legal-content table tr:hover td {
        background: var(--primary-main-5);
    }

    .legal-page .back-link:hover {
        color: var(--primary-main);
        transform: translateX(-5px);
    }

    .legal-page .back-link:hover .icon {
        background-color: var(--primary-main);
    }
}