/* Page-owned styles for Általános Szerződési Feltételek */

.aszf-page {
    --aszf-content-max: 45rem; /* 720px */
    --aszf-copy-max: 42.5rem; /* 680px */
    --aszf-section-gap: var(--space-2xl); /* 96px desktop */
    --aszf-section-gap-mobile: var(--space-xl); /* 64px mobile */
    --aszf-hairline: var(--border-hairline);
    --aszf-hairline-wine: var(--border-hairline-wine);
    --aszf-wine: var(--color-wine);
    --aszf-blood: var(--color-blood);
    --aszf-silver: var(--color-silver);
    --aszf-silver-muted: var(--color-silver-muted);
    --aszf-ash: var(--color-ash);
    --aszf-void: var(--color-void);
    --aszf-obsidian: var(--color-obsidian);
    --aszf-charcoal: var(--color-charcoal);
    --aszf-bone: var(--color-bone);
    --aszf-heading: var(--font-heading);
    --aszf-body: var(--font-body);
    --aszf-radius-control: var(--radius-control);
    --aszf-transition-color: var(--transition-color);
    --aszf-transition-fade: var(--transition-fade);
    --aszf-shadow-focus: var(--shadow-focus);

    background-color: var(--aszf-void);
    color: var(--aszf-silver);
    font-family: var(--aszf-body);
    font-size: var(--text-body-m);
    line-height: var(--leading-body-m);
    letter-spacing: var(--tracking-body-m);
    overflow-x: hidden;
}

/* Hero */
.aszf-hero {
    position: relative;
    padding-block-start: var(--space-3xl);
    padding-block-end: var(--space-2xl);
    background-color: var(--aszf-void);
}

.aszf-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 70% 20%, rgba(110, 15, 26, 0.08), transparent 45%),
        radial-gradient(circle at 30% 80%, rgba(110, 15, 26, 0.04), transparent 40%);
    opacity: 0.9;
}

.aszf-hero__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: var(--aszf-content-max);
    margin-inline: auto;
    padding-inline: var(--container-padding-mobile);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-m);
}

.aszf-marker {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    position: relative;
    margin-block-end: var(--space-xs);
}

.aszf-marker::before,
.aszf-marker::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--aszf-wine);
}

.aszf-marker::before {
    width: 1px;
    height: 1.5rem;
}

.aszf-marker::after {
    width: 1.5rem;
    height: 1px;
}

.aszf-eyebrow {
    font-family: var(--aszf-body);
    font-size: var(--text-label);
    line-height: var(--leading-label);
    letter-spacing: var(--tracking-label);
    text-transform: uppercase;
    color: var(--aszf-wine);
    margin-block-end: var(--space-xs);
}

.aszf-hero h1 {
    font-family: var(--aszf-heading);
    font-size: var(--text-display-l);
    line-height: var(--leading-display-l);
    letter-spacing: var(--tracking-display-l);
    color: var(--aszf-silver);
    font-weight: 500;
    margin-block-end: var(--space-m);
    max-width: 100%;
    text-wrap: balance;
    overflow-wrap: break-word;
}

.aszf-hero__lede {
    display: flex;
    flex-direction: column;
    gap: var(--space-s);
    max-width: var(--aszf-copy-max);
    width: 100%;
}

.aszf-hero__lede p {
    font-size: var(--text-body-m);
    line-height: var(--leading-body-m);
    letter-spacing: var(--tracking-body-m);
    color: var(--aszf-silver-muted);
    margin-block-end: 0;
    max-width: 68ch;
    overflow-wrap: break-word;
}

.aszf-effective-date {
    font-family: var(--aszf-body);
    font-size: var(--text-body-s);
    line-height: var(--leading-body-s);
    letter-spacing: var(--tracking-body-s);
    color: var(--aszf-wine);
    font-weight: 600;
    margin-block-start: var(--space-s);
    padding-block: var(--space-xs);
    border-block-start: var(--aszf-hairline);
    border-block-end: var(--aszf-hairline);
    width: 100%;
    max-width: var(--aszf-copy-max);
}

.aszf-effective-date time {
    color: inherit;
    font-weight: inherit;
}

/* Sections */
.aszf-section {
    position: relative;
    padding-block: var(--aszf-section-gap-mobile);
    background-color: var(--aszf-void);
}

.aszf-section + .aszf-section {
    border-block-start: var(--aszf-hairline);
}

.aszf-section--last {
    padding-block-end: var(--space-3xl);
}

.aszf-section__inner {
    width: 100%;
    max-width: var(--aszf-content-max);
    margin-inline: auto;
    padding-inline: var(--container-padding-mobile);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-m);
}

.aszf-section h2 {
    font-family: var(--aszf-heading);
    font-size: var(--text-display-m);
    line-height: var(--leading-display-m);
    letter-spacing: var(--tracking-display-m);
    color: var(--aszf-silver);
    font-weight: 500;
    margin-block-end: var(--space-s);
    max-width: 100%;
    text-wrap: balance;
    overflow-wrap: break-word;
}

.aszf-copy {
    display: flex;
    flex-direction: column;
    gap: var(--space-m);
    width: 100%;
    max-width: var(--aszf-copy-max);
}

