/*
|--------------------------------------------------------------------------
| MKGO - Privacy Policy
|--------------------------------------------------------------------------
|
| File:
| /assets/css/pages/privacy.css
|
| Privacy-specific styling only.
|
| The general policy layout remains owned by:
| /assets/css/pages/policy.css
|
*/


/*
|--------------------------------------------------------------------------
| Privacy Page
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-main {
    --privacy-slate: #0f172a;
    --privacy-text: #475569;
    --privacy-muted: #64748b;
    --privacy-border: #e2e8f0;
    --privacy-border-strong: #cbd5e1;
    --privacy-surface: #ffffff;
    --privacy-surface-alt: #f8fafc;
}


/*
|--------------------------------------------------------------------------
| Hero
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-hero {
    position: relative;

    overflow: hidden;
}


.privacy-policy-page .policy-hero::after {
    content: "";

    position: absolute;

    top: -190px;
    right: -160px;

    width: 480px;
    height: 480px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(15, 23, 42, 0.065) 0%,
            rgba(15, 23, 42, 0) 70%
        );

    pointer-events: none;
}


.privacy-policy-page .policy-hero > * {
    position: relative;
    z-index: 1;
}


/*
|--------------------------------------------------------------------------
| Privacy Policy Content
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content {
    color: var(--privacy-text);
}


.privacy-policy-page .policy-content > *:first-child {
    margin-top: 0;
}


.privacy-policy-page .policy-content > *:last-child {
    margin-bottom: 0;
}


/*
|--------------------------------------------------------------------------
| Section Headings
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content h2 {
    position: relative;

    margin-top: 48px;
    margin-bottom: 18px;

    padding-top: 20px;

    border-top:
        1px solid
        var(--privacy-border);

    color: var(--privacy-slate);

    scroll-margin-top: 120px;
}


.privacy-policy-page .policy-content h2:first-child {
    margin-top: 0;
    padding-top: 0;

    border-top: 0;
}


.privacy-policy-page .policy-content h2::before {
    content: "";

    position: absolute;

    top: -1px;
    left: 0;

    width: 48px;
    height: 2px;

    border-radius: 999px;

    background: var(--privacy-slate);
}


.privacy-policy-page
.policy-content
h2:first-child::before {
    display: none;
}


.privacy-policy-page .policy-content h3 {
    margin-top: 30px;
    margin-bottom: 12px;

    color: var(--privacy-slate);

    scroll-margin-top: 120px;
}


.privacy-policy-page .policy-content h4 {
    margin-top: 24px;
    margin-bottom: 10px;

    color: var(--privacy-slate);

    scroll-margin-top: 120px;
}


/*
|--------------------------------------------------------------------------
| Paragraphs
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content p {
    line-height: 1.78;
}


.privacy-policy-page
.policy-content
p + p {
    margin-top: 14px;
}


/*
|--------------------------------------------------------------------------
| Lists
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content ul,
.privacy-policy-page .policy-content ol {
    display: grid;

    gap: 9px;

    margin-top: 16px;
    margin-bottom: 22px;

    padding-left: 24px;
}


.privacy-policy-page .policy-content li {
    padding-left: 4px;

    color: var(--privacy-text);

    line-height: 1.72;
}


.privacy-policy-page
.policy-content
li::marker {
    color: var(--privacy-slate);

    font-weight: 700;
}


/*
|--------------------------------------------------------------------------
| Links
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content a {
    color: var(--privacy-slate);

    font-weight: 700;

    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}


.privacy-policy-page .policy-content a:hover {
    text-decoration-thickness: 2px;
}


.privacy-policy-page
.policy-content
a:focus-visible {
    outline: 2px solid var(--privacy-slate);
    outline-offset: 3px;

    border-radius: 3px;
}


/*
|--------------------------------------------------------------------------
| Strong Text
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content strong {
    color: var(--privacy-slate);

    font-weight: 750;
}


/*
|--------------------------------------------------------------------------
| Tables
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content table {
    width: 100%;

    margin: 26px 0;

    border-spacing: 0;
    border-collapse: separate;

    overflow: hidden;

    border:
        1px solid
        var(--privacy-border);

    border-radius: 12px;

    background: var(--privacy-surface);
}


.privacy-policy-page .policy-content th,
.privacy-policy-page .policy-content td {
    padding: 14px 16px;

    border-right:
        1px solid
        var(--privacy-border);

    border-bottom:
        1px solid
        var(--privacy-border);

    text-align: left;
    vertical-align: top;

    line-height: 1.6;
}


.privacy-policy-page
.policy-content
th:last-child,

.privacy-policy-page
.policy-content
td:last-child {
    border-right: 0;
}


.privacy-policy-page
.policy-content
tr:last-child
td {
    border-bottom: 0;
}


.privacy-policy-page .policy-content th {
    background: var(--privacy-surface-alt);

    color: var(--privacy-slate);

    font-size: 0.82rem;
    font-weight: 750;
}


.privacy-policy-page .policy-content td {
    color: var(--privacy-text);

    font-size: 0.86rem;
}


/*
|--------------------------------------------------------------------------
| Blockquotes
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content blockquote {
    margin: 26px 0;

    padding: 20px 22px;

    border-left: 3px solid var(--privacy-slate);

    background: var(--privacy-surface-alt);

    color: var(--privacy-text);
}


.privacy-policy-page
.policy-content
blockquote
> *:first-child {
    margin-top: 0;
}


.privacy-policy-page
.policy-content
blockquote
> *:last-child {
    margin-bottom: 0;
}


/*
|--------------------------------------------------------------------------
| Horizontal Rules
|--------------------------------------------------------------------------
*/

