/* Privacy policy, terms of use and contact pages. */
.page { min-height: 100vh; display: flex; flex-direction: column; }
.page main { flex: 1; }

.legal-hero { background-color: var(--navy); background-image: radial-gradient(rgba(255, 255, 255, .07) 1.2px, transparent 1.5px), radial-gradient(circle at 85% 20%, rgba(41, 59, 199, .55), transparent 45%); background-size: 22px 22px, 100% 100%; color: #fff; }
.legal-hero .wrap { padding-block: clamp(40px, 6vw, 72px); display: flex; flex-direction: column; gap: 16px; }
.legal-hero .kicker { color: var(--amber); letter-spacing: .06em; }
.legal-hero h1 { font-size: clamp(40px, 6vw, 72px); line-height: 1.1; font-weight: 800; letter-spacing: -.03em; }
.legal-hero .intro { max-width: 680px; font-size: 17px; line-height: 1.7; font-weight: 500; color: #C9CCEC; }
.legal-hero .intro a { color: var(--amber); font-weight: 700; }
.dates { display: flex; gap: 10px; flex-wrap: wrap; padding: 6px 0 0; list-style: none; margin: 0; }
.dates li { background: var(--navy-soft); border-radius: 8px; padding: 6px 12px; font-size: 13px; font-weight: 600; }

.legal-body { padding-block: clamp(28px, 4vw, 48px) clamp(48px, 6vw, 80px); }
.legal-body article { max-width: 880px; margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
.notice { display: flex; gap: 10px; align-items: flex-start; background: var(--amber-soft); border-radius: 16px; padding: 16px 18px; font-size: 14px; line-height: 1.6; font-weight: 500; color: #5C3D00; }
.notice b { font-weight: 800; }

.clause { background: #fff; border-radius: 24px; padding: clamp(22px, 3vw, 32px); display: flex; flex-direction: column; gap: 14px; scroll-margin-top: 20px; }
.clause h2 { font-size: 22px; line-height: 1.35; font-weight: 800; letter-spacing: -.015em; }
.clause p, .clause li { font-size: 15px; line-height: 1.8; font-weight: 500; color: #4A4D66; }
.clause strong { font-weight: 700; color: var(--ink); }
.clause a { font-weight: 700; }
.clause ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.clause li { display: flex; gap: 10px; align-items: flex-start; line-height: 1.65; }
.clause li::before { content: '✓'; width: 20px; height: 20px; border-radius: 6px; background: var(--brand-soft); color: var(--brand); display: grid; place-items: center; font-size: 11px; font-weight: 800; flex: none; margin-top: 3px; }
.clause li.no::before { content: '✕'; background: var(--pink-soft); color: var(--pink-dark); }
.clause li > span { min-width: 0; }

.clause > div { display: flex; flex-direction: column; gap: 14px; }
.clause em { font-style: italic; font-weight: 700; }
.clause-contact { background: var(--brand); color: #fff; }
.clause-contact p, .clause-contact strong { color: #DDE1FB; }
.clause-contact a { color: var(--amber); }
.clause-contact a:hover { color: #fff; }
.clause-contact .facts a { color: var(--brand); }
.clause-contact .facts a:hover { color: var(--pink); }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 10px; }
.facts div { background: #fff; border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.facts dt { font-size: 13px; line-height: 1.45; font-weight: 700; color: var(--pink-text); }
.facts dd { margin: 0; font-size: 15px; line-height: 1.6; font-weight: 600; color: var(--ink); }

/* Contact page */
.contact-hero .wrap { padding-bottom: clamp(80px, 10vw, 120px); }
.contact-card { margin: clamp(-72px, -6vw, -48px) 0 0; max-width: 720px; background: #fff; border-radius: 24px; padding: clamp(22px, 3vw, 32px); display: flex; align-items: center; gap: 16px 20px; flex-wrap: wrap; }
.contact-ico { width: 52px; height: 52px; border-radius: 14px; background: var(--pink-soft); color: var(--pink-dark); display: grid; place-items: center; flex: none; }
.contact-text { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.contact-text span { font-size: 13px; font-weight: 700; color: var(--pink-text); }
.contact-text a { font-size: clamp(18px, 2.6vw, 24px); font-weight: 800; color: var(--ink); overflow-wrap: anywhere; }
.contact-text a:hover { color: var(--brand); }
.copy { border: 0; cursor: pointer; background: var(--brand); color: #fff; border-radius: 12px; padding: 12px 18px; font-size: 14px; font-weight: 700; }
.copy:hover { background: var(--brand-dark); }
.contact-main { padding-bottom: clamp(48px, 6vw, 80px); }