/* Plain static pages for /privacy/ and /terms/ - served as files, outside the React app, so a
   platform reviewer (Meta, TikTok, Pinterest) or a crawler gets the policy text without JavaScript. */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500&family=Space+Grotesk:wght@500&display=swap');

:root { color-scheme: dark; }

* { box-sizing: border-box; }

body {
  margin: 0;
  background: #0A0A0A;
  color: #D6D6D6;
  font-family: 'Outfit', system-ui, sans-serif;
  font-weight: 300;
  font-size: 17px;
  line-height: 1.75;
}

main {
  max-width: 44rem;
  padding: 3rem 1rem 5rem;
  margin: 0 auto 0 max(1rem, 12vw);
}

h1, h2, h3 {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-weight: 500;
  letter-spacing: -0.025em;
  color: #FFFFFF;
  line-height: 1.2;
}

h1 { font-size: clamp(2.2rem, 7vw, 3.4rem); margin: 1.5rem 0 0.25rem; }
h2 { font-size: 1.4rem; margin: 2.75rem 0 0.5rem; padding-top: 1.25rem; border-top: 1px solid #222; }
h3 { font-size: 1.05rem; margin: 1.5rem 0 0.25rem; }

.meta { color: #8A8A8A; margin-top: 0; }

a { color: #FF3300; text-underline-offset: 3px; }
a:hover { color: #FF6A3D; }

.home { text-decoration: none; font-weight: 400; color: #8A8A8A; }
.home:hover { color: #FF3300; }

ul { padding-left: 1.2rem; }
li { margin-bottom: 0.5rem; }

.foot { margin-top: 3rem; padding-top: 1.25rem; border-top: 1px solid #222; }