/* ===== Sigmapack — wersja 2026 ===== */
:root{
  --bg:#070d16;
  --bg-2:#0a1421;
  --surface:rgba(255,255,255,.045);
  --surface-2:rgba(255,255,255,.075);
  --brand:#13233b;
  --accent:#c07f2c;
  --accent-2:#e9a950;
  --green:#4ea87a;
  --green-deep:#2f6f4f;
  --text:#eaf0f7;
  --muted:#93a5bb;
  --line:rgba(255,255,255,.10);
  --line-2:rgba(255,255,255,.18);
  --paper:#f5f6f8;
  --paper-line:#e3e7ec;
  --ink:#13233b;
  --ink-muted:#5a6470;
  --r-xl:32px; --r-lg:24px; --r-md:16px; --r-sm:10px;
  --shell:1180px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --display:"Bricolage Grotesque","Space Grotesk",system-ui,sans-serif;
  --body:"Inter",system-ui,-apple-system,sans-serif;
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--body);
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
  font-size:16px;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--accent);color:#0b1420}

.shell{max-width:var(--shell);margin:0 auto;padding:0 24px}
.shell-narrow{max-width:820px}

/* ---- typografia ---- */
h1,h2,h3,h4{font-family:var(--display);line-height:1.05;letter-spacing:-.035em;font-weight:700}
.display{
  font-size:clamp(2.9rem,8vw,6.2rem);
  font-weight:800;
  line-height:.93;
  letter-spacing:-.05em;
  text-wrap:balance;
}
.display em{font-style:normal;color:var(--accent-2)}
/* slowa wjezdzaja pojedynczo, akcent przelewa sie gradientem */
.display .w{display:inline-block;animation:wordIn .65s var(--ease) both;animation-delay:var(--d,0s)}
.display .hl{
  background:linear-gradient(100deg,#e9a950,#c07f2c,#4ea87a,#e9a950);
  background-size:300% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:wordIn .65s var(--ease) both,sheen 7s linear infinite;
  animation-delay:var(--d,0s),calc(var(--d,0s) + .9s);
}
@keyframes wordIn{from{opacity:0;transform:translateY(.4em) rotate(1.5deg)}to{opacity:1;transform:none}}
@keyframes sheen{to{background-position:300% 0}}
h2{font-size:clamp(2rem,4.4vw,3.4rem);font-weight:700;letter-spacing:-.04em;text-wrap:balance;margin-bottom:16px}
h3{font-size:1.2rem;margin-bottom:10px;letter-spacing:-.02em}
.lede{font-size:clamp(1.05rem,1.6vw,1.28rem);color:var(--muted);max-width:56ch;text-wrap:pretty}
.eyebrow{
  font-family:var(--display);font-size:.78rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.18em;
  color:var(--accent-2);margin-bottom:18px;display:block;
}
.band-light .eyebrow{color:#96601f}
.sub{color:var(--muted);max-width:60ch;margin-bottom:44px;font-size:1.05rem;text-wrap:pretty}

/* ---- ziarno + pasek postepu ---- */
.grain{
  position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.3;
  background-image:var(--noise);
  mix-blend-mode:overlay;
}
.scroll-progress{
  position:fixed;top:0;left:0;height:2px;width:0;z-index:9999;
  background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--green));
}

