/* PixPolish — shared styles for /guides/ hub and articles */
:root{
  --ink:#12141a; --muted:#555; --line:#e5e7eb;
  --link:#2563eb; --bg:#fff; --soft:#f6f7f9; --accent:#111827;
}
*{box-sizing:border-box}
body{
  max-width:820px;margin:0 auto;padding:2rem 1.1rem 3rem;
  font:16px/1.7 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);background:var(--bg);
}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}

/* top bar */
.g_top{display:flex;justify-content:space-between;align-items:center;
  font-size:.95rem;margin-bottom:1.6rem;gap:1rem;flex-wrap:wrap}
.g_top .g_brand{font-weight:700;color:var(--accent);font-size:1.05rem}
.g_top nav a{margin-left:.9rem;color:var(--muted)}
.g_crumb{font-size:.9rem;color:var(--muted);margin-bottom:.6rem}

/* headings */
h1{font-size:2rem;line-height:1.25;margin:.2rem 0 .8rem}
h2{font-size:1.35rem;margin:2rem 0 .6rem}
h3{font-size:1.08rem;margin:1.4rem 0 .4rem}
.lede{font-size:1.15rem;color:#374151;margin:0 0 1.4rem}

/* article body */
article p{margin:.7rem 0}
article ol,article ul{margin:.7rem 0 .7rem 1.2rem;padding-left:.6rem}
article li{margin:.35rem 0}
strong{color:var(--accent)}

/* callout / privacy note */
.g_note{background:var(--soft);border:1px solid var(--line);border-radius:12px;
  padding:.9rem 1.1rem;margin:1.4rem 0;font-size:.97rem}
.g_note b{color:var(--accent)}

/* CTA button */
.g_cta{margin:1.8rem 0}
.g_btn{display:inline-block;background:var(--link);color:#fff;font-weight:600;
  padding:.75rem 1.4rem;border-radius:10px;font-size:1.02rem}
.g_btn:hover{background:#1d4ed8;text-decoration:none}

/* related links */
.g_related{margin:2rem 0 0;padding:1.1rem 1.2rem;border:1px solid var(--line);
  border-radius:12px;background:var(--soft)}
.g_related h2{margin:0 0 .5rem;font-size:1.1rem}
.g_related ul{margin:0;list-style:none;padding:0}
.g_related li{margin:.3rem 0}

/* hub grid */
.g_hero{margin-bottom:1.8rem}
.g_grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;margin:1.4rem 0}
.g_card{display:block;border:1px solid var(--line);border-radius:14px;padding:1.1rem 1.15rem;
  background:var(--bg);color:var(--ink);transition:border-color .15s,box-shadow .15s}
.g_card:hover{border-color:#c7d2fe;box-shadow:0 4px 16px rgba(37,99,235,.08);text-decoration:none}
.g_card .g_ic{font-size:1.6rem;line-height:1}
.g_card h3{margin:.5rem 0 .3rem;font-size:1.05rem;color:var(--accent)}
.g_card p{margin:0;font-size:.92rem;color:var(--muted)}

/* footer */
footer.g_foot{margin-top:2.6rem;padding-top:1.1rem;border-top:1px solid var(--line);
  font-size:.85rem;color:var(--muted)}
footer.g_foot a{color:var(--muted)}

@media (max-width:520px){ h1{font-size:1.6rem} .lede{font-size:1.05rem} }

/* ============================================================
   Site footer — multi-column (light theme, content pages)
   ============================================================ */
.sf{ margin-top:3.6rem; padding-top:2.2rem; border-top:1px solid var(--line); }
.sf_cols{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem 1.6rem; }
.sf_col h3{ margin:0 0 .75rem; font-size:.82rem; font-weight:700; letter-spacing:.7px;
  text-transform:uppercase; color:#6b7280; }
.sf_col ul{ list-style:none; margin:0; padding:0; }
.sf_col li{ margin:.42rem 0; }
.sf_col a{ color:#374151; font-size:.98rem; }
.sf_col a:hover{ color:var(--link); text-decoration:none; }
.sf_bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.9rem;
  margin-top:2rem; padding:1.2rem 0 .3rem; border-top:1px solid var(--line);
  font-size:.9rem; color:#6b7280; }
.sf_bottom a{ color:#6b7280; text-decoration:underline; }
.sf_social a{ margin-left:.7rem; color:#9aa3af; }
@media (max-width:640px){ .sf_cols{ grid-template-columns:1fr 1fr; } }
@media (max-width:380px){ .sf_cols{ grid-template-columns:1fr; } }
