/* Shared base styles for NeatClock's static SEO/legal pages (public/*.html).
   Page-specific rules stay inline in each page's own <style> block. */
:root { --bg: #F3F1EA; --card: #fff; --text: #1C1C1C; --muted: #78716C; --accent: #E07A5F; --accent-hover: #C9654B; }
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: "Outfit", system-ui, sans-serif; background: var(--bg); color: var(--text); line-height: 1.6; min-height: 100vh; }
.wrap { max-width: 42rem; margin: 0 auto; padding: 2rem 1.25rem 3rem; }
header { text-align: center; margin-bottom: 2rem; }
.logo { height: 40px; width: auto; max-width: 100%; margin-bottom: 1rem; }
h1 { font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.75rem, 5vw, 2.25rem); font-weight: 700; line-height: 1.2; margin-bottom: 0.75rem; }
.lead { color: var(--muted); font-size: 1.05rem; }
.card { background: var(--card); border-radius: 1rem; padding: 1.5rem; box-shadow: 0 4px 14px -2px rgba(28,28,28,.08); margin: 1.5rem 0; }
h2 { font-family: "Playfair Display", Georgia, serif; font-size: 1.2rem; margin-bottom: 0.75rem; }
ul { padding-left: 1.25rem; }
li { margin: 0.35rem 0; }
code { background: rgba(28,28,28,.06); padding: 0.15em 0.4em; border-radius: 0.35em; font-size: 0.9em; }
footer { margin-top: 2.5rem; text-align: center; font-size: 0.875rem; color: var(--muted); }
footer a { color: var(--accent); }