.privacy-policy-page .policy-content hr {
    margin: 38px 0;

    border: 0;
    border-top:
        1px solid
        var(--privacy-border);
}


/*
|--------------------------------------------------------------------------
| Privacy Information Boxes
|--------------------------------------------------------------------------
|
| These classes are optional. If the managed Privacy Policy HTML later
| contains these classes, they will automatically receive the styling.
|
*/

.privacy-policy-page .privacy-notice,
.privacy-policy-page .privacy-important,
.privacy-policy-page .privacy-example,
.privacy-policy-page .privacy-data-note {
    margin: 26px 0;

    padding: 20px 22px;

    border:
        1px solid
        var(--privacy-border);

    border-radius: 12px;

    background: var(--privacy-surface-alt);
}


.privacy-policy-page .privacy-important {
    border-left:
        4px solid
        var(--privacy-slate);
}


.privacy-policy-page .privacy-data-note {
    background: #ffffff;
}


.privacy-policy-page .privacy-notice > *:first-child,
.privacy-policy-page .privacy-important > *:first-child,
.privacy-policy-page .privacy-example > *:first-child,
.privacy-policy-page .privacy-data-note > *:first-child {
    margin-top: 0;
}


.privacy-policy-page .privacy-notice > *:last-child,
.privacy-policy-page .privacy-important > *:last-child,
.privacy-policy-page .privacy-example > *:last-child,
.privacy-policy-page .privacy-data-note > *:last-child {
    margin-bottom: 0;
}


/*
|--------------------------------------------------------------------------
| Generated Section Anchors
|--------------------------------------------------------------------------
|
| privacy.js adds IDs and this marker to policy headings.
|
*/

.privacy-policy-page
.policy-content
[data-privacy-section] {
    position: relative;
}


.privacy-policy-page
.policy-content
[data-privacy-section].is-privacy-section-active {
    color: var(--privacy-slate);
}


/*
|--------------------------------------------------------------------------
| Privacy Section Link
|--------------------------------------------------------------------------
|
| JS adds a small # anchor beside h2 headings.
|
*/

.privacy-policy-page .privacy-section-anchor {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-left: 8px;

    color: #94a3b8;

    text-decoration: none;

    font-size: 0.78em;
    font-weight: 700;

    opacity: 0;

    transform: translateY(-1px);

    transition:
        opacity 0.18s ease,
        color 0.18s ease;
}


.privacy-policy-page
.policy-content
h2:hover
.privacy-section-anchor,

.privacy-policy-page
.policy-content
h2:focus-within
.privacy-section-anchor {
    opacity: 1;
}


.privacy-policy-page
.privacy-section-anchor:hover {
    color: var(--privacy-slate);
}


/*
|--------------------------------------------------------------------------
| Highlighted Hash Section
|--------------------------------------------------------------------------
*/

.privacy-policy-page
.policy-content
.privacy-hash-highlight {
    animation:
        privacy-section-highlight
        1.35s ease;
}


@keyframes privacy-section-highlight {

    0% {
        background:
            rgba(15, 23, 42, 0.08);
    }

    100% {
        background:
            transparent;
    }

}


/*
|--------------------------------------------------------------------------
| Sidebar - Active Privacy Link
|--------------------------------------------------------------------------
*/

.privacy-policy-page
.policy-sidebar
a[href*="privacy.php"] {
    color: #0f172a;

    font-weight: 750;
}


/*
|--------------------------------------------------------------------------
| Responsive Tables
|--------------------------------------------------------------------------
*/

@media (max-width: 760px) {

    .privacy-policy-page .policy-content table {
        display: block;

        overflow-x: auto;

        white-space: nowrap;

        -webkit-overflow-scrolling: touch;
    }


    .privacy-policy-page .policy-content h2 {
        margin-top: 38px;

        scroll-margin-top: 100px;
    }


    .privacy-policy-page .policy-content h3,
    .privacy-policy-page .policy-content h4 {
        scroll-margin-top: 100px;
    }


    .privacy-policy-page .privacy-section-anchor {
        opacity: 1;
    }

}


/*
|--------------------------------------------------------------------------
| Small Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 520px) {

    .privacy-policy-page .policy-content h2 {
        margin-top: 34px;
        margin-bottom: 15px;

        padding-top: 17px;
    }


    .privacy-policy-page .policy-content ul,
    .privacy-policy-page .policy-content ol {
        padding-left: 20px;
    }


    .privacy-policy-page .policy-content th,
    .privacy-policy-page .policy-content td {
        padding: 12px 14px;
    }


    .privacy-policy-page .privacy-notice,
    .privacy-policy-page .privacy-important,
    .privacy-policy-page .privacy-example,
    .privacy-policy-page .privacy-data-note {
        padding: 17px 18px;
    }

}


/*
|--------------------------------------------------------------------------
| Reduced Motion
|--------------------------------------------------------------------------
*/

@media (prefers-reduced-motion: reduce) {

    .privacy-policy-page .privacy-section-anchor {
        transition: none;
    }


    .privacy-policy-page
    .policy-content
    .privacy-hash-highlight {
        animation: none;
    }

}