/* Shared styling for MakerRise's public information pages (/product,
   /privacy, /terms, /contact). Deliberately self-contained -- no
   dependency on app.js or an authenticated session, since these pages
   must render correctly for a logged-out visitor, including a Google
   Ads API reviewer who will never sign in. Palette matches public/index.html
   for brand consistency. */

:root {
  --navy: #1C2B3A;
  --navy-mid: #2A3F52;
  --parch: #F5EFE0;
  --parch-dk: #E8DFC8;
  --copper: #B06A2E;
  --copper-lt: #D4854A;
  --copper-pl: #F0D5BC;
  --ink: #1C2B3A;
  --muted: #5A6D7E;
  --white: #FFFFFF;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--sans);
  background: var(--parch);
  color: var(--ink);
  line-height: 1.6;
  font-size: 16px;
}

.site-header {
  background: var(--navy);
  padding: 18px 20px;
}
.site-header-inner {
  max-width: 780px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.site-wordmark {
  font-family: var(--serif);
  font-size: 22px;
  color: var(--white);
  text-decoration: none;
}
.site-wordmark em { font-style: italic; color: var(--copper-lt); }
.site-nav { display: flex; gap: 18px; flex-wrap: wrap; }
.site-nav a {
  color: var(--parch);
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  padding: 6px 2px;
  display: inline-block;
}
.site-nav a:hover { color: var(--copper-lt); }

main {
  max-width: 780px;
  margin: 0 auto;
  padding: 40px 20px 60px;
}
h1 {
  font-family: var(--serif);
  font-size: 32px;
  line-height: 1.25;
  margin-bottom: 14px;
  color: var(--navy);
}
h2 {
  font-family: var(--serif);
  font-size: 21px;
  margin: 32px 0 10px;
  color: var(--navy);
}
h3 {
  font-size: 15.5px;
  font-weight: 700;
  margin: 20px 0 6px;
  color: var(--navy);
}
p { margin-bottom: 14px; max-width: 68ch; }
ul, ol { margin: 0 0 14px 22px; }
li { margin-bottom: 6px; max-width: 64ch; }
a { color: var(--copper); }
.lede {
  font-size: 18px;
  color: var(--muted);
  max-width: 62ch;
  margin-bottom: 24px;
}
.callout {
  background: var(--white);
  border-left: 4px solid var(--copper);
  border-radius: 8px;
  padding: 16px 18px;
  margin: 20px 0;
  font-size: 14.5px;
}
.callout strong { color: var(--navy); }
.card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin: 20px 0;
}
.feature-card {
  background: var(--white);
  border-radius: 10px;
  padding: 16px;
  border: 1px solid var(--parch-dk);
}
.feature-card h3 { margin-top: 0; }
.feature-card p { font-size: 13.5px; color: var(--muted); margin-bottom: 0; }
.not-list {
  background: var(--white);
  border: 1px solid var(--parch-dk);
  border-radius: 10px;
  padding: 16px 18px;
}
.not-list li { color: var(--muted); }
.site-footer {
  border-top: 1px solid var(--parch-dk);
  padding: 24px 20px 40px;
  text-align: center;
  font-size: 12px;
  color: var(--muted);
}
.site-footer a { color: var(--muted); margin: 0 8px; }

@media (max-width: 560px) {
  main { padding: 28px 16px 48px; }
  h1 { font-size: 26px; }
  h2 { font-size: 19px; }
  .card-grid { grid-template-columns: 1fr; }
  .site-nav { gap: 14px; }
  .site-nav a { font-size: 14px; padding: 8px 2px; }
}

/* Public-page refinement stays in this already-public asset. */

.maker-public .site-header { padding: 24px; }

.maker-public .site-header-inner { max-width: 1040px; gap: 20px; }

.maker-public .site-wordmark { font-size: 28px; }

.maker-public .site-nav a { min-height: 44px; padding: 10px 2px; }

.maker-public .site-nav a[aria-current="page"] { color: var(--copper-lt); text-decoration: underline; }

.maker-public main { max-width: 860px; padding: 64px 32px 80px; }

.maker-public h1 { font-size: clamp(2.3rem, 5vw, 3.3rem); font-weight: 500; letter-spacing: -.025em; margin-bottom: 22px; }

.maker-public h2 { font-size: 25px; font-weight: 500; margin-top: 40px; }

.maker-public p { margin-bottom: 20px; }

.maker-public .lede { font-size: 20px; line-height: 1.65; }

.maker-public .site-footer { padding: 28px 20px 40px; line-height: 2; }

.maker-public .site-footer a { display: inline-block; min-height: 44px; }

.maker-public .site-header :focus-visible, .maker-launch header :focus-visible, .maker-app .masthead :focus-visible { outline-color: #fffefa; }






.maker-public {background:#f7f3e9;color:#233442;line-height:1.6}.maker-public :focus-visible{outline:3px solid #92501f;outline-offset:4px}.maker-public .site-header :focus-visible{outline-color:white}
@media(max-width:650px){.maker-public main{padding:36px 20px 56px}.maker-public .site-header{padding:18px 20px}}
/* Same palette as the authenticated app; kept here for signed-out access. */
:root { --navy:#1c2b3a; --parch:#f7f3e9; --parch-dk:#ddd7c9; --copper:#92501f; --copper-lt:#dfa573; --ink:#233442; --muted:#536674; --white:#fffefa; }