/* =========================
   COGNISIVE — SITE-WIDE CSS
   Safe global vars + scoped styles for doctrine sections
   ========================= */

/* Global tokens (safe) */
:root{
  --cog-text: #1a1a1a;
  --cog-muted: #565656;
  --cog-gold: #9a885b;            /* muted tactical gold */
  --cog-read: 780px;              /* reading width */
  --cog-pad: 16px;                /* side padding for narrow screens */
  --cog-line: 1.52;               /* line-height rhythm */
  --cog-s-8: 8px;
  --cog-s-12: 12px;
  --cog-s-16: 16px;
  --cog-s-18: 18px;
  --cog-s-20: 20px;
  --cog-s-22: 22px;
  --cog-s-24: 24px;
  --cog-s-28: 28px;
  --cog-s-32: 32px;
  --cog-s-36: 36px;
  --cog-s-40: 40px;
}

html{ scroll-behavior:smooth; }

/* -------------------------
   Shared base (scoped)
   ------------------------- */
.cog-fidelity,
.cog-hrl,
.cog-projects{
  color:var(--cog-text);
  line-height:var(--cog-line);
  background:#fff;
  display:grid;
  place-items:center;
  padding: var(--cog-s-36) var(--cog-pad) var(--cog-s-40);
  font-family: Roboto, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI",
               Helvetica, Arial, sans-serif;
}

/* Width lock */
.cog-fidelity__wrap,
.cog-hrl__wrap,
.cog-projects__wrap{
  max-width:var(--cog-read);
  width:100%;
  margin:0 auto;
}

/* Headings (compact) */
#cog-fidelity-title,
#cog-hrl-title,
#cog-projects-title{
  font-weight:500;
  font-size:clamp(21px,2.6vw,25px);
  margin:0 0 var(--cog-s-20) 0;
  letter-spacing:.15px;
}

.cog-fidelity__h3,
.cog-hrl__h3,
.cog-projects__h3{
  font-weight:500;
  font-size:clamp(17px,2.1vw,19px);
  margin: var(--cog-s-40) 0 var(--cog-s-14,14px) 0; /* fallback var for 14px */
  color:var(--cog-gold);
  letter-spacing:.05px;
}

/* Paragraphs & lists */
.cog-fidelity p,
.cog-hrl p,
.cog-projects p{ margin:0 0 var(--cog-s-24) 0; font-size:15.7px; }

.cog-fidelity ul, .cog-fidelity ol,
.cog-hrl ul,    .cog-hrl ol,
.cog-projects ul, .cog-projects ol{
  padding-left:20px;
  margin: var(--cog-s-12) 0 var(--cog-s-32) 0;
}
.cog-fidelity li,
.cog-hrl li,
.cog-projects li{ margin:6px 0; font-size:15.5px; }

/* Quotes (gold spine, quiet) */
.cog-fidelity__quote,
.cog-hrl__quote{
  border-left:2px solid var(--cog-gold);
  padding-left: var(--cog-s-18);
  margin: var(--cog-s-32) 0 var(--cog-s-32) 0 !important;
  font-style:italic;
  color:var(--cog-muted);
  font-size:15.25px;
}

/* Gold micro-rule */
.cog-fidelity__rule,
.cog-projects__rule{
  border:0;
  border-top:1px solid var(--cog-gold);
  opacity:.38;
  margin: var(--cog-s-36) 0;
}

/* Fidelity — key line spacing (the premise) */
.cog-fidelity .cog-premise{
  margin: var(--cog-s-36) 0 var(--cog-s-32) 0;
  font-size:16px;
}

/* HRL selective two-column (safe at ≥720px) */
.cog-hrl__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px 36px;
}
@media (min-width:720px){
  .cog-hrl__grid{ grid-template-columns:1fr 1fr; }
}
.cog-hrl__col h4{
  margin:0 0 6px 0;
  font-weight:600;
  font-size:15.75px;
  color:var(--cog-gold);
}

/* Projects — Doctrine Ledger rows */
.ledger{ display:grid; grid-template-columns:1fr; margin:0; }
.ledger__row{
  display:grid;
  grid-template-columns:1fr;
  gap:6px 28px;
  padding:14px 0;
  border-bottom:1px solid #e6e6e6;
}
.ledger__title{
  margin:0;
  font-weight:600;
  font-size:15.75px;
  letter-spacing:.05px;
}
.ledger__subtitle{
  margin:2px 0 0 0;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.18px;
  color:var(--cog-muted);
}
.ledger__desc{ margin:0; font-size:15.5px; }

@media (min-width:720px){
  .ledger__row{
    grid-template-columns:0.46fr 0.54fr; /* title left / description right */
    align-items:start;
  }
}

/* CTA + quiet back link */
.cog-projects__cta{
  margin: var(--cog-s-40) 0 var(--cog-s-8) 0;
  font-size:15px;
  color:var(--cog-muted);
}
.cog-projects__cta a{
  color:var(--cog-text);
  text-decoration:underline;
  text-underline-offset:3px;
}
.cog-projects__back{
  margin-top: var(--cog-s-22,22px);
  font-size:14.25px;
  color:var(--cog-muted);
}
.cog-projects__back a{
  color:var(--cog-text);
  text-decoration:underline;
  text-underline-offset:3px;
}
.cog-projects__back a:hover{ color:var(--cog-gold); }

/* Narrow-screen padding refinement */
@media (max-width:500px){
  :root{ --cog-pad:14px; }
}

/* Utility: apply Cognisive reading width to any other block if needed */
.cog-readwidth{
  max-width:var(--cog-read) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:var(--cog-pad);
  padding-right:var(--cog-pad);
}