/* Shared styles for Noxogy legal pages (privacy policy, terms). Mirrors the homepage "aurora" palette. */
:root{
  --font-sans: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'SF Pro Display', Inter, system-ui, sans-serif;
  --bg-top:#121C3E; --bg-bottom:#1A2A5A; --bg-deep:#0A1026;
  --headline:#FFFFFF; --text:#DDE6F8; --text-dim:#93A2C8; --text-faint:#606F98;
  --surface: rgba(120,165,230,.06);
  --hairline: rgba(135,160,210,.20);
  --accent:#19D3C5;
  --accent-soft:#6FE7DC;
  --r:16px; --r-pill:999px;
  --maxw: 760px;
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
body{
  min-height:100vh;
  background: var(--bg-deep) linear-gradient(180deg, var(--bg-top) 0%, var(--bg-deep) 70%) no-repeat;
  color:var(--text);
  font: 400 16px/1.65 var(--font-sans);
  -webkit-font-smoothing:antialiased;
}
a{ color:var(--accent); text-decoration:none; }
a:hover{ color:var(--accent-soft); text-decoration:underline; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 20px; }

header.site{ padding:28px 0; border-bottom:1px solid var(--hairline); }
header.site .wrap{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.logo img{ display:block; height:30px; width:auto; }
.back{ font-size:14px; color:var(--text-dim); }

main{ padding:56px 0 72px; }
.eyebrow{ font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin-bottom:12px; }
h1{ font-size:clamp(32px, 6vw, 46px); line-height:1.1; letter-spacing:-.02em; color:var(--headline); font-weight:700; -webkit-hyphens:auto; hyphens:auto; overflow-wrap:break-word; line-break:strict; }
.updated{ margin-top:14px; font-size:14px; color:var(--text-faint); }

.doc{ margin-top:40px; }
.doc section{ padding:28px 0; border-top:1px solid var(--hairline); }
.doc section:first-child{ border-top:0; padding-top:0; }
.doc h2{ -webkit-hyphens:auto; hyphens:auto; overflow-wrap:break-word; font-size:21px; line-height:1.3; color:var(--headline); font-weight:650; margin-bottom:12px; }
.doc p + p, .doc p + ul, .doc ul + p{ margin-top:14px; }
.doc ul{ padding-left:22px; }
.doc li + li{ margin-top:6px; }
.doc strong{ color:var(--headline); font-weight:600; }

.legal-nav{ display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.legal-nav a{
  font-size:14px; padding:7px 14px; border-radius:var(--r-pill);
  border:1px solid var(--hairline); background:var(--surface); color:var(--text-dim);
}
.legal-nav a:hover{ color:var(--headline); text-decoration:none; }
.legal-nav a[aria-current="page"]{ color:var(--bg-deep); background:var(--accent); border-color:var(--accent); }

footer.site{ border-top:1px solid var(--hairline); padding:28px 0 40px; font-size:14px; color:var(--text-faint); }
footer.site .wrap{ display:flex; flex-wrap:wrap; gap:12px 24px; justify-content:space-between; }
footer.site nav{ display:flex; flex-wrap:wrap; gap:8px 20px; }
footer.site a{ color:var(--text-dim); }

/* Inside the Noxogy app's web view: the app's navigation bar replaces the site header. */
.in-app header.site{ display:none; }
.in-app main{ padding-top:0; }
.in-app .eyebrow{ display:none; }
/* The app lines the first title line up with its bar buttons (WebViewController.m, kPageTitleLineHeight = 31px line height); keep space on the right for them. */
.in-app h1{ font-size:28px; line-height:31px; padding-right:64px; }
.in-app:lang(ja) h1, .in-app:lang(ko) h1, .in-app:lang(zh-Hans) h1, .in-app:lang(zh-Hant) h1{ font-size:25px; }
.in-app .updated{ margin-top:8px; }
.in-app .legal-nav{ margin-top:20px; }
.in-app .doc{ margin-top:28px; }

/* CJK headings: wrap at phrase boundaries instead of mid-word. */
:lang(ja) h1, :lang(ko) h1, :lang(zh-Hans) h1, :lang(zh-Hant) h1{ word-break:keep-all; overflow-wrap:anywhere; }

/* Support page */
.support .lead{ margin-top:14px; color:var(--text-dim); font-size:17px; }
.contact-card{ margin-top:32px; padding:24px; border-radius:var(--r); background:var(--surface); border:1px solid var(--hairline); }
.contact-card h2{ font-size:15px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--text-dim); }
.contact-card .email{ display:inline-block; margin-top:10px; font-size:clamp(20px,5vw,26px); font-weight:650; color:var(--headline); overflow-wrap:anywhere; }
.contact-card p{ margin-top:10px; color:var(--text-dim); font-size:15px; }
.contact-card .btn{ display:inline-block; margin-top:18px; padding:11px 20px; border-radius:var(--r-pill); background:var(--accent); color:var(--bg-deep); font-weight:600; }
.contact-card .btn:hover{ text-decoration:none; filter:brightness(1.08); }
.doc h3{ margin-top:18px; font-size:17px; color:var(--headline); font-weight:600; }
.doc h2 + h3{ margin-top:0; }
.doc h3 + ul, .doc h3 + p{ margin-top:8px; }
.doc details{ border-top:1px solid var(--hairline); padding:14px 0; }
.doc details:last-child{ border-bottom:1px solid var(--hairline); }
.doc summary{ cursor:pointer; color:var(--headline); font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:16px; }
.doc summary::-webkit-details-marker{ display:none; }
.doc summary::after{ content:"+"; color:var(--accent); font-weight:400; font-size:20px; line-height:1; }
.doc details[open] summary::after{ content:"−"; }
.doc details p{ margin-top:10px; color:var(--text-dim); }

/* Android app: the page sits below the app's own top bar (no title alignment with bar buttons as on iOS). */
.in-app.android main{ padding-top:20px; }
.in-app.android h1{ padding-right:0; }