@import url('https://fonts.googleapis.com/css?family=Manrope:400,600,700&display=swap');
@import "./tokens.css";

* { box-sizing: border-box; }
img { max-width:100%; display:block; }
a { color: var(--primary-fg); }

h1,h2,h3 { font-weight:700; line-height:1.1; }
p { line-height:1.5; }

.container { width:min(1180px,90%); margin-inline:auto; }

.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.75rem 1.25rem; border-radius: var(--radius-md); font-weight:600; text-decoration:none; position:relative; overflow:hidden; background: var(--primary-bg); color: var(--primary-fg); border:1px solid var(--primary-hi); transition: var(--transition-fast); }
.btn:hover { background: var(--primary-hi); }
.btn-secondary { background:var(--secondary-bg); border-color:var(--secondary); color:var(--secondary-fg); }
.btn-secondary:hover { background:var(--secondary-hi); }

.grid-bg { position:fixed; inset:0; z-index:-2; }
.starry-layer { position:fixed; inset:0; pointer-events:none; z-index:-1; }