/* WisentWire — wspólne style trzech wariantów (marka: zieleń + fiolet, jasne tło) */
@import url("fonts/fonts.css");

:root{
  --lime:#c8ed5a; --lime-soft:#dbfc79; --lime-tint:#f3fbd9; --green-ink:#4d7c0f; --green-deep:#365314;
  --violet:#7c3aed; --violet-dark:#5b21b6; --violet-soft:#a855f7; --violet-tint:#f3eeff; --violet-line:#ddd0fb;
  --ink:#0f0f0f; --ink-2:#2b2b33; --muted:#5f6472; --line:#e5e7eb; --paper:#ffffff; --paper-2:#f7f7f5;
  --radius:14px; --radius-sm:8px; --max:1180px;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --display:"Plus Jakarta Sans","Inter",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.55;font-size:16px;-webkit-font-smoothing:antialiased}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);line-height:1.1;letter-spacing:-.02em;margin:0 0 .5em}
p{margin:0 0 1em}
ul{margin:0;padding:0;list-style:none}
button{font:inherit}
.container{max-width:var(--max);margin:0 auto;padding:0 20px}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--violet);font-weight:500}
.muted{color:var(--muted)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 12px;border-radius:6px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--violet);outline-offset:2px}

/* przyciski */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:999px;font-weight:600;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,background .12s ease;white-space:nowrap;line-height:1.2}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--violet);color:#fff;border-color:var(--violet)}
.btn-primary:hover{background:var(--violet-dark);border-color:var(--violet-dark)}
.btn-lime{background:var(--lime);color:var(--ink);border-color:var(--lime)}
.btn-lime:hover{background:var(--lime-soft)}
.btn-dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-ghost{background:transparent;color:var(--ink);border-color:#c9cbd3}
.btn-ghost:hover{border-color:var(--ink)}
.btn-sm{padding:9px 16px;font-size:14px}
.btn-lg{padding:15px 28px;font-size:17px}

/* pasek przełączania wariantów (tylko demo) */
.variant-switch{position:fixed;left:12px;bottom:12px;z-index:90;display:flex;gap:4px;align-items:center;background:rgba(15,15,15,.92);color:#fff;border-radius:999px;padding:5px 6px 5px 12px;font-family:var(--mono);font-size:12px;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.variant-switch span{opacity:.7;margin-right:4px}
.variant-switch a{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.25)}
.variant-switch a:hover{background:rgba(255,255,255,.15)}
.variant-switch a[aria-current="page"]{background:var(--lime);color:var(--ink);border-color:var(--lime);font-weight:700}
.variant-switch a.home{width:auto;padding:0 10px;border-radius:999px}

/* stopka wspólna */
.footer{border-top:1px solid var(--line);padding:48px 0 32px;font-size:14px;color:var(--muted)}
.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:32px}
.footer h4{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);margin-bottom:12px;font-family:var(--mono);font-weight:500}
.footer li{margin:6px 0}
.footer a{text-decoration:none;color:var(--muted)}
.footer a:hover{color:var(--ink);text-decoration:underline}
.footer .brandline{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.footer .brandline img{height:34px;width:auto}
.footer .legal{margin-top:36px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:13px}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.footer-grid{grid-template-columns:1fr}}

/* bardzo wąskie ekrany (320 px): przyciski mogą się zawijać */
@media (max-width:400px){.btn{white-space:normal;text-align:center}.container{padding:0 16px}}

/* animacje zredukowane */
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
