/* H4L - token e componenti condivisi */
:root {
  --bg: #050507;
  --bg-deep: #030308;
  --ink: #f5f6fa;
  --ink-70: rgba(255,255,255,.75);
  --ink-55: rgba(255,255,255,.6);
  --ink-40: rgba(255,255,255,.45);
  --line: rgba(255,255,255,.1);
}
html, body { margin: 0; background: var(--bg); font-family: Arial, Helvetica, sans-serif; }
::selection { background: var(--ink); color: var(--bg); }
.h4l-mono { font-family: "Courier New", ui-monospace, monospace; }
.h4l-cta {
  background: transparent; color: var(--ink);
  border: 1px solid rgba(255,255,255,.8);
  padding: 14px 42px; font-size: 13px; letter-spacing: .35em;
  cursor: pointer; text-decoration: none; display: inline-block;
  transition: background .25s, color .25s, box-shadow .25s;
  font-family: "Courier New", ui-monospace, monospace;
}
.h4l-cta:hover { background: var(--ink); color: var(--bg-deep); box-shadow: 0 0 34px rgba(255,255,255,.35); }
.h4l-in { animation: h4lIn .6s cubic-bezier(.2,.8,.2,1) both; }
@keyframes h4lIn { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }

.logo-img { height: 42px; display: block; }
