/* ============================================
   TERMS & PRIVACY POLICY STYLES
   Based on Figma Design (node-id=726-12899)
   ============================================ */

/* Wrapper for entire page content */
.terms-privacy-wrapper {
    width: 100%;
    background: #FFFFFF;
}

/* Section Container */
.terms-privacy-section {
    width: 100%;
    padding: 80px 20px;
    display: flex;
    justify-content: center;
}

/* Content Container - Max width 1144px as per Figma */
.terms-privacy-container {
    width: 100%;
    max-width: 1144px;
}

/* ============================================
   TYPOGRAPHY STYLES FROM FIGMA
   ============================================ */

/* Main H2 Headings (Privacy Policy, Terms of Service) - Costaline Thin 64px */
.terms-privacy-container h2 {
    font-family: 'Costaline', serif;
    font-size: 64px;
    font-weight: 100;
    line-height: 1.7;
    color: #181818;
    margin: 0 0 80px 0;
}

/* Strong tags inside H2 (for "Terms of Service") */
.terms-privacy-container h2 strong {
    font-family: 'Costaline', serif;
    font-size: 64px;
    font-weight: 100;
    line-height: 1.7;
    color: #181818;
    font-style: normal;
}

/* Paragraphs - General Sans Variable 18px */
.terms-privacy-container p {
    font-family: 'General Sans Variable', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    color: #181818;
    margin: 0 0 24px 0;
}

/* Remove extra margin after the main heading */
.terms-privacy-container h2+p {
    margin-top: 0;
}

/* Lists - General Sans Variable 18px */
.terms-privacy-container ul {
    font-family: 'General Sans Variable', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    color: #181818;
    margin: 16px 0 24px 0;
    padding-left: 24px;
    list-style-type: disc;
}

.terms-privacy-container li {
    margin-bottom: 8px;
    padding-left: 4px;
}

.terms-privacy-container li:last-child {
    margin-bottom: 0;
}

/* Links - Brown color as per Figma */
.terms-privacy-container a {
    color: #833C1E;
    text-decoration: underline;
    transition: color 200ms ease;
    text-underline-offset: 2px;
}

.terms-privacy-container a:hover {
    color: #5a2a14;
}

/* ============================================
   DIVIDER STYLES
   ============================================ */

.divider-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
}

.divider-wrapper picture {
    width: 100%;
    max-width: 1440px;
    display: block;
}

.divider-img {
    width: 100%;
    height: auto;
    display: block;
}

/* ============================================
   RESPONSIVE STYLES
   ============================================ */

/* Tablet (1024px and below) */
@media (max-width: 1024px) {
    .terms-privacy-section {
        padding: 60px 40px;
    }

    .terms-privacy-container h2,
    .terms-privacy-container h2 strong {
        font-size: 48px;
        margin-bottom: 60px;
    }

    .terms-privacy-container p,
    .terms-privacy-container ul {
        font-size: 16px;
    }
}

/* Mobile (768px and below) */
@media (max-width: 768px) {
    .terms-privacy-section {
        padding: 48px 20px;
    }

    .terms-privacy-container h2,
    .terms-privacy-container h2 strong {
        font-size: 32px;
        margin-bottom: 48px;
        line-height: 1.5;
    }

    .terms-privacy-container p,
    .terms-privacy-container ul {
        font-size: 14px;
        line-height: 1.5;
    }

    .terms-privacy-container ul {
        padding-left: 20px;
    }

    .terms-privacy-container p {
        margin-bottom: 16px;
    }

    .terms-privacy-container ul {
        margin: 12px 0 16px 0;
    }

    .terms-privacy-container li {
        margin-bottom: 6px;
    }
}

/* Responsive Styles */

/* Tablet */
@media (max-width: 1024px) {
    .terms-privacy-section {
        padding: 60px 80px;
    }

    .terms-privacy-heading {
        font-size: 48px;
    }

    .terms-privacy-content {
        font-size: 16px;
    }

    .terms-privacy-content h2 {
        font-size: 16px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .terms-privacy-section {
        padding: 40px 20px;
    }

    .terms-privacy-container {
        gap: 56px;
    }

    .terms-privacy-heading {
        font-size: 32px;
        text-align: center;
    }

    .terms-privacy-content {
        font-size: 14px;
    }

    .terms-privacy-content h2 {
        font-size: 14px;
        margin: 20px 0 10px 0;
    }

    .terms-privacy-content p {
        margin: 0 0 14px 0;
    }

    .terms-privacy-content ul {
        margin: 0 0 14px 0;
        padding-left: 20px;
    }

    .terms-privacy-content li {
        margin-bottom: 6px;
    }
}