@font-face {
    font-family: "Caveat";
    src: url("../../mp/fonts/Caveat-VariableFont_wght.ttf") format("truetype");
    font-weight: 400 700;
    font-style: normal;
    font-display: swap;
}

.policy-paper {
    --pp-paper: #f3ecd8;
    --pp-paper-edge: #ddd0a4;
    --pp-ink: #232f5c;
    --pp-ink-soft: #4a5580;
    --pp-margin: rgb(118 87 255 / 55%);
    --pp-rule: rgb(96 121 173 / 40%);
    --pp-line: 2.04rem;
    --pp-shadow: 0 30px 60px -20px rgb(23 22 42 / 22%), 0 2px 0 var(--pp-paper-edge);
    --pp-glow: rgb(118 87 255 / 10%);
    position: relative;
    padding: 2.5rem 0 3rem;
}

.dark .policy-paper {
    --pp-paper: #ece2c4;
    --pp-paper-edge: #cdbd85;
    --pp-shadow: 0 34px 70px -18px rgb(0 0 0 / 55%), 0 2px 0 var(--pp-paper-edge);
    --pp-glow: rgb(118 87 255 / 16%);
}

.policy-paper::before {
    content: "";
    position: absolute;
    inset: -4rem -2rem auto -2rem;
    height: 22rem;
    background: radial-gradient(ellipse at 50% 30%, var(--pp-glow), transparent 70%);
    pointer-events: none;
    z-index: 0;
}

@keyframes policy-paper-unroll {
    0% {
        transform: rotate(-16deg) scale(0.88);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    65% {
        transform: rotate(4deg) scale(1.015);
    }
    85% {
        transform: rotate(-1.6deg) scale(0.998);
    }
    100% {
        transform: rotate(-0.35deg) scale(1);
    }
}

.policy-paper__sheet {
    position: relative;
    z-index: 1;
    max-width: 50.5rem;
    margin: 0 auto;
    padding: 3.25rem clamp(1.75rem, 5vw, 4.5rem) 3.5rem;
    background-color: var(--pp-paper);
    box-shadow: var(--pp-shadow);
    transform-origin: 50% 8%;
    animation: policy-paper-unroll 1.1s cubic-bezier(.22, .68, .32, 1) both;
    clip-path: polygon(
        0% 14px, 4% 4px, 8% 16px, 12% 6px, 16% 18px, 20% 3px, 24% 13px,
        28% 7px, 32% 17px, 36% 2px, 40% 12px, 44% 8px, 48% 16px, 52% 4px,
        56% 14px, 60% 6px, 64% 18px, 68% 3px, 72% 13px, 76% 7px, 80% 16px,
        84% 4px, 88% 14px, 92% 8px, 96% 17px, 100% 6px,
        100% calc(100% - 10px), 96% calc(100% - 4px), 92% calc(100% - 14px),
        88% calc(100% - 6px), 84% calc(100% - 16px), 80% calc(100% - 3px),
        76% calc(100% - 12px), 72% calc(100% - 7px), 68% calc(100% - 15px),
        64% calc(100% - 4px), 60% calc(100% - 13px), 56% calc(100% - 8px),
        52% calc(100% - 17px), 48% calc(100% - 5px), 44% calc(100% - 14px),
        40% calc(100% - 7px), 36% calc(100% - 16px), 32% calc(100% - 3px),
        28% calc(100% - 12px), 24% calc(100% - 8px), 20% calc(100% - 15px),
        16% calc(100% - 4px), 12% calc(100% - 13px), 8% calc(100% - 6px),
        4% calc(100% - 16px), 0% calc(100% - 9px)
    );
}

.policy-paper__sheet::before {
    content: "";
    position: absolute;
    inset: 0;
    left: clamp(2.6rem, 6.5vw, 5.2rem);
    top: 6.5rem;
    width: 1.5px;
    background: var(--pp-margin);
    pointer-events: none;
}

.policy-paper__title,
.policy-paper__body {
    position: relative;
    z-index: 1;
    color: var(--pp-ink) !important;
}

.policy-paper__title,
.policy-paper__meta,
.policy-paper__body,
.policy-paper__body * {
    font-family: "Caveat", "Segoe Print", "Comic Sans MS", cursive !important;
}

.policy-paper__title {
    font-weight: 700;
    font-size: clamp(1.9rem, 3.2vw, 2.6rem);
    line-height: 1.3;
    text-align: center;
    margin: 0 0 0.4rem;
    transform: rotate(-0.4deg);
}

.policy-paper__meta {
    text-align: center;
    font-size: 1.15rem;
    font-style: italic;
    color: var(--pp-ink-soft) !important;
    margin: 0 0 2.25rem;
}

.policy-paper__body {
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.7;
}

.policy-paper__body .privacy-content__subtitle {
    font-weight: 700;
    font-size: 1.55rem;
    color: var(--pp-ink) !important;
    margin: 2.1rem 0 0.4rem;
    display: inline-block;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='14' viewBox='0 0 240 14'><path d='M2 9 Q 20 2, 40 8 T 80 7 T 120 9 T 160 6 T 200 9 T 238 7' fill='none' stroke='%237657ff' stroke-width='4' stroke-linecap='round' opacity='0.55'/></svg>");
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-size: 100% 10px;
    padding-bottom: 6px;
}

.policy-paper__body .privacy-content__list {
    list-style: none;
    margin: 0 0 0.75rem;
    padding: 0;
}

.policy-paper__body .privacy-content__list {
    color: var(--pp-ink) !important;
}

.policy-paper__body .privacy-content__list-item {
    position: relative;
    padding-left: 1.5rem;
    margin: 0.55rem 0;
    color: var(--pp-ink) !important;
    background-image: repeating-linear-gradient(
        to bottom,
        transparent 0,
        transparent calc(var(--pp-line) - 1.5px),
        var(--pp-rule) calc(var(--pp-line) - 1.5px),
        var(--pp-rule) var(--pp-line)
    );
    background-size: 100% var(--pp-line);
    background-repeat: repeat-y;
    background-position: 0 0;
}

.policy-paper__body .privacy-content__list-item::before {
    content: "\2013";
    position: absolute;
    left: 0.1rem;
    color: var(--pp-margin) !important;
    font-weight: 700;
}

.policy-paper__body ul.list-disc {
    list-style: none;
    margin: 0.5rem 0 0.5rem 0.25rem;
    padding: 0;
}

.policy-paper__body ul.list-disc li {
    position: relative;
    padding-left: 1.4rem;
    margin: 0.4rem 0;
    color: var(--pp-ink-soft) !important;
}

.policy-paper__body ul.list-disc li::before {
    content: "\2013";
    position: absolute;
    left: 0.1rem;
    color: var(--pp-ink-soft) !important;
}

.policy-paper__body a {
    color: #5638df !important;
    text-decoration: underline wavy rgb(118 87 255 / 45%) 1.5px;
    text-underline-offset: 3px;
}

@media (max-width: 640px) {
    .policy-paper__sheet {
        padding: 2.5rem 1.35rem 2.75rem;
    }

    .policy-paper__body {
        font-size: 1.1rem;
        --pp-line: 1.87rem;
    }

    .policy-paper__sheet::before,
    .policy-paper__sheet::after {
        left: 1.6rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .policy-paper__sheet {
        animation: none;
        transform: rotate(-0.35deg);
    }
}