/* Page-owned styles for Adatvédelem page */
.adatvedelem-main {
    background-color: var(--color-graphite-900);
    color: var(--color-off-white-100);
    overflow-x: hidden;
}

.adatvedelem-container {
    width: 100%;
    max-width: var(--container-max);
    margin-inline: auto;
    padding-inline: var(--container-gutter-mobile);
}

.adatvedelem-section {
    padding-block: var(--space-8);
}

.adatvedelem-section-heading {
    margin-block-end: var(--space-6);
}

.adatvedelem-label {
    color: var(--color-blue-600);
    margin-block-end: var(--space-2);
}

.adatvedelem-h1 {
    border-inline-start: 4px solid var(--color-red-600);
    padding-inline-start: var(--space-4);
    margin-block-end: var(--space-5);
    font-size: clamp(28px, 5vw, 36px);
}

/* Intro section */
.adatvedelem-intro {
    background-color: var(--color-graphite-900);
    background-image:
        linear-gradient(rgba(90, 90, 90, 0.15) 1px, transparent 1px),
        linear-gradient(90deg, rgba(90, 90, 90, 0.15) 1px, transparent 1px);
    background-size: 32px 32px;
}

.adatvedelem-intro-copy {
    max-width: 70ch;
    text-align: start;
}

.adatvedelem-intro-list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-start: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.adatvedelem-intro-list li {
    position: relative;
    padding-inline-start: var(--space-5);
    color: var(--color-off-white-200);
}

.adatvedelem-intro-list li::before {
    content: '\25AA';
    position: absolute;
    left: 0;
    color: var(--color-red-600);
}

/* Controller section */
.adatvedelem-controller {
    background-color: var(--color-off-white-200);
    color: var(--color-graphite-900);
}

.adatvedelem-controller-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}

.adatvedelem-controller-heading h2 {
    color: var(--color-graphite-900);
}

.adatvedelem-controller-card {
    background-color: var(--color-graphite-700);
    color: var(--color-off-white-100);
    border-top: 4px solid var(--color-red-600);
    padding: var(--card-padding-mobile);
    text-align: center;
}

.adatvedelem-controller-card .adatvedelem-card-title {
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 600;
    margin-block-end: var(--space-4);
}

.adatvedelem-controller-list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-start: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    text-align: start;
}

.adatvedelem-controller-list li {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.adatvedelem-mono-inline {
    color: var(--color-blue-600);
    margin-block-end: 0;
}

/* Data collection section */
.adatvedelem-data-collection {
    background-color: var(--color-graphite-900);
}

.adatvedelem-data-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}

.adatvedelem-data-card {
    background-color: var(--color-graphite-700);
    border-top: 4px solid var(--color-red-600);
    padding: var(--card-padding-mobile);
}

.adatvedelem-data-card h3 {
    margin-block-end: var(--space-3);
}

.adatvedelem-card-list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-start: var(--space-3);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.adatvedelem-card-list li {
    position: relative;
    padding-inline-start: var(--space-5);
    color: var(--color-off-white-200);
}

.adatvedelem-card-list li::before {
    content: '\25AA';
    position: absolute;
    left: 0;
    color: var(--color-red-600);
}

/* Cookies section */
.adatvedelem-cookies {
    background-color: var(--color-off-white-200);
    color: var(--color-graphite-900);
}

.adatvedelem-cookies .adatvedelem-section-heading h2 {
    color: var(--color-graphite-900);
}

.adatvedelem-cookies-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}

.adatvedelem-cookie-card {
    background-color: var(--color-graphite-700);
    color: var(--color-off-white-100);
    border-top: 4px solid var(--color-red-600);
    padding: var(--card-padding-mobile);
}

.adatvedelem-cookie-card h3 {
    margin-block-end: var(--space-3);
}

.adatvedelem-cookie-card a {
    color: var(--color-blue-600);
    text-decoration: underline;
}

.adatvedelem-cookie-card a:hover {
    color: var(--color-red-600);
}

/* Legal basis section */
.adatvedelem-legal-basis {
    background-color: var(--color-graphite-900);
}

.adatvedelem-legal-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}

.adatvedelem-legal-card {
    background-color: var(--color-graphite-700);
    border-top: 4px solid var(--color-red-600);
    padding: var(--card-padding-mobile);
}

.adatvedelem-legal-card h3 {
    margin-block-end: var(--space-3);
}

/* Retention section */
.adatvedelem-retention {
    background-color: var(--color-off-white-200);
    color: var(--color-graphite-900);
}

.adatvedelem-retention .adatvedelem-section-heading h2 {
    color: var(--color-graphite-900);
}

.adatvedelem-retention-table-wrapper {
    max-width: 800px;
    margin-inline: auto;
    overflow-x: auto;
}

.adatvedelem-retention-table {
    width: 100%;
    border-collapse: collapse;
    background-color: var(--color-graphite-700);
    color: var(--color-off-white-100);
    border: 1px solid var(--color-graphite-500);
    font-size: 14px;
}

