/* Calgary Housing Brief signup component — brand palette, two layouts.
   Full: dark ink panel, used after substantial content.
   Compact: quiet off-white strip for sidebars and denser pages. */
.clg-nl{margin:2.6rem 0}
.clg-nl-in{background:#012F38;border-radius:6px;padding:2rem 2.2rem;
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:2rem;align-items:center}
.clg-nl-eyebrow{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  color:#A2C243;font-weight:700;margin-bottom:.5rem}
.clg-nl-h{font-family:'Playfair Display',Georgia,serif;font-size:1.4rem;color:#fff;
  line-height:1.3;margin:0 0 .5rem}
.clg-nl-p{font-size:.95rem;line-height:1.7;color:rgba(255,255,255,.72);margin:0}
.clg-nl-form{display:flex;flex-direction:column;gap:.6rem}
.clg-nl-form input[type=email]{width:100%;padding:.85rem .9rem;font:inherit;font-size:1rem;
  border:1px solid rgba(255,255,255,.22);border-radius:4px;
  background:rgba(255,255,255,.07);color:#fff}
.clg-nl-form input[type=email]::placeholder{color:rgba(255,255,255,.4)}
.clg-nl-form input[type=email]:focus{outline:2px solid #A2C243;outline-offset:1px;
  border-color:#A2C243;background:rgba(255,255,255,.12)}
.clg-nl-form button{background:#6ABA5A;color:#fff;border:0;border-radius:4px;
  padding:.9rem 1.2rem;font:inherit;font-size:.88rem;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;cursor:pointer;transition:background .2s}
.clg-nl-form button:hover{background:#58a049}
.clg-nl-form button[disabled]{opacity:.6;cursor:default}
.clg-nl-fine{font-size:.78rem;color:rgba(255,255,255,.5);margin:0;line-height:1.6}
.clg-nl-fine a{color:rgba(255,255,255,.75)}
.clg-nl-err{display:none;font-size:.85rem;color:#ffb4a2;margin:0}
.clg-nl-sr,.clg-nl-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.clg-nl-done{display:block;text-align:left}
.clg-nl-done .clg-nl-p a{color:#A2C243}

/* compact — quieter, for sidebars and dense pages */
.clg-nl-compact .clg-nl-in{background:#F8F7F4;border:1px solid #e6e3dc;
  border-left:3px solid #A2C243;border-radius:0 5px 5px 0;grid-template-columns:1fr;
  gap:1rem;padding:1.4rem 1.5rem}
.clg-nl-compact .clg-nl-eyebrow{color:#48A3A6}
.clg-nl-compact .clg-nl-h{font-size:1.15rem;color:#012F38}
.clg-nl-compact .clg-nl-p{color:#5A5A5A;font-size:.92rem}
.clg-nl-compact .clg-nl-form{flex-direction:row;flex-wrap:wrap;gap:.5rem}
.clg-nl-compact .clg-nl-form input[type=email]{flex:1 1 200px;width:auto;
  background:#fff;border-color:#d8d8d2;color:#012F38}
.clg-nl-compact .clg-nl-form input[type=email]::placeholder{color:#9a9a9a}
.clg-nl-compact .clg-nl-form button{flex:0 0 auto}
.clg-nl-compact .clg-nl-fine{flex:1 1 100%;color:#888}
.clg-nl-compact .clg-nl-fine a{color:#48A3A6}
.clg-nl-compact .clg-nl-err{color:#b0442f}

@media (max-width:760px){
  .clg-nl-in{grid-template-columns:1fr;gap:1.3rem;padding:1.6rem 1.5rem}
  .clg-nl-compact .clg-nl-form input[type=email]{flex:1 1 100%}
  .clg-nl-compact .clg-nl-form button{width:100%}
}