/* Terms and Conditions page styles */

.terms-page {
    background-color: var(--color-obsidian);
    color: var(--color-warm-ivory);
}

.terms-hero {
    padding-block-start: var(--space-64);
    padding-block-end: var(--space-48);
    border-bottom: 1px solid var(--color-molten-gold);
    background: linear-gradient(180deg, rgba(18, 20, 24, 0.6) 0%, rgba(11, 12, 16, 0.95) 100%);
}

.terms-hero__inner {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    align-items: flex-start;
    max-width: var(--container-max-width);
    margin-inline: auto;
    padding-inline: var(--container-padding-mobile);
}

.terms-hero__eyebrow {
    font-family: var(--font-body);
    font-size: var(--text-caption-size);
    font-weight: var(--text-caption-weight);
    line-height: var(--text-caption-line-height);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--color-molten-gold);
    margin: 0;
}

.terms-hero h1 {
    font-size: var(--text-h1-size);
    line-height: var(--text-h1-line-height);
    letter-spacing: var(--text-h1-letter-spacing);
    font-weight: var(--text-h1-weight);
    color: var(--color-platinum-white);
    margin: 0;
    max-width: 800px;
}

.terms-hero__lead {
    font-size: var(--text-body-size);
    line-height: var(--text-body-line-height);
    color: var(--color-warm-ivory);
    margin: 0;
}

.terms-hero__lead strong {
    color: var(--color-molten-gold);
}

.terms-content {
    max-width: var(--container-max-width);
    margin-inline: auto;
    padding-inline: var(--container-padding-mobile);
    padding-block: var(--space-64);
    display: flex;
    flex-direction: column;
    gap: var(--space-64);
}

.terms-section {
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
    max-width: 800px;
    width: 100%;
}

.terms-section h2 {
    font-size: var(--text-h2-size);
    line-height: var(--text-h2-line-height);
    letter-spacing: var(--text-h2-letter-spacing);
    font-weight: var(--text-h2-weight);
    color: var(--color-platinum-white);
    margin: 0;
    padding-bottom: var(--space-12);
    border-bottom: 1px solid var(--color-smoked-graphite);
}

.terms-section h3 {
    font-size: var(--text-h3-size);
    line-height: var(--text-h3-line-height);
    letter-spacing: var(--text-h3-letter-spacing);
    font-weight: var(--text-h3-weight);
    color: var(--color-platinum-white);
    margin: var(--space-16) 0 0;
}

.terms-section p {
    font-size: var(--text-body-size);
    line-height: var(--text-body-line-height);
    letter-spacing: var(--text-body-letter-spacing);
    color: var(--color-warm-ivory);
    margin: 0;
    max-width: 68ch;
}

.terms-section p strong {
    color: var(--color-platinum-white);
}

.terms-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    max-width: 68ch;
}

.terms-list li {
    position: relative;
    padding-inline-start: var(--space-24);
    font-size: var(--text-body-size);
    line-height: var(--text-body-line-height);
    color: var(--color-warm-ivory);
}

.terms-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.65em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--color-molten-gold);
}

.terms-definition-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    margin: 0;
    padding: 0;
    max-width: 68ch;
}

.terms-definition-item {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding-inline-start: var(--space-16);
    border-left: 1px solid var(--color-burnished-bronze);
}

.terms-definition-item dt {
    font-family: var(--font-body);
    font-size: var(--text-body-size);
    font-weight: 600;
    color: var(--color-platinum-white);
}

.terms-definition-item dd {
    margin: 0;
    font-size: var(--text-body-size);
    line-height: var(--text-body-line-height);
    color: var(--color-warm-ivory);
}

.terms-callout {
    background-color: var(--surface-midnight-charcoal);
    border: 1px solid var(--color-smoked-graphite);
    border-radius: var(--radius-4);
    padding: var(--space-24);
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    max-width: 68ch;
}

.terms-callout__title {
    font-family: var(--font-body);
    font-size: var(--text-small-size);
    font-weight: var(--text-caption-weight);
    line-height: var(--text-small-line-height);
    letter-spacing: var(--text-caption-letter-spacing);
    text-transform: uppercase;
    color: var(--color-molten-gold);
    margin: 0;
}

.terms-callout p {
    margin: 0;
    max-width: none;
}

.terms-callout .terms-list {
    max-width: none;
}

.terms-contact-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    max-width: 68ch;
}

.terms-contact-list li {
    font-size: var(--text-body-size);
    line-height: var(--text-body-line-height);
    color: var(--color-warm-ivory);
}

.terms-contact-label {
    font-weight: 600;
    color: var(--color-platinum-white);
    margin-inline-end: var(--space-8);
}

.terms-section--emerald {
    background-color: rgba(13, 40, 32, 0.35);
    border-radius: var(--radius-4);
    padding: var(--space-32);
    border: 1px solid rgba(13, 40, 32, 0.8);
}

.terms-section--bronze {
    border-inline-start: 2px solid var(--color-burnished-bronze);
    padding-inline-start: var(--space-32);
}

@media (min-width: 768px) {
    .terms-hero {
        padding-block-start: var(--space-96);
        padding-block-end: var(--space-64);
    }

    .terms-hero__inner {
        padding-inline: var(--container-padding-desktop);
    }

    .terms-content {
        padding-inline: var(--container-padding-desktop);
        padding-block: var(--space-96);
        gap: var(--space-96);
    }

    .terms-section {
        gap: var(--space-32);
    }

    .terms-section--emerald {
        padding: var(--space-48);
    }
}

@media (max-width: 767px) {
    .terms-hero h1 {
        font-size: var(--text-h1-size);
    }

    .terms-section--emerald {
        padding: var(--space-24);
    }

    .terms-section--bronze {
        padding-inline-start: var(--space-24);
    }
}

@media (prefers-reduced-motion: reduce) {
    .terms-page,
    .terms-hero,
    .terms-section,
    .terms-callout {
        transition: none;
        animation: none;
    }
}