/* base.css — shared design system for every page on usraacompound.org
   Tokens, page chrome, and the masthead. Page-specific rules live next to
   their page (e.g. survey/survey.css). */

:root{
  --navy:#1c3557;
  --navy-deep:#122540;
  --cream:#faf6ee;
  --paper:#ffffff;
  --line:#e4dcc9;
  --gold:#c69a3f;
  --gold-deep:#a97f28;
  --ink:#2a2a28;
  --muted:#6b6558;
  --danger:#b3422e;
  --vacant:#8a8478;
  --radius:14px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--cream);
  background-image:
    radial-gradient(circle at 10% 0%, rgba(28,53,87,0.05), transparent 40%),
    radial-gradient(circle at 90% 10%, rgba(198,154,63,0.08), transparent 35%);
  font-family:'Cairo',"Segoe UI","Tahoma","Geneva",Arial,sans-serif;
  color:var(--ink);
  padding:20px 12px 60px;
  line-height:1.6;
}
.sheet{max-width:760px;margin:0 auto;}

/* ── Header ── */
.masthead{
  text-align:center;
  padding:10px 10px 22px;
  border-bottom:2px solid var(--line);
  margin-bottom:18px;
}
.masthead .mark{
  width:210px;height:210px;display:block;
  margin:0 auto 4px;
  /* logo JPEG has a white backdrop and no alpha; multiply dissolves it into --cream */
  mix-blend-mode:multiply;
}
.masthead h1{font-size:22px;margin:0 0 6px;color:var(--navy-deep);letter-spacing:.3px;}
.masthead p.tagline{margin:0;color:var(--gold-deep);font-size:14px;font-weight:600;}

/* ── Responsive ── */
@media (max-width:600px){
  body{padding:12px 10px 50px;}
  .masthead .mark{width:170px;height:170px;}
  .masthead h1{font-size:18px;}
  .masthead p.tagline{font-size:13px;}
  .floor-body{padding:12px;}
}
@media print{
  body{background:#fff;padding:0;}
}