/* ===========================================================
   Sensory Dogs Canada — Brand System v1.0
   Design intent: reads like a teaching hospital or a college
   of practitioners. Institutional, warm, quiet. Never tactical.
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,400;8..60,600;8..60,700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* --- Core palette ---
     Warm forest + cream + tan. Reads outdoors and animal, not clinical.
     Variable names kept from v1 so every artefact re-skins from here. */
  --navy:        #22423A;  /* deep forest. primary. warm authority */
  --navy-deep:   #16302A;
  --navy-tint:   #E7EDE7;
  --ink:         #1F1C18;
  --paper:       #FCF8F1;  /* warm cream. never pure #fff */
  --paper-edge:  #F0E7D9;

  /* --- Accents --- */
  --copper:      #B0703C;  /* seals, endorsements, credential marks */
  --copper-lt:   #D9A472;
  --sage:        #6E8C6F;  /* the "care" note */
  --slate:       #8A7A65;  /* SD-C companion class. warm taupe */

  /* --- Semantic --- */
  --valid:       #3F7A52;
  --expired:     #A07B33;
  --revoked:     #A03B32;
  --rule:        #E0D6C4;
  --muted:       #7A7263;

  /* --- Type --- */
  --serif: 'Source Serif 4', 'Source Serif Pro', Georgia, 'Times New Roman', serif;
  --sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --mono:  ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  --tracking-caps: 0.14em;
}

/* --- Wordmark ------------------------------------------------ */
.wordmark {
  font-family: var(--serif);
  font-weight: 600;
  color: var(--navy);
  line-height: 1.05;
  letter-spacing: -0.01em;
}
.wordmark .mark-sensory { display: block; }
.wordmark .mark-dogs    { display: block; }
.wordmark .mark-canada {
  display: block;
  font-family: var(--sans);
  font-weight: 600;
  font-size: 0.34em;
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--copper);
  margin-top: 0.45em;
}

/* --- Small caps label --------------------------------------- */
.label {
  font-family: var(--sans);
  font-size: 7.5pt;
  font-weight: 600;
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--muted);
}

/* --- Credential ID ------------------------------------------ */
.cred-id {
  font-family: var(--mono);
  font-weight: 600;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}

/* --- Rules --------------------------------------------------- */
.rule       { border: 0; border-top: 1px solid var(--rule); margin: 0; }
.rule-heavy { border: 0; border-top: 2px solid var(--navy); margin: 0; }

/* --- The mandatory disclaimer -------------------------------- */
/* This block is REQUIRED on every credential artefact.
   It is not fine print to be minimised — it is the trust signal. */
.disclaimer {
  font-family: var(--sans);
  font-size: 6pt;
  line-height: 1.42;
  color: var(--navy);
  background: var(--navy-tint);
  border-left: 2px solid var(--copper);
  padding: 5px 7px;
}
.disclaimer strong { font-weight: 700; }

/* --- Print --------------------------------------------------- */
@media print {
  body { background: #fff !important; margin: 0; padding: 0; }
  .no-print, .screen-note { display: none !important; }
  .sheet { box-shadow: none !important; margin: 0 !important; page-break-after: always; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* --- Screen scaffold ----------------------------------------- */
body {
  background: #E4E0D8;
  font-family: var(--sans);
  color: var(--ink);
  margin: 0;
  padding: 40px 20px;
}
.screen-note {
  max-width: 760px; margin: 0 auto 32px; padding: 14px 18px;
  background: var(--navy); color: #fff; border-radius: 6px;
  font-size: 12px; line-height: 1.6;
}
.screen-note code { font-family: var(--mono); color: var(--copper-lt); }