/* base.css
   Reset, typografia, przyciski. Nic tu nie zna konkretnego widoku.
   Lucifer's Garage */

/* ============================================================
   Baza
   ============================================================ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--f-body); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button,input,select,textarea{font:inherit; color:inherit}
h1,h2,h3,h4{margin:0; font-weight:600; line-height:1.12}
p{margin:0}
:focus-visible{outline:2px solid var(--brass); outline-offset:3px; border-radius:2px}

.wrap{width:100%; max-width:var(--maxw); margin:0 auto; padding:0 22px}
.section{padding:76px 0; border-top:1px solid var(--line)}
.section--flat{border-top:none}
.stack{display:flex; flex-direction:column; gap:14px}
.split2{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start}

.eyebrow{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.22em;
  text-transform:uppercase; color:var(--brass); margin-bottom:14px;
}
.eyebrow--dim{color:var(--dim)}
.h-display{font-family:var(--f-display); letter-spacing:-.015em}
.t-xxl{font-size:clamp(44px,8vw,88px)}
.t-xl{font-size:clamp(30px,4.4vw,48px)}
.t-lg{font-size:clamp(22px,2.6vw,30px)}
.lead{font-size:17px; color:var(--dim); max-width:62ch}
.muted{color:var(--dim)}
.mono{font-family:var(--f-mono)}
.rule{height:1px; background:var(--line); border:0; margin:0}
/* ============================================================
   Przyciski
   ============================================================ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:12px 20px; border-radius:var(--r-sm); border:1px solid var(--line-2);
  background:transparent; cursor:pointer; font-size:14px; font-weight:600;
  letter-spacing:.02em; transition:.18s; white-space:nowrap;
}
.btn:hover{border-color:var(--brass); color:var(--brass)}
.btn--primary{background:var(--brass); border-color:var(--brass); color:#17140F}
.btn--primary:hover{background:var(--brass-2); border-color:var(--brass-2); color:#17140F}
.btn--sm{padding:8px 13px; font-size:13px}
.btn--danger{border-color:var(--oxblood); color:var(--oxblood)}
.btn--danger:hover{background:var(--oxblood); color:#fff; border-color:var(--oxblood)}
.btn--ghost{border-color:transparent; color:var(--dim)}
.btn--ghost:hover{border-color:var(--line-2); color:var(--text)}
.btn--block{width:100%}
.btn[disabled]{opacity:.4; cursor:not-allowed}