/* ---- przyciski ---- */
.btn{
  --btn-bg:var(--surface-2);--btn-fg:var(--text);
  position:relative;display:inline-flex;align-items:center;gap:9px;
  font-family:var(--display);font-weight:600;font-size:1rem;letter-spacing:-.01em;
  text-decoration:none;padding:15px 28px;border-radius:999px;border:1px solid var(--line-2);
  background:var(--btn-bg);color:var(--btn-fg);cursor:pointer;overflow:hidden;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .25s,border-color .25s;
}
.btn::after{
  content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;
  background:radial-gradient(120px 60px at var(--bx,50%) var(--by,50%),rgba(255,255,255,.22),transparent 70%);
  transition:opacity .3s;
}
.btn:hover{transform:translateY(-3px)}
.btn:hover::after{opacity:1}
.btn-accent{--btn-bg:var(--accent);--btn-fg:#12203a;border-color:transparent;box-shadow:0 10px 34px -10px rgba(192,127,44,.85)}
.btn-accent:hover{box-shadow:0 18px 46px -12px rgba(192,127,44,1)}
.btn-ghost{--btn-bg:transparent}
.btn-ghost:hover{border-color:var(--accent-2);color:var(--accent-2)}
.btn-sm{padding:10px 20px;font-size:.9rem}
.btn-lg{padding:19px 40px;font-size:1.18rem}
.btn-block{width:100%;justify-content:center;margin-top:20px}
.band-light .btn-ghost{border-color:rgba(19,35,59,.22);color:var(--ink)}
.band-light .btn-ghost:hover{border-color:#96601f;color:#96601f}

.pill{
  display:inline-flex;align-items:center;gap:9px;
  font-size:.85rem;font-weight:500;color:var(--muted);
  background:var(--surface);border:1px solid var(--line);
  padding:8px 16px;border-radius:999px;backdrop-filter:blur(12px);
}
.live-dot{
  width:7px;height:7px;border-radius:50%;background:var(--green);
  box-shadow:0 0 0 0 rgba(78,168,122,.65);animation:pulse 2.2s infinite;flex:none;
}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(78,168,122,0)}100%{box-shadow:0 0 0 0 rgba(78,168,122,0)}}

/* ---- nawigacja ---- */
.nav{
  position:sticky;top:0;z-index:100;
  background:color-mix(in srgb,var(--bg) 72%,transparent);
  backdrop-filter:blur(20px) saturate(160%);
  border-bottom:1px solid var(--line);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:70px;gap:20px}
.logo{
  display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);
  font-family:var(--display);font-weight:700;font-size:1.16rem;letter-spacing:-.03em;
}
.logo-mark{
  width:32px;height:32px;border-radius:9px;display:grid;place-items:center;flex:none;
  background:linear-gradient(140deg,var(--accent-2),var(--accent));
  color:#12203a;font-size:1.2rem;font-family:Georgia,serif;
}
.logo b{color:var(--accent-2);font-weight:700}
.nav-links{display:flex;gap:6px}
.nav-links a{
  color:var(--muted);text-decoration:none;font-size:.92rem;font-weight:500;
  padding:8px 14px;border-radius:999px;transition:color .2s,background .2s;
}
.nav-links a:hover{color:var(--text);background:var(--surface)}
/* wyrozniony wpis w nawigacji — druga usluga, ma sie rzucac w oczy */
.nav-links a.nav-hot{
  font-family:var(--display);font-size:1.05rem;font-weight:700;letter-spacing:-.025em;
  color:var(--accent-2);
}
.nav-links a.nav-hot:hover{
  color:var(--accent-2);
  background:color-mix(in srgb,var(--accent) 20%,transparent);
}

/* ---- hero ---- */
.hero{position:relative;padding:88px 0 0;overflow:hidden}
.hero-aurora{
  position:absolute;inset:-20% -10% auto;height:820px;pointer-events:none;filter:blur(10px);
  background:
    radial-gradient(680px 420px at 76% 12%,rgba(192,127,44,.34),transparent 62%),
    radial-gradient(560px 380px at 14% 42%,rgba(47,111,79,.26),transparent 64%),
    radial-gradient(900px 500px at 50% -10%,rgba(19,35,59,.9),transparent 70%);
}
.hero-inner{position:relative}
.hero .lede{margin:26px 0 34px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero-note{font-size:.86rem;color:var(--muted)}

/* ---- ticker ---- */
.ticker{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:20px 0;margin-top:96px;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
}
.ticker-track{display:flex;gap:56px;width:max-content;animation:marquee 34s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker span{
  font-family:var(--display);font-size:1.15rem;font-weight:600;color:var(--muted);
  letter-spacing:-.02em;white-space:nowrap;display:flex;align-items:center;gap:12px;
}
.ticker span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);flex:none}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---- sekcje / pasma ---- */
.band{padding:110px 0;position:relative}
.band-light{
  --text:var(--ink);--muted:var(--ink-muted);--line:var(--paper-line);--line-2:#d5dbe3;
  --surface:#fff;--surface-2:#fff;
  background:var(--paper);color:var(--ink);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
}
.band-light + .band-light{border-radius:0}
.band-tight{padding-top:0}