.aszf-copy h3 {
    font-family: var(--aszf-heading);
    font-size: var(--text-heading-s);
    line-height: var(--leading-heading-s);
    letter-spacing: var(--tracking-heading-s);
    color: var(--aszf-silver);
    font-weight: 500;
    margin-block-end: var(--space-xs);
    max-width: 100%;
    text-wrap: balance;
    overflow-wrap: break-word;
}

.aszf-copy p {
    font-size: var(--text-body-m);
    line-height: var(--leading-body-m);
    letter-spacing: var(--tracking-body-m);
    color: var(--aszf-silver-muted);
    margin-block-end: 0;
    max-width: 68ch;
    overflow-wrap: break-word;
}

.aszf-copy > * + * {
    margin-block-start: 0;
}

.aszf-copy h3 + p {
    margin-block-start: var(--space-xs);
}

.aszf-copy p + h3 {
    margin-block-start: var(--space-m);
}

.aszf-copy p + p {
    margin-block-start: var(--space-s);
}

/* Definitions */
.aszf-definitions {
    display: flex;
    flex-direction: column;
    gap: var(--space-m);
    width: 100%;
    max-width: var(--aszf-copy-max);
    margin-block-start: var(--space-s);
}

.aszf-definition {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding-block-end: var(--space-s);
    border-block-end: var(--aszf-hairline);
}

.aszf-definition:last-child {
    border-block-end: none;
    padding-block-end: 0;
}

.aszf-definition dt {
    font-family: var(--aszf-body);
    font-size: var(--text-body-m);
    line-height: var(--leading-body-m);
    letter-spacing: var(--tracking-body-m);
    color: var(--aszf-silver);
    font-weight: 600;
    margin-block-end: 0;
}

.aszf-definition dd {
    font-size: var(--text-body-m);
    line-height: var(--leading-body-m);
    letter-spacing: var(--tracking-body-m);
    color: var(--aszf-silver-muted);
    margin-block-start: 0;
    max-width: 68ch;
    overflow-wrap: break-word;
}

/* List with cross markers */
.aszf-list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-start: var(--space-s);
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    width: 100%;
    max-width: var(--aszf-copy-max);
}

.aszf-list li {
    position: relative;
    padding-inline-start: var(--space-m);
    font-size: var(--text-body-m);
    line-height: var(--leading-body-m);
    letter-spacing: var(--tracking-body-m);
    color: var(--aszf-silver-muted);
    max-width: 68ch;
    overflow-wrap: break-word;
}

.aszf-list li::before {
    content: "+";
    position: absolute;
    left: 0;
    top: 0.1em;
    font-family: var(--aszf-body);
    font-size: var(--text-body-s);
    line-height: var(--leading-body-s);
    color: var(--aszf-wine);
    font-weight: 600;
}

/* Links inside content (if any) */
.aszf-copy a,
.aszf-definition a {
    color: var(--aszf-silver);
    text-decoration: underline;
    text-underline-offset: 0.2em;
    transition: color var(--aszf-transition-color);
}

.aszf-copy a:hover,
.aszf-definition a:hover {
    color: var(--aszf-wine);
}

.aszf-copy a:focus-visible,
.aszf-definition a:focus-visible {
    outline: 2px solid var(--aszf-blood);
    outline-offset: 2px;
}

/* Responsive */
@media (min-width: 48rem) {
    .aszf-hero {
        padding-block-start: var(--space-3xl);
        padding-block-end: var(--space-2xl);
    }

    .aszf-hero__inner,
    .aszf-section__inner {
        padding-inline: var(--container-padding-desktop);
    }

    .aszf-section {
        padding-block: var(--aszf-section-gap);
    }

    .aszf-section--last {
        padding-block-end: var(--space-3xl);
    }

    .aszf-hero h1 {
        font-size: var(--text-display-l);
    }

    .aszf-section h2 {
        font-size: var(--text-display-m);
    }
}

@media (min-width: 64rem) {
    .aszf-hero h1 {
        font-size: clamp(2.5rem, 4vw + 1rem, 3.5rem);
    }
}

@media (max-width: 47.9375rem) {
    .aszf-hero h1 {
        font-size: 2rem;
        line-height: 1.15;
    }

    .aszf-section h2 {
        font-size: 1.75rem;
        line-height: 1.2;
    }

    .aszf-copy h3 {
        font-size: 1.25rem;
        line-height: 1.3;
    }

    .aszf-hero__lede p,
    .aszf-copy p,
    .aszf-definition dd,
    .aszf-list li {
        font-size: var(--text-body-m);
        line-height: var(--leading-body-m);
    }

    .aszf-effective-date {
        font-size: var(--text-body-s);
    }
}

@media (max-width: 29.9375rem) {
    .aszf-hero__inner,
    .aszf-section__inner {
        padding-inline: var(--container-padding-mobile);
    }

    .aszf-hero h1 {
        font-size: 1.75rem;
        line-height: 1.15;
    }

    .aszf-section h2 {
        font-size: 1.5rem;
        line-height: 1.2;
    }

    .aszf-copy h3 {
        font-size: 1.125rem;
        line-height: 1.3;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .aszf-page *,
    .aszf-page *::before,
    .aszf-page *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
