/* ==================================================
   LEGAL PAGES (/terms-conditions, /privacy-policy, /refund, /shipping, /return, /sitemap) — home-page design.
   Shell: landing/partials/legal-page. Same layout as the old policy pages: a slim title row, then one
   full-width card with the whole text, compact and readable. Base design in home-v2.css.
   ================================================== */

.lg-page { font-family: 'Inter', sans-serif; }
.lg-hero { padding-bottom: 48px; }

/* title row */
.lg-hero .f2h-wrap { padding-top: 8px; }
/* title row sits inside the card as its header band */
.lg-head { display: flex; align-items: center; gap: 18px; margin: 0 0 28px; padding: 0 0 24px; border-bottom: 1px solid #EEF0F4; text-align: left; }
.lg-head__icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 56px; width: 56px; height: 56px; border-radius: 16px; background: var(--pv-soft, #F4F3FF); border: 1px solid var(--pv-soft-border, #E9E3FD); color: var(--pv-accent, #7F56D9); }
.lg-head__icon svg { width: 30px; height: 30px; }
.lg-head .f2h-hero__title { margin: 0; font-size: clamp(26px, 3vw, 34px); line-height: 1.15; }
.lg-head__intro { margin: 6px 0 0; font-size: 14.5px; line-height: 20px; color: var(--f2h-muted); }
.lg-updated { margin: 4px 0 0; font-size: 13px; font-weight: 500; color: var(--f2h-muted); }
.lg-updated time { color: var(--f2h-ink); font-weight: 600; }

/* ---------- the policy card: full width, compact document typography ---------- */
.lg-card {
    padding: 40px 56px 44px;
    border-radius: 20px;
    background: #FFFFFF;
    border: 1px solid #EEF0F4;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 10px 28px rgba(16, 24, 40, 0.05);
    font-size: 15px;
    line-height: 1.65;
    color: #344054;
}
.lg-card > :first-child { margin-top: 0; }
.lg-card > :last-child { margin-bottom: 0; }

.lg-card h2 {
    margin: 26px 0 8px;
    font-size: 16.5px;
    line-height: 24px;
    font-weight: 700;
    color: var(--f2h-ink);
    scroll-margin-top: 96px;
}
.lg-card h2 + p, .lg-card h2 + ul, .lg-card h2 + ol { margin-top: 0; }

.lg-card p { margin: 0 0 12px; }

/* lists: real markers in the page colour, tight spacing like a contract */
.lg-card ul, .lg-card ol { margin: 0 0 12px; padding-left: 24px; }
.lg-card ul { list-style: disc; }
.lg-card ol { list-style: decimal; }
.lg-card ul ul { list-style: circle; }
.lg-card li { margin: 0 0 5px; padding-left: 2px; }
.lg-card li > ul, .lg-card li > ol { margin: 5px 0 2px; }
.lg-card li::marker { color: var(--pv-accent, #7F56D9); font-weight: 600; }

.lg-card a { color: var(--pv-accent, #7F56D9); font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.lg-card a:hover, .lg-card a:focus { color: var(--pv-accent-dark, #6941C6); text-decoration: underline; text-underline-offset: 2px; }
.lg-card strong, .lg-card b { color: var(--f2h-ink); font-weight: 700; }

.lg-card table { width: 100%; border-collapse: collapse; margin: 0 0 14px; font-size: 14px; }
.lg-card th, .lg-card td { padding: 8px 10px; border: 1px solid #EEF0F4; text-align: left; vertical-align: top; }
.lg-card th { background: #F8F9FC; font-weight: 600; color: var(--f2h-ink); }

@media (max-width: 1024px) {
    .lg-card { padding: 30px 32px 34px; }
}
@media (max-width: 767px) {
    .lg-hero { padding-bottom: 28px; }
    .lg-head { flex-direction: column; align-items: center; gap: 12px; margin-bottom: 20px; padding-bottom: 18px; text-align: center; }
    .lg-head__icon { flex-basis: 52px; width: 52px; height: 52px; }
    .lg-card { padding: 22px 16px 24px; font-size: 14.5px; }
    .lg-card h2 { margin-top: 22px; }
    .lg-card ul, .lg-card ol { padding-left: 18px; }
    .lg-card table { display: block; overflow-x: auto; }
}