/* ---- karty / bento ---- */
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px;transition:transform .4s var(--ease),border-color .3s,background .3s;
}
.band-light .card{box-shadow:0 1px 2px rgba(19,35,59,.04)}
.card:hover{transform:translateY(-4px);border-color:var(--line-2)}
.card p{color:var(--muted);font-size:.97rem;text-wrap:pretty}
.card-icon{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  font-size:1.35rem;margin-bottom:18px;
  background:color-mix(in srgb,var(--accent) 18%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 34%,transparent);
}
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.bento > *{grid-column:span 2}
.bento .span-3{grid-column:span 3}
.bento .span-4{grid-column:span 4}
.bento .span-6{grid-column:span 6}
.bento-feature{
  display:flex;flex-direction:column;justify-content:space-between;gap:26px;
  background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 22%,transparent),transparent 62%);
}
.band-light .bento-feature{background:linear-gradient(150deg,#fbf1e2,#fff 62%)}
.big-num{
  font-family:var(--display);font-size:clamp(2.6rem,5vw,3.6rem);font-weight:800;
  letter-spacing:-.05em;line-height:1;
}
.big-num.is-green{color:var(--green-deep)}
.band:not(.band-light) .big-num.is-green{color:var(--green)}
.big-num.is-accent{color:#96601f}
.band:not(.band-light) .big-num.is-accent{color:var(--accent-2)}
.big-num + p{margin-top:8px}

.tag{
  display:inline-block;font-family:var(--display);font-size:.74rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;padding:6px 14px;border-radius:999px;
  background:var(--surface-2);color:var(--muted);margin-bottom:16px;border:1px solid var(--line);
}
.band-light .tag{background:#eaedf1;border-color:transparent}
.tag-accent{background:var(--accent);color:#12203a;border-color:transparent}
.tag-green{background:var(--green-deep);color:#fff;border-color:transparent}
.card-highlight{border-color:color-mix(in srgb,var(--green) 55%,transparent)}
.band-light .card-highlight{background:linear-gradient(160deg,#f1f8f4,#fff)}

/* ---- kroki ---- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.step{position:relative;overflow:hidden}
.step-ghost{
  position:absolute;top:-18px;right:8px;font-family:var(--display);font-weight:800;
  font-size:7rem;line-height:1;letter-spacing:-.06em;color:var(--text);opacity:.07;pointer-events:none;
}

/* ---- listy ---- */
.checks{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:10px 28px;margin-top:34px}
.checks li{position:relative;padding-left:32px;font-size:.97rem;color:var(--muted)}
.checks li::before{
  content:"";position:absolute;left:0;top:5px;width:20px;height:20px;border-radius:7px;
  background:color-mix(in srgb,var(--accent) 20%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 42%,transparent);
}
.checks li::after{
  content:"";position:absolute;left:7px;top:10px;width:5px;height:9px;
  border:solid var(--accent-2);border-width:0 2px 2px 0;transform:rotate(43deg);
}
.band-light .checks li::after{border-color:#96601f}
.arrows{list-style:none}
.arrows li{
  position:relative;padding:11px 0 11px 28px;font-size:.95rem;color:var(--muted);
  border-bottom:1px solid var(--line);
}
.arrows li:last-child{border-bottom:none}
.arrows li::before{content:"\2192";position:absolute;left:0;color:var(--accent-2);font-weight:700}
.band-light .arrows li::before{color:#96601f}
.arrows strong{color:var(--text)}

.note{
  margin-top:34px;padding:18px 24px;border-radius:var(--r-md);
  background:color-mix(in srgb,var(--accent) 12%,transparent);
  border-left:3px solid var(--accent);font-size:.94rem;color:var(--muted);text-wrap:pretty;
}
.note strong{color:var(--text)}

/* ---- tabele ---- */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
table.price{width:100%;border-collapse:collapse;min-width:540px}
table.price th{
  font-family:var(--display);text-align:left;font-size:.74rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;color:var(--muted);
  padding:16px 24px;border-bottom:1px solid var(--line);
}
table.price td{padding:16px 24px;border-bottom:1px solid var(--line);font-size:.96rem;vertical-align:top}
table.price tr:last-child td{border-bottom:none}
table.price td:last-child{text-align:right;font-family:var(--display);font-weight:600;white-space:nowrap;letter-spacing:-.02em}
table.price small{color:var(--muted);display:block;margin-top:3px;font-size:.83rem}
.mini{width:100%;border-collapse:collapse;margin-top:14px}
.mini td{padding:11px 0;border-bottom:1px dashed var(--line);font-size:.95rem;color:var(--muted)}
.mini tr:last-child td{border-bottom:none}
.mini td:last-child{text-align:right;font-family:var(--display);font-weight:600;color:var(--text)}

/* ---- wlasna umowa kurierska ---- */
.own{
  margin-top:24px;padding:40px;border-radius:var(--r-xl);color:#eaf0f7;
  background:
    radial-gradient(560px 320px at 88% 8%,rgba(192,127,44,.32),transparent 66%),
    linear-gradient(160deg,#13233b,#0b1524);
  display:grid;grid-template-columns:1.05fr 1fr;gap:38px;align-items:center;
}
.own h3{font-size:1.6rem;color:#fff;margin-bottom:12px}
.own p{color:#a3b0c2;text-wrap:pretty}
.own p strong{color:#fff}
.own .arrows li{color:#c2ccd9;border-bottom-color:rgba(255,255,255,.1)}
.own .arrows strong{color:#4ea87a}
.own .arrows li::before{color:#e9a950}

/* ---- kalkulator ---- */
.calc{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:start}
.calc-panel{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:32px;
  backdrop-filter:blur(14px);
}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:5px;background:rgba(255,255,255,.05);
  border:1px solid var(--line);border-radius:14px;padding:5px}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label{
  text-align:center;cursor:pointer;border-radius:10px;padding:11px 8px;
  font-family:var(--display);font-weight:600;font-size:.88rem;color:var(--muted);
  transition:background .25s var(--ease),color .25s;
}
.seg label:hover{color:var(--text)}
.seg input:checked + label{background:var(--accent);color:#12203a}
.seg input:focus-visible + label{outline:2px solid var(--accent-2);outline-offset:2px}
.mode-block{padding-bottom:26px;margin-bottom:26px;border-bottom:1px solid var(--line)}
.panel-title{font-family:var(--display);font-weight:600;margin-bottom:14px;font-size:1rem}
.panel-title small{color:var(--muted);font-weight:400;font-family:var(--body)}
.hint{font-size:.83rem;color:var(--muted);margin-top:13px;text-wrap:pretty}

.field{margin-bottom:22px}
.field label{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  font-size:.92rem;color:var(--muted);margin-bottom:10px;font-weight:500}
.field output{font-family:var(--display);font-weight:700;font-size:1.12rem;color:var(--accent-2);letter-spacing:-.02em}
input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:999px;
  background:rgba(255,255,255,.14);outline:none;cursor:pointer;
}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;
  background:var(--accent-2);border:4px solid #101d2f;
  box-shadow:0 3px 14px rgba(233,169,80,.5);transition:transform .2s var(--ease);
}
input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.14)}
input[type=range]::-moz-range-thumb{
  width:18px;height:18px;border-radius:50%;background:var(--accent-2);border:4px solid #101d2f;
}
.group{margin-top:30px;padding-top:26px;border-top:1px solid var(--line)}
.calc-advanced{margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
.calc-advanced summary{cursor:pointer;font-weight:600;color:var(--muted);font-size:.92rem;list-style:none;
  font-family:var(--display)}
.calc-advanced summary::-webkit-details-marker{display:none}
.courier-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:14px}
.courier-grid label{
  display:flex;justify-content:space-between;align-items:center;gap:8px;
  font-size:.85rem;color:var(--muted);background:rgba(255,255,255,.05);
  border-radius:11px;padding:9px 14px;
}
.courier-grid input{
  width:62px;background:rgba(0,0,0,.3);color:var(--text);border:1px solid var(--line-2);
  border-radius:8px;padding:6px 9px;font-family:var(--display);font-weight:600;text-align:right;
}

.result{
  position:sticky;top:92px;border-radius:var(--r-xl);padding:32px;
  background:linear-gradient(165deg,rgba(255,255,255,.1),rgba(255,255,255,.03));
  border:1px solid var(--line-2);backdrop-filter:blur(18px);
  box-shadow:0 40px 90px -45px #000;
}
.kpi{
  background:linear-gradient(150deg,rgba(192,127,44,.24),rgba(19,35,59,.5));
  border:1px solid color-mix(in srgb,var(--accent) 34%,transparent);
  border-radius:var(--r-lg);padding:24px;margin-bottom:24px;
}
.kpi-label{display:block;font-size:.8rem;color:var(--muted);margin-bottom:6px;text-wrap:pretty}
.kpi-value{font-family:var(--display);font-size:clamp(2.3rem,4.6vw,3.1rem);font-weight:800;
  letter-spacing:-.05em;color:var(--accent-2);line-height:1}
.breakdown{width:100%;border-collapse:collapse}
.breakdown td{padding:9px 0;font-size:.92rem;color:var(--muted);border-bottom:1px dashed var(--line)}
.breakdown td:last-child{text-align:right;font-family:var(--display);font-weight:600;color:var(--text)}
.breakdown .sum td{color:var(--text);font-weight:600;border-bottom:1px solid var(--line-2)}
.breakdown .total td{font-family:var(--display);font-size:1.2rem;font-weight:700;color:var(--text);
  border-bottom:none;padding-top:14px}
.result .hint{margin-top:16px;font-size:.8rem}

/* ---- systemy: karty aplikacji ---- */
.app-price{
  display:flex;align-items:baseline;gap:9px;
  margin-top:20px;padding-top:18px;border-top:1px solid var(--line);
}
.app-price b{
  font-family:var(--display);font-size:1.85rem;font-weight:800;
  letter-spacing:-.045em;line-height:1;color:#96601f;
}
.band:not(.band-light) .app-price b{color:var(--accent-2)}
.app-price span{font-size:.85rem;color:var(--muted)}
#aplikacje .card{display:flex;flex-direction:column}
#aplikacje .arrows{flex:1}
/* modul flagowy: lista funkcji w dwoch kolumnach */
.feat-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 36px;margin-top:22px}
.feat-2col li:nth-last-child(2){border-bottom:none}
.chips{display:flex;flex-wrap:wrap;gap:9px}

/* ---- systemy: podglad raportu ---- */
.report-grid{display:grid;grid-template-columns:1fr .85fr;gap:44px;align-items:start}
.report{
  border:1px solid var(--line-2);border-radius:var(--r-xl);overflow:hidden;
  background:linear-gradient(165deg,rgba(255,255,255,.1),rgba(255,255,255,.03));
  backdrop-filter:blur(18px);box-shadow:0 40px 90px -45px #000;
}
.report-head{
  display:flex;align-items:center;gap:12px;
  padding:16px 20px;border-bottom:1px solid var(--line);
}
.report-avatar{
  width:38px;height:38px;border-radius:11px;display:grid;place-items:center;flex:none;
  background:linear-gradient(140deg,var(--accent-2),var(--accent));
  color:#12203a;font-family:Georgia,serif;font-size:1.25rem;
}
.report-head div{display:flex;flex-direction:column;line-height:1.3;flex:1;min-width:0}
.report-head b{font-size:.94rem;font-weight:600}
.report-head span{font-size:.76rem;color:var(--muted)}
.report-head time{font-size:.76rem;color:var(--muted);flex:none}
.report-body{padding:20px}
.report-title{
  font-family:var(--display);font-weight:700;font-size:1.05rem;
  letter-spacing:-.02em;margin-bottom:14px;
}
.report-line{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:9px 0;border-bottom:1px dashed var(--line);font-size:.92rem;color:var(--muted);
}
.report-line b{font-family:var(--display);font-weight:600;color:var(--text);white-space:nowrap}
.report-line i{font-style:normal;font-size:.78rem;margin-left:5px}
.report-line i.up{color:var(--green)}
.report-alert{
  margin-top:14px;padding:11px 14px;border-radius:12px;font-size:.85rem;
  background:color-mix(in srgb,var(--accent) 15%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 32%,transparent);
  color:var(--text);text-wrap:pretty;
}
.report-alert.is-ok{
  background:color-mix(in srgb,var(--green) 15%,transparent);
  border-color:color-mix(in srgb,var(--green) 32%,transparent);
}

/* ---- FAQ ---- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer;list-style:none;padding:24px 46px 24px 0;position:relative;
  font-family:var(--display);font-weight:600;font-size:clamp(1.02rem,1.7vw,1.22rem);
  letter-spacing:-.02em;transition:color .2s;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:#96601f}
.faq summary::after{
  content:"";position:absolute;right:8px;top:50%;width:13px;height:13px;
  border:solid currentColor;border-width:0 2px 2px 0;
  transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--ease);opacity:.5;
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg);opacity:1}
.faq p{padding:0 60px 26px 0;color:var(--muted);text-wrap:pretty}

/* ---- kontakt / stopka ---- */
.contact{text-align:center;position:relative;overflow:hidden}
.contact .aurora{
  position:absolute;inset:auto -10% -40%;height:600px;pointer-events:none;
  background:radial-gradient(700px 380px at 50% 60%,rgba(192,127,44,.3),transparent 66%);
}
.contact .shell{position:relative}
.contact .sub{margin:0 auto 44px}
.mail-link{
  font-family:var(--display);font-size:clamp(1.5rem,4.4vw,3rem);font-weight:700;
  letter-spacing:-.045em;color:var(--text);text-decoration:none;
  border-bottom:2px solid color-mix(in srgb,var(--accent) 55%,transparent);
  padding-bottom:6px;transition:color .3s,border-color .3s;
}
.mail-link:hover{color:var(--accent-2);border-color:var(--accent-2)}
.footer{border-top:1px solid var(--line);padding:34px 0}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;
  color:var(--muted);font-size:.85rem}

/* ---- reveal ----
   Ukrywamy dopiero, gdy JS potwierdzi, że umie to odsłonić.
   Bez skryptu (albo przy błędzie) treść jest po prostu widoczna. */
.has-reveal [data-reveal]{opacity:0;transform:translateY(26px);
  transition:opacity .8s var(--ease),transform .8s var(--ease)}
.has-reveal [data-reveal].in{opacity:1;transform:none}

/* ---- responsywnosc ---- */
@media (max-width:1000px){
  .calc{grid-template-columns:1fr}
  .result{position:static}
  .own{grid-template-columns:1fr;gap:26px;padding:32px}
  .report-grid{grid-template-columns:1fr;gap:32px}
  .feat-2col{grid-template-columns:1fr}
  .bento > *{grid-column:span 3}
  .bento .span-4,.bento .span-6{grid-column:span 6}
  .steps{grid-template-columns:1fr}
}
@media (max-width:680px){
  .band{padding:76px 0}
  .hero{padding-top:56px}
  .nav-links{display:none}
  /* Na telefonie każda karta na całą szerokość — także te z klasą span-N
     (sama reguła .bento > * przegrywała z bardziej szczegółowym .bento .span-3). */
  .bento > *,.bento .span-3,.bento .span-4,.bento .span-6{grid-column:span 6}
  .checks{grid-template-columns:1fr}
  .courier-grid{grid-template-columns:1fr}
  .card,.calc-panel,.result{padding:24px}
  .faq p{padding-right:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  [data-reveal]{opacity:1;transform:none}
}

/* ===== Panel TikTok Shop (SaaS) — własny kolor, żeby odróżniał się od fulfillmentu ===== */
:root{
  --saas:#25f4ee;        /* turkus TikToka */
  --saas-2:#fe2c55;      /* róż TikToka */
  --saas-deep:#08858a;   /* turkus czytelny na jasnym tle */
}

/* wpis w nawigacji: pogrubiony, turkusowy, z obwódką — widoczny także na telefonie */
.nav-links a.nav-saas{
  font-family:var(--display);font-size:1.02rem;font-weight:800;letter-spacing:-.02em;
  color:var(--saas);
  border:1px solid color-mix(in srgb,var(--saas) 45%,transparent);
  background:color-mix(in srgb,var(--saas) 9%,transparent);
  display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
}
.nav-saas-pre{white-space:pre}
.nav-links a.nav-saas::before{
  content:"";width:7px;height:7px;border-radius:50%;flex:none;
  background:var(--saas-2);box-shadow:0 0 0 3px color-mix(in srgb,var(--saas-2) 25%,transparent);
}
.nav-links a.nav-saas:hover,.nav-links a.nav-saas[aria-current="page"]{
  color:#04161a;background:var(--saas);border-color:var(--saas);
}

.btn-saas{
  --btn-bg:var(--saas);--btn-fg:#04161a;border-color:transparent;
  box-shadow:0 10px 34px -10px color-mix(in srgb,var(--saas) 80%,transparent);
}
.btn-saas:hover{box-shadow:0 18px 46px -12px var(--saas)}
.saas .btn-ghost:hover{border-color:var(--saas);color:var(--saas)}

/* --- strona SaaS: akcenty w turkusie zamiast bursztynu --- */
.saas .eyebrow{color:var(--saas)}
.saas .band-light .eyebrow{color:var(--saas-deep)}
.saas .arrows li::before{color:var(--saas)}
.saas .band-light .arrows li::before{color:var(--saas-deep)}
.saas .display .hl{
  background:linear-gradient(100deg,var(--saas),#7af7f3,var(--saas-2),var(--saas));
  background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
}
.saas .hero-aurora{
  background:
    radial-gradient(620px 380px at 78% 10%,color-mix(in srgb,var(--saas) 22%,transparent),transparent 65%),
    radial-gradient(520px 340px at 12% 30%,color-mix(in srgb,var(--saas-2) 16%,transparent),transparent 65%);
}
.saas .contact .aurora{
  background:radial-gradient(700px 380px at 50% 60%,color-mix(in srgb,var(--saas) 22%,transparent),transparent 66%);
}
.saas .tag-accent{background:var(--saas);color:#04161a}
.saas .band-light .tag-accent{background:var(--saas-deep);color:#fff}
.saas .faq summary:hover{color:var(--saas-deep)}
/* funkcja w przygotowaniu — widoczna, ale wyraźnie „jeszcze nie” */
.tag-soon{background:transparent;border:1px dashed currentColor;color:var(--ink-muted)}
.card-soon{border-style:dashed;background:transparent!important}
.card-soon h3{color:var(--ink-muted)}

.saas-hero{display:grid;grid-template-columns:1.08fr .92fr;gap:48px;align-items:center}
.hero-trust{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:22px;font-size:.88rem;color:var(--muted)}
.hero-trust span{display:inline-flex;align-items:center;gap:7px}
.hero-trust span::before{content:"\2713";color:var(--saas);font-weight:700}

/* makieta listy zamówień w hero */
.mock{
  border:1px solid var(--line-2);border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(170deg,#0e1b2b,#0a1320);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.03) inset;
  font-size:.86rem;
}
.mock-bar{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--line)}
.mock-bar b{font-family:var(--display);font-size:.95rem;flex:1}
.mock-bar .pill{padding:4px 10px;font-size:.74rem}
.mock-row{display:grid;grid-template-columns:18px 1fr auto;gap:12px;align-items:center;
  padding:12px 16px;border-bottom:1px solid var(--line)}
.mock-row:last-of-type{border-bottom:none}
.mock-check{width:16px;height:16px;border-radius:5px;border:1.5px solid var(--line-2)}
.mock-row.is-on .mock-check{background:var(--saas);border-color:var(--saas);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%2304161a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.mock-row strong{display:block;font-weight:600;font-size:.88rem}
.mock-row small{color:var(--muted);font-size:.76rem}
.mock-st{font-size:.72rem;font-weight:600;padding:4px 9px;border-radius:999px;white-space:nowrap}
.mock-st.new{background:color-mix(in srgb,var(--saas) 16%,transparent);color:var(--saas)}
.mock-st.done{background:color-mix(in srgb,var(--green) 18%,transparent);color:var(--green)}
.mock-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:13px 16px;background:rgba(255,255,255,.03);border-top:1px solid var(--line)}
.mock-foot span{color:var(--muted);font-size:.78rem}
.mock-foot .mock-btn{font-family:var(--display);font-weight:700;font-size:.82rem;color:#04161a;
  background:var(--saas);padding:8px 14px;border-radius:10px;white-space:nowrap}

/* cennik SaaS */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch}
.plans.plans-3{grid-template-columns:repeat(3,1fr)}
.plan{display:flex;flex-direction:column}
.plan .arrows{margin:18px 0 6px;flex:1}
.plan-price{font-family:var(--display);font-weight:800;font-size:clamp(2.4rem,5vw,3.2rem);
  letter-spacing:-.05em;line-height:1;margin-top:14px}
.plan-price small{font-size:.9rem;font-weight:500;color:var(--muted);letter-spacing:0;margin-left:6px}
.plan-main{border:2px solid var(--saas-deep);background:linear-gradient(160deg,#e9fbfb,#fff 60%)}
.plan-main .plan-price{color:var(--saas-deep)}
.plan .btn{justify-content:center;margin-top:18px}

/* dolny pasek z CTA — tylko telefon (ruch z reklam) */
.sticky-cta{display:none}

@media (max-width:1100px){
  /* średnie ekrany: w menu tylko wyróżnione wpisy, reszta jest na stronie */
  .nav-links a:not(.nav-saas):not(.nav-hot):not([aria-current]){display:none}
  .nav-links a{white-space:nowrap}
}
@media (max-width:1000px){
  .saas-hero{grid-template-columns:1fr;gap:40px}
  .plans,.plans.plans-3{grid-template-columns:1fr}
}
@media (max-width:680px){
  /* menu chowa się na telefonie — zostaje tylko wyróżniony wpis SaaS */
  .nav-links{display:flex}
  .nav-links a:not(.nav-saas){display:none}
  .nav-links a.nav-saas{font-size:.9rem;padding:7px 12px}
  .nav-saas-pre{display:none}
  .nav-inner > .btn-sm{display:none}
  .saas .nav-inner > .btn-sm{display:inline-flex}
  .saas .nav-links{display:none}
  .sticky-cta{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:120;gap:12px;align-items:center;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom));
    background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px);
    border-top:1px solid var(--line);
    transform:translateY(110%);transition:transform .35s var(--ease);
  }
  .sticky-cta.show{transform:none}
  .sticky-cta .btn{flex:1;justify-content:center;padding:14px 18px}
  .sticky-cta small{color:var(--muted);font-size:.74rem;line-height:1.3;max-width:34%}
  .saas .footer{padding-bottom:96px}
}