/* Next in Marketing — shared site chrome: header + footer.
   Fixed sticky on every page (homepage, learnings, every board).
   --header-h/--footer-h define spacing for #viewport.
   On mobile (<=760px) it switches to static flow. */
:root{ --header-h:54px; --footer-h:134px; }

.site-header{
  position:fixed;top:0;left:0;right:0;z-index:50;height:var(--header-h);
  display:flex;align-items:center;justify-content:space-between;padding:0 24px;
  background:rgba(246,244,239,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1.5px solid var(--card-edge);
}
.site-header .logo{font-family:var(--font-heading);font-weight:700;font-size:16px;text-decoration:none;color:var(--ink);display:flex;align-items:center}
.site-header nav{display:flex;gap:20px;align-items:center}
.site-header nav a{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--ink-2)}
.site-header nav a:hover,.site-header nav a.active{color:var(--ink);border-bottom:2px solid var(--yellow-e)}

.site-footer{
  position:fixed;bottom:0;left:0;right:0;z-index:50;height:var(--footer-h);
  background:#171512;color:#EDE9DF;padding:12px 24px 8px;box-sizing:border-box;
  border-top:1.5px solid #2B2620;box-shadow:0 -4px 16px rgba(0,0,0,.18);
}
.site-footer .grid{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:18px}
.site-footer h4{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:#B9B1A4;margin:0 0 5px;display:flex;align-items:center}
.site-footer p{font-size:11.5px;line-height:1.42;color:#D8D3C7;margin:0}

/* Agency Proof Badges replacing wireframe dashed boxes */
.site-footer .badges{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:2px}
.site-footer .badge-item{background:#231F1A;border:1px solid #3D362C;border-radius:6px;padding:5px 4px;text-align:center}
.site-footer .badge-item b{display:block;font-family:var(--font-heading);font-size:13px;color:#FFE8A6;line-height:1.1}
.site-footer .badge-item span{font-family:var(--font-mono);font-size:8px;letter-spacing:.03em;color:#A39B8E;text-transform:uppercase}

.site-footer .bottom{max-width:1160px;margin:7px auto 0;padding-top:6px;border-top:1px solid #2A2620;font-size:10.5px;color:#8B8377;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px}
.site-footer .bottom .links{display:flex;align-items:center;gap:12px}
.site-footer .bottom a{color:#D8D3C7;text-decoration:none;display:inline-flex;align-items:center;gap:5px;transition:color .15s ease}
.site-footer .bottom a:hover{color:#FFE8A6}
.site-footer .bottom a svg{width:13px;height:13px;vertical-align:middle}

@media (max-width:960px){
  :root{ --footer-h:150px; }
  .site-footer .grid{grid-template-columns:1fr 1fr;gap:12px}
}

@media (max-width:760px){
  .site-header{position:static;height:auto;padding:10px 16px}
  .site-footer{position:static;height:auto;overflow:visible;padding:20px 16px 16px}
  .site-footer .grid{grid-template-columns:1fr;gap:18px}
}

/* Footer newsletter (lead.js) */
.site-footer .grid{grid-template-columns:1fr 1fr 1fr 1fr 1.15fr;max-width:1340px;gap:16px}
.site-footer .bottom{max-width:1340px}
.site-footer .nl-form{display:flex;gap:6px}
.site-footer .nl-form[hidden]{display:none}
.site-footer .nl-form input{flex:1;min-width:0;height:30px;padding:0 9px;border-radius:6px;border:1px solid #3D362C;background:#231F1A;color:#fff;font:12px var(--font-body)}
.site-footer .nl-form input::placeholder{color:#8B8377}
.site-footer .nl-form input:focus{outline:2px solid #FFE8A6;outline-offset:1px}
.site-footer .nl-form button{height:30px;padding:0 11px;border:0;border-radius:6px;background:#FFE8A6;color:#171512;font:700 11.5px var(--font-body);cursor:pointer}
.site-footer .nl-form button:disabled{opacity:.6;cursor:wait}
.site-footer .nl-msg{font-size:10.5px;line-height:1.35;color:#B9B1A4;margin-top:5px}
.site-footer .nl-msg a{color:#D8D3C7}
.site-footer .nl-msg.err{color:#FFB4A8}
.site-footer .nl-msg.ok{color:#CDEBCF;font-size:11.5px}
.site-footer .nl-fix{background:none;border:0;padding:0;color:#FFE8A6;text-decoration:underline;font:inherit;cursor:pointer}
.nl-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* lead.js sets --footer-h from the real height, so wrapping text can never push the bottom row off screen */
@media (min-width:761px){ .site-footer{height:auto} }
@media (max-width:1100px){ .site-footer .grid > div:nth-child(2){display:none} .site-footer .grid{grid-template-columns:1fr 1fr 1fr 1.3fr} }
@media (max-width:960px){ .site-footer .grid > div:nth-child(1){display:none} .site-footer .grid{grid-template-columns:1fr 1fr 1.3fr} }
@media (max-width:760px){ .site-footer .grid > div:nth-child(1), .site-footer .grid > div:nth-child(2){display:block} .site-footer .grid{grid-template-columns:1fr} }
@media (max-width:760px){ .herocard .callout{position:static;margin:10px 0 0;width:auto} .herocard .callout::before{display:none} }