.adatvedelem-retention-table caption {
    color: var(--color-graphite-900);
    text-align: start;
    margin-block-end: var(--space-2);
}

.adatvedelem-retention-table th,
.adatvedelem-retention-table td {
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--color-graphite-500);
    text-align: start;
    vertical-align: top;
}

.adatvedelem-retention-table th {
    background-color: var(--color-graphite-700);
    color: var(--color-off-white-100);
    font-family: var(--font-heading);
    font-weight: 600;
}

.adatvedelem-retention-table td {
    color: var(--color-off-white-200);
}

.adatvedelem-retention-table tbody tr:nth-child(even) {
    background-color: rgba(90, 90, 90, 0.2);
}

/* Rights section */
.adatvedelem-rights {
    background-color: var(--color-graphite-900);
}

.adatvedelem-rights-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
    margin-block-end: var(--space-6);
}

.adatvedelem-right-card {
    background-color: var(--color-graphite-700);
    border-top: 4px solid var(--color-red-600);
    padding: var(--card-padding-mobile);
}

.adatvedelem-right-card h3 {
    font-size: 18px;
    margin-block-end: var(--space-2);
}

.adatvedelem-remedy-box {
    background-color: var(--color-graphite-700);
    border: 1px solid var(--color-red-600);
    border-inline-start: 4px solid var(--color-red-600);
    padding: var(--card-padding-mobile);
    max-width: 800px;
    margin-inline: auto;
}

.adatvedelem-remedy-box h3 {
    margin-block-end: var(--space-3);
}

.adatvedelem-remedy-box a {
    color: var(--color-blue-600);
    text-decoration: underline;
}

.adatvedelem-remedy-box a:hover {
    color: var(--color-red-600);
}

/* Security section */
.adatvedelem-security {
    background-color: var(--color-off-white-200);
    color: var(--color-graphite-900);
}

.adatvedelem-security .adatvedelem-section-heading h2 {
    color: var(--color-graphite-900);
}

.adatvedelem-security-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}

.adatvedelem-security-card {
    background-color: var(--color-graphite-700);
    color: var(--color-off-white-100);
    border-top: 4px solid var(--color-red-600);
    padding: var(--card-padding-mobile);
}

.adatvedelem-security-card h3 {
    margin-block-end: var(--space-3);
}

/* Contact section */
.adatvedelem-contact {
    background-color: var(--color-graphite-900);
}

.adatvedelem-contact-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-5);
}

.adatvedelem-contact-card,
.adatvedelem-links-card {
    background-color: var(--color-graphite-700);
    border-top: 4px solid var(--color-red-600);
    padding: var(--card-padding-mobile);
}

.adatvedelem-contact-card h3,
.adatvedelem-links-card h3 {
    margin-block-end: var(--space-3);
}

.adatvedelem-contact-list,
.adatvedelem-links-list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-start: var(--space-3);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.adatvedelem-contact-list li {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.adatvedelem-links-list a {
    color: var(--color-blue-600);
    text-decoration: underline;
}

.adatvedelem-links-list a:hover {
    color: var(--color-red-600);
}

/* Tablet and desktop breakpoints */
@media (min-width: 768px) {
    .adatvedelem-container {
        padding-inline: var(--container-gutter-desktop);
    }

    .adatvedelem-section {
        padding-block: var(--space-9);
    }

    .adatvedelem-controller-grid {
        grid-template-columns: 1fr 1fr;
        align-items: start;
    }

    .adatvedelem-controller-card {
        padding: var(--card-padding-desktop);
        max-width: 400px;
        margin-inline: auto;
    }

    .adatvedelem-data-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .adatvedelem-data-card {
        padding: var(--card-padding-desktop);
    }

    .adatvedelem-cookies-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .adatvedelem-cookie-card {
        padding: var(--card-padding-desktop);
    }

    .adatvedelem-legal-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .adatvedelem-legal-card {
        padding: var(--card-padding-desktop);
    }

    .adatvedelem-rights-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .adatvedelem-right-card {
        padding: var(--card-padding-desktop);
    }

    .adatvedelem-remedy-box {
        padding: var(--card-padding-desktop);
    }

    .adatvedelem-security-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .adatvedelem-security-card {
        padding: var(--card-padding-desktop);
    }

    .adatvedelem-contact-grid {
        grid-template-columns: 3fr 2fr;
    }

    .adatvedelem-contact-card,
    .adatvedelem-links-card {
        padding: var(--card-padding-desktop);
    }
}

@media (max-width: 767px) {
    .adatvedelem-controller-card {
        text-align: start;
    }

    .adatvedelem-controller-list li {
        flex-direction: row;
        flex-wrap: wrap;
        gap: var(--space-2);
        align-items: baseline;
    }

    .adatvedelem-controller-list .adatvedelem-mono-inline {
        min-width: 80px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .adatvedelem-main *,
    .adatvedelem-main *::before,
    .adatvedelem-main *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}