/* ==========================================================================
   AMPsilo — arkusz stylów
   Dom Projekt sp. z o.o. | ampsilo.pro
   Jeden plik, bez zależności zewnętrznych (wydajność + brak CDN).
   ========================================================================== */

:root{
  /* Kolory marki */
  --bg:            #080F1C;
  --bg-2:          #0C1526;
  --surface:       #111D33;
  --surface-2:     #16253E;
  --line:          #1E3352;
  --line-soft:     #16263F;

  --text:          #E8F0FA;
  --text-muted:    #9AAEC8;
  --text-dim:      #6D82A0;

  --accent:        #22D3EE;   /* cyan — energia elektryczna */
  --accent-2:      #3B82F6;   /* niebieski — sieć */
  --accent-soft:   rgba(34,211,238,.12);
  --heat:          #F59E0B;   /* bursztyn — ciepło / kogeneracja */
  --heat-soft:     rgba(245,158,11,.12);
  --green:         #34D399;   /* PV / oszczędności */
  --green-soft:    rgba(52,211,153,.12);
  --danger:        #F87171;

  --radius:        14px;
  --radius-sm:     10px;
  --radius-lg:     22px;
  --shadow:        0 18px 40px -18px rgba(0,0,0,.75);
  --shadow-soft:   0 8px 24px -14px rgba(0,0,0,.7);

  --maxw:          1180px;
  --gutter:        clamp(16px, 4vw, 32px);

  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
          "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  color-scheme: dark;
}

/* --------------------------------------------------------- reset / bazowe */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; }
}
body{
  margin:0;
  font-family:var(--font);
  font-size:16px;
  line-height:1.65;
  color:var(--text);
  background:var(--bg);
  background-image:
    radial-gradient(900px 500px at 15% -10%, rgba(34,211,238,.10), transparent 60%),
    radial-gradient(800px 480px at 100% 0%, rgba(59,130,246,.10), transparent 55%);
  background-attachment:fixed;
  -webkit-font-smoothing:antialiased;
}
img,svg,video{ max-width:100%; height:auto; display:block; }
a{ color:var(--accent); text-decoration:none; }
a:hover{ text-decoration:underline; }
button{ font:inherit; }
hr{ border:0; border-top:1px solid var(--line); margin:32px 0; }

h1,h2,h3,h4{ line-height:1.2; margin:0 0 .5em; font-weight:700; letter-spacing:-.02em; }
h1{ font-size:clamp(2rem, 1.3rem + 3.2vw, 3.35rem); }
h2{ font-size:clamp(1.55rem, 1.15rem + 1.8vw, 2.35rem); }
h3{ font-size:clamp(1.15rem, 1rem + .7vw, 1.4rem); }
h4{ font-size:1.02rem; }
p{ margin:0 0 1em; }
strong{ color:#fff; font-weight:650; }
small{ font-size:.85rem; }

::selection{ background:rgba(34,211,238,.28); color:#fff; }

:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:3px;
  border-radius:6px;
}

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--accent); color:#04131A; padding:12px 20px;
  border-radius:0 0 var(--radius-sm) 0; font-weight:700;
}
.skip-link:focus{ left:0; }

.visually-hidden{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* --------------------------------------------------------------- layout */
.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:clamp(48px, 7vw, 92px); }
.section--tight{ padding-block:clamp(32px, 4.5vw, 56px); }
.section--alt{ background:linear-gradient(180deg, transparent, rgba(17,29,51,.55) 12%, rgba(17,29,51,.55) 88%, transparent); }

.grid{ display:grid; gap:22px; }
/* Bez tego element siatki nie skurczy się poniżej szerokości swojej zawartości
   (np. tabeli) i wypycha stronę w poziomie na wąskich ekranach. */
.grid > *, .calc > *, .hero__inner > *{ min-width:0; }
@media (min-width:700px){
  .grid--2{ grid-template-columns:repeat(2,1fr); }
  .grid--3{ grid-template-columns:repeat(2,1fr); }
  .grid--4{ grid-template-columns:repeat(2,1fr); }
}
@media (min-width:980px){
  .grid--3{ grid-template-columns:repeat(3,1fr); }
  .grid--4{ grid-template-columns:repeat(4,1fr); }
}

.section-head{ max-width:70ch; margin-bottom:clamp(24px,3.5vw,44px); }
.section-head p{ color:var(--text-muted); font-size:1.05rem; margin-bottom:0; }

.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.76rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); background:var(--accent-soft);
  border:1px solid rgba(34,211,238,.28);
  padding:6px 12px; border-radius:999px; margin-bottom:16px;
}
.eyebrow--heat{ color:var(--heat); background:var(--heat-soft); border-color:rgba(245,158,11,.3); }

.lead{ font-size:clamp(1.02rem,.97rem + .35vw,1.2rem); color:var(--text-muted); }

/* --------------------------------------------------------------- header */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(8,15,28,.82);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-soft);
}
.site-header__inner{
  display:flex; align-items:center; gap:16px;
  min-height:68px;
}
.brand{ display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:-.02em; color:var(--text); font-size:1.12rem; }
.brand:hover{ text-decoration:none; }
.brand img{ width:34px; height:34px; border-radius:9px; }
.brand span b{ color:var(--accent); font-weight:800; }

.nav{ margin-left:auto; }
.nav__list{ display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0; }
.nav__list a{
  display:block; padding:9px 13px; border-radius:9px;
  color:var(--text-muted); font-size:.94rem; font-weight:550;
}
.nav__list a:hover{ color:var(--text); background:var(--surface); text-decoration:none; }
.nav__list a[aria-current="page"]{ color:var(--accent); background:var(--accent-soft); }

.nav-toggle{
  margin-left:auto; display:none;
  background:var(--surface); border:1px solid var(--line);
  color:var(--text); border-radius:10px; padding:9px 12px; cursor:pointer;
}
@media (max-width:960px){
  .nav-toggle{ display:inline-flex; align-items:center; gap:8px; }
  .nav{
    position:fixed; inset:68px 0 auto 0; margin:0;
    background:var(--bg-2); border-bottom:1px solid var(--line);
    padding:12px var(--gutter) 20px; box-shadow:var(--shadow);
    max-height:calc(100dvh - 68px); overflow-y:auto;
  }
  .nav[hidden]{ display:none; }
  .nav__list{ flex-direction:column; align-items:stretch; gap:2px; }
  .nav__list a{ padding:12px 14px; font-size:1rem; }
  .nav .btn{ margin-top:10px; justify-content:center; }
}

/* --------------------------------------------------------------- buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:13px 22px; border-radius:11px;
  font-weight:650; font-size:.97rem; line-height:1.2;
  border:1px solid transparent; cursor:pointer; text-align:center;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.btn:hover{ text-decoration:none; transform:translateY(-1px); }
.btn:active{ transform:translateY(0); }
.btn--primary{
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  color:#04121B; box-shadow:0 10px 26px -12px rgba(34,211,238,.85);
}
.btn--primary:hover{ box-shadow:0 14px 32px -12px rgba(34,211,238,1); }
.btn--ghost{ background:var(--surface); color:var(--text); border-color:var(--line); }
.btn--ghost:hover{ border-color:var(--accent); color:var(--accent); }
.btn--heat{ background:linear-gradient(135deg,var(--heat),#EA580C); color:#1B0F02; box-shadow:0 10px 26px -12px rgba(245,158,11,.8); }
.btn--sm{ padding:9px 16px; font-size:.9rem; border-radius:9px; }
.btn--block{ width:100%; }

.btn-row{ display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }

/* --------------------------------------------------------------- cards */
.card{
  background:linear-gradient(180deg, var(--surface), var(--bg-2));
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:clamp(20px,2.4vw,28px);
  box-shadow:var(--shadow-soft);
}
.card h3{ margin-bottom:.4em; }
.card p:last-child{ margin-bottom:0; }
.card p{ color:var(--text-muted); }
.card--link{ transition:border-color .18s ease, transform .18s ease; }
.card--link:hover{ border-color:rgba(34,211,238,.5); transform:translateY(-3px); }

.card__icon{
  width:44px; height:44px; border-radius:12px; margin-bottom:16px;
  display:grid; place-items:center;
  background:var(--accent-soft); border:1px solid rgba(34,211,238,.26);
  font-size:1.25rem;
}
.card__icon--heat{ background:var(--heat-soft); border-color:rgba(245,158,11,.28); }
.card__icon--green{ background:var(--green-soft); border-color:rgba(52,211,153,.28); }

/* --------------------------------------------------------------- hero */
.hero{ position:relative; overflow:hidden; border-bottom:1px solid var(--line-soft); }
.hero__inner{
  display:grid; gap:clamp(28px,4vw,52px); align-items:center;
  padding-block:clamp(44px,6vw,86px);
}
@media (min-width:980px){ .hero__inner{ grid-template-columns:1.08fr .92fr; } }
.hero h1{ margin-bottom:.4em; }
.hero h1 em{ font-style:normal; color:var(--accent); }
.hero__media{ position:relative; }
.hero__media img{
  width:100%; border-radius:var(--radius-lg);
  border:1px solid var(--line); box-shadow:var(--shadow);
}
.hero__badge{
  position:absolute; bottom:-14px; left:-6px;
  background:var(--bg-2); border:1px solid var(--line);
  border-radius:var(--radius); padding:12px 16px; box-shadow:var(--shadow);
  font-size:.86rem; color:var(--text-muted); max-width:230px;
}
.hero__badge b{ display:block; color:var(--accent); font-size:1.35rem; line-height:1.1; }
@media (max-width:640px){ .hero__badge{ position:static; margin-top:16px; max-width:none; } }

/* --------------------------------------------------------------- stats */
.stats{ display:grid; gap:14px; grid-template-columns:repeat(2,1fr); margin-top:34px; }
@media (min-width:820px){ .stats{ grid-template-columns:repeat(4,1fr); } }
.stat{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-sm); padding:16px 18px;
}
.stat b{ display:block; font-size:1.5rem; color:var(--accent); line-height:1.15; letter-spacing:-.02em; }
.stat span{ font-size:.85rem; color:var(--text-muted); }

/* --------------------------------------------------------- tabela specyfikacji */
.table-wrap{ overflow-x:auto; max-width:100%; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); -webkit-overflow-scrolling:touch; }
.card .table-wrap table{ min-width:0; }
table{ width:100%; border-collapse:collapse; min-width:520px; font-size:.95rem; }
caption{ text-align:left; padding:16px 18px 0; color:var(--text-muted); font-size:.9rem; }
th,td{ padding:13px 18px; text-align:left; border-bottom:1px solid var(--line-soft); vertical-align:top; }
thead th{ background:var(--surface-2); color:var(--text); font-size:.82rem; letter-spacing:.06em; text-transform:uppercase; }
tbody tr:last-child td{ border-bottom:0; }
td b{ color:var(--accent); }

/* --------------------------------------------------------- lista korzyści */
.checklist{ list-style:none; padding:0; margin:0 0 1em; display:grid; gap:11px; }
.checklist li{ position:relative; padding-left:31px; color:var(--text-muted); }
.checklist li::before{
  content:""; position:absolute; left:0; top:.45em;
  width:17px; height:17px; border-radius:50%;
  background:var(--accent-soft); border:1px solid rgba(34,211,238,.45);
  box-shadow:inset 0 0 0 3px var(--bg);
}
.checklist--heat li::before{ background:var(--heat-soft); border-color:rgba(245,158,11,.5); }

/* --------------------------------------------------------------- FAQ */
.faq{ display:grid; gap:12px; }
.faq details{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius-sm); overflow:hidden;
}
.faq details[open]{ border-color:rgba(34,211,238,.4); }
.faq summary{
  cursor:pointer; padding:17px 52px 17px 20px; font-weight:600;
  position:relative; list-style:none; color:var(--text);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:"+"; position:absolute; right:20px; top:50%; transform:translateY(-50%);
  font-size:1.4rem; color:var(--accent); line-height:1; font-weight:400;
}
.faq details[open] summary::after{ content:"−"; }
.faq summary:hover{ background:var(--surface-2); }
.faq .faq__a{ padding:0 20px 19px; color:var(--text-muted); }
.faq .faq__a p:last-child{ margin-bottom:0; }

/* --------------------------------------------------------- wizualizacja energii */
.flow{
  background:var(--bg-2); border:1px solid var(--line);
  border-radius:var(--radius-lg); padding:clamp(16px,2.4vw,26px);
  box-shadow:var(--shadow);
}
.flow__controls{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; align-items:center; }
.chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 14px; border-radius:999px; cursor:pointer;
  background:var(--surface); border:1px solid var(--line);
  color:var(--text-muted); font-size:.88rem; font-weight:550;
  transition:all .15s ease;
}
.chip:hover{ color:var(--text); border-color:var(--text-dim); }
.chip[aria-pressed="true"]{ background:var(--accent-soft); border-color:rgba(34,211,238,.55); color:var(--accent); }
.chip[aria-pressed="true"][data-src="chp"]{ background:var(--heat-soft); border-color:rgba(245,158,11,.55); color:var(--heat); }
.chip__dot{ width:9px; height:9px; border-radius:50%; background:currentColor; }

.flow__svg{ width:100%; height:auto; display:block; }
.flow__legend{
  display:flex; flex-wrap:wrap; gap:16px; margin-top:16px;
  font-size:.85rem; color:var(--text-muted);
}
.flow__legend span{ display:inline-flex; align-items:center; gap:7px; }
.flow__legend i{ width:22px; height:3px; border-radius:2px; display:inline-block; font-style:normal; }

.flow__readout{
  display:grid; gap:12px; grid-template-columns:repeat(2,1fr); margin-top:20px;
}
@media (min-width:760px){ .flow__readout{ grid-template-columns:repeat(4,1fr); } }
.readout{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:14px 16px; }
.readout span{ display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-dim); }
.readout b{ font-size:1.32rem; color:var(--text); letter-spacing:-.02em; }
.readout b.is-accent{ color:var(--accent); }
.readout b.is-heat{ color:var(--heat); }
.readout b.is-green{ color:var(--green); }

.soc-bar{ height:9px; border-radius:6px; background:var(--surface-2); overflow:hidden; margin-top:8px; border:1px solid var(--line); }
.soc-bar > i{ display:block; height:100%; background:linear-gradient(90deg,var(--accent),var(--green)); transition:width .4s linear; }

/* --------------------------------------------------------------- formularze */
.field{ margin-bottom:18px; }
.field label{ display:block; font-size:.9rem; font-weight:600; margin-bottom:7px; color:var(--text); }
.field .hint{ display:block; font-size:.82rem; color:var(--text-dim); margin-top:6px; }
.field .req{ color:var(--accent); }

input[type="text"],input[type="email"],input[type="tel"],input[type="number"],select,textarea{
  width:100%; padding:12px 14px;
  background:var(--bg-2); color:var(--text);
  border:1px solid var(--line); border-radius:var(--radius-sm);
  font-family:inherit; font-size:1rem;
  transition:border-color .15s ease, box-shadow .15s ease;
}
input:hover,select:hover,textarea:hover{ border-color:var(--text-dim); }
input:focus,select:focus,textarea:focus{
  outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(34,211,238,.18);
}
textarea{ min-height:150px; resize:vertical; }
select{ appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath fill='%239AAEC8' d='M1 1l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; padding-right:38px; }
input[type="range"]{ width:100%; accent-color:var(--accent); }

.checkbox{ display:flex; gap:11px; align-items:flex-start; margin-bottom:14px; font-size:.88rem; color:var(--text-muted); }
.checkbox input{ margin-top:.28em; width:17px; height:17px; accent-color:var(--accent); flex:0 0 auto; }
.checkbox a{ text-decoration:underline; }

.field--error input,.field--error textarea,.field--error select{ border-color:var(--danger); }
.error-msg{ display:block; color:var(--danger); font-size:.83rem; margin-top:6px; }

.form-status{ margin-top:16px; padding:14px 16px; border-radius:var(--radius-sm); display:none; font-size:.94rem; }
.form-status.is-ok{ display:block; background:var(--green-soft); border:1px solid rgba(52,211,153,.4); color:#B6F3DC; }
.form-status.is-err{ display:block; background:rgba(248,113,113,.1); border:1px solid rgba(248,113,113,.4); color:#FBC4C4; }

.hp-field{ position:absolute!important; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }

/* --------------------------------------------------------------- kalkulator */
.calc{ display:grid; gap:22px; }
@media (min-width:980px){ .calc{ grid-template-columns:400px 1fr; align-items:start; } }
.calc__panel{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(18px,2.2vw,26px); }
.calc__out{ display:grid; gap:14px; align-content:start; }
@media (min-width:980px){ .calc__out{ position:sticky; top:86px; } }
.calc__hero{
  background:linear-gradient(135deg, rgba(34,211,238,.14), rgba(52,211,153,.08));
  border:1px solid rgba(34,211,238,.35);
  border-radius:var(--radius); padding:clamp(20px,2.6vw,30px);
}
.calc__hero span{ font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-muted); }
.calc__hero b{ display:block; font-size:clamp(2rem,1.3rem + 2.6vw,3rem); color:var(--accent); letter-spacing:-.03em; line-height:1.1; }
.calc__hero em{ font-style:normal; color:var(--text-muted); font-size:.92rem; }
.calc__breakdown{ display:grid; gap:10px; }
.bd-row{ display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:13px 16px; }
.bd-row span{ color:var(--text-muted); font-size:.92rem; }
.bd-row b{ font-variant-numeric:tabular-nums; white-space:nowrap; }
.bd-row--heat b{ color:var(--heat); }
.bd-row--green b{ color:var(--green); }
.bd-row--accent b{ color:var(--accent); }
.range-value{ float:right; font-family:var(--mono); font-size:.88rem; color:var(--accent); }
.calc__note{ font-size:.82rem; color:var(--text-dim); margin-top:6px; }

/* --------------------------------------------------------------- CTA pas */
.cta-band{
  background:linear-gradient(135deg, rgba(34,211,238,.14), rgba(59,130,246,.1));
  border:1px solid rgba(34,211,238,.32);
  border-radius:var(--radius-lg);
  padding:clamp(26px,4vw,50px);
  text-align:center;
}
.cta-band p{ color:var(--text-muted); max-width:60ch; margin-inline:auto; }
.cta-band .btn-row{ justify-content:center; }

/* --------------------------------------------------------------- breadcrumbs */
.crumbs{ font-size:.85rem; color:var(--text-dim); padding-top:20px; }
.crumbs ol{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; }
.crumbs li+li::before{ content:"/"; margin-right:8px; color:var(--line); }
.crumbs a{ color:var(--text-muted); }

/* --------------------------------------------------------------- prose */
.prose{ max-width:76ch; }
.prose h2{ margin-top:1.8em; }
.prose h3{ margin-top:1.5em; }
.prose ul,.prose ol{ color:var(--text-muted); padding-left:22px; }
.prose li{ margin-bottom:.5em; }
.prose p{ color:var(--text-muted); }
.prose table{ min-width:0; }
.prose .card{ margin:1.6em 0; }

/* --------------------------------------------------------------- footer */
.site-footer{
  border-top:1px solid var(--line);
  background:var(--bg-2);
  padding-block:clamp(36px,4vw,56px) 26px;
  margin-top:clamp(40px,5vw,72px);
}
.footer-grid{ display:grid; gap:28px; }
@media (min-width:760px){ .footer-grid{ grid-template-columns:1.6fr 1fr 1fr 1fr; } }
.site-footer h4{ font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-dim); margin-bottom:14px; }
.site-footer ul{ list-style:none; padding:0; margin:0; display:grid; gap:9px; }
.site-footer a{ color:var(--text-muted); font-size:.93rem; }
.site-footer a:hover{ color:var(--accent); }
.site-footer address{ font-style:normal; color:var(--text-muted); font-size:.93rem; line-height:1.75; }
.footer-legal{
  border-top:1px solid var(--line-soft); margin-top:32px; padding-top:20px;
  display:flex; flex-wrap:wrap; gap:12px 24px; justify-content:space-between;
  font-size:.83rem; color:var(--text-dim);
}
.footer-legal p{ margin:0; max-width:70ch; }
.ai-note{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--surface); border:1px solid var(--line);
  border-radius:999px; padding:6px 14px; font-size:.8rem; color:var(--text-muted);
}
.ai-note a{ color:var(--accent); }

/* --------------------------------------------------------------- cookie */
.cookie{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:150;
  background:var(--bg-2); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:0 24px 60px -20px rgba(0,0,0,.9);
  padding:20px; max-width:560px;
}
.cookie[hidden]{ display:none; }
@media (min-width:640px){ .cookie{ left:auto; right:24px; bottom:24px; } }
.cookie h2{ font-size:1.06rem; margin-bottom:.4em; }
.cookie p{ font-size:.88rem; color:var(--text-muted); margin-bottom:14px; }
.cookie__actions{ display:flex; flex-wrap:wrap; gap:9px; }
.cookie__prefs{ border-top:1px solid var(--line); margin-top:16px; padding-top:14px; display:grid; gap:12px; }
.cookie__prefs[hidden]{ display:none; }
.cookie-opt{ display:flex; gap:11px; align-items:flex-start; font-size:.86rem; color:var(--text-muted); }
.cookie-opt input{ margin-top:.25em; width:17px; height:17px; accent-color:var(--accent); }
.cookie-opt b{ display:block; color:var(--text); font-size:.92rem; }

/* --------------------------------------------------------------- czat AI */
.chat-fab{
  position:fixed; right:18px; bottom:18px; z-index:140;
  display:inline-flex; align-items:center; gap:10px;
  padding:13px 20px; border-radius:999px; cursor:pointer; border:0;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#04121B; font-weight:700; font-size:.94rem;
  box-shadow:0 14px 34px -12px rgba(34,211,238,.85);
}
.chat-fab:hover{ transform:translateY(-2px); }
.chat-fab[hidden]{ display:none; }
/* Baner cookie i przycisk czatu zajmują ten sam róg — czat czeka na decyzję. */
:root[data-cookie-open="1"] .chat-fab,
:root[data-cookie-open="1"] .chat{ display:none; }

.chat{
  position:fixed; z-index:145;
  right:18px; bottom:18px; left:18px; top:18px;
  display:flex; flex-direction:column;
  background:var(--bg-2); border:1px solid var(--line);
  border-radius:var(--radius-lg); box-shadow:0 30px 70px -20px rgba(0,0,0,.92);
  overflow:hidden;
}
.chat[hidden]{ display:none; }
@media (min-width:640px){
  .chat{ left:auto; top:auto; width:400px; height:min(620px, calc(100dvh - 40px)); }
}
.chat__head{
  display:flex; align-items:center; gap:11px; padding:14px 16px;
  border-bottom:1px solid var(--line); background:var(--surface);
}
.chat__head img{ width:34px; height:34px; border-radius:9px; }
.chat__head b{ display:block; font-size:.96rem; }
.chat__head span{ font-size:.78rem; color:var(--green); display:flex; align-items:center; gap:6px; }
.chat__head span::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--green); }
.chat__close{ margin-left:auto; background:transparent; border:0; color:var(--text-muted); font-size:1.4rem; cursor:pointer; padding:4px 8px; border-radius:8px; }
.chat__close:hover{ background:var(--surface-2); color:var(--text); }

.chat__log{ flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:12px; scroll-behavior:smooth; }
.msg{ max-width:88%; padding:11px 14px; border-radius:14px; font-size:.92rem; line-height:1.55; }
.msg--bot{ align-self:flex-start; background:var(--surface); border:1px solid var(--line); border-bottom-left-radius:5px; }
.msg--user{ align-self:flex-end; background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#04121B; border-bottom-right-radius:5px; font-weight:500; }
.msg p{ margin:0 0 .6em; }
.msg p:last-child{ margin-bottom:0; }
.msg ul{ margin:.3em 0 .6em; padding-left:20px; }
.msg a{ color:var(--accent); text-decoration:underline; }
.msg--user a{ color:#04121B; }
.msg--typing{ display:flex; gap:5px; align-items:center; }
.msg--typing i{ width:7px; height:7px; border-radius:50%; background:var(--text-dim); animation:blink 1.2s infinite; }
.msg--typing i:nth-child(2){ animation-delay:.2s; }
.msg--typing i:nth-child(3){ animation-delay:.4s; }
@keyframes blink{ 0%,60%,100%{ opacity:.25 } 30%{ opacity:1 } }

.chat__chips{ display:flex; flex-wrap:wrap; gap:7px; padding:0 16px 12px; }
.chat__chips button{
  background:var(--surface); border:1px solid var(--line); color:var(--text-muted);
  border-radius:999px; padding:7px 13px; font-size:.82rem; cursor:pointer;
}
.chat__chips button:hover{ border-color:var(--accent); color:var(--accent); }

.chat__form{ display:flex; gap:9px; padding:12px 14px; border-top:1px solid var(--line); background:var(--surface); }
.chat__form input{ flex:1; padding:11px 13px; font-size:.94rem; }
.chat__form button{
  background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#04121B;
  border:0; border-radius:var(--radius-sm); padding:0 16px; font-weight:700; cursor:pointer;
}
.chat__foot{ padding:0 16px 10px; font-size:.72rem; color:var(--text-dim); text-align:center; background:var(--surface); }

/* --------------------------------------------------------------- 404 */
.err-page{ text-align:center; padding-block:clamp(60px,10vw,120px); }
.err-page .code{ font-size:clamp(4rem,3rem + 8vw,8rem); font-weight:800; line-height:1;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  -webkit-background-clip:text; background-clip:text; color:transparent; letter-spacing:-.04em; }

/* --------------------------------------------------------------- druk */
@media print{
  .site-header,.site-footer,.cookie,.chat,.chat-fab,.btn-row,.cta-band{ display:none!important; }
  body{ background:#fff; color:#000; }
  a{ color:#000; }
}

/* --------------------------------------------------- wykres kalkulatora */
.bar-row{ display:grid; grid-template-columns:170px 1fr 46px; gap:12px; align-items:center; font-size:.88rem; color:var(--text-muted); margin-bottom:9px; }
.bar-row b{ text-align:right; color:var(--text); font-variant-numeric:tabular-nums; }
.bar{ height:10px; border-radius:6px; background:var(--surface-2); overflow:hidden; border:1px solid var(--line); }
.bar > i{ display:block; height:100%; transition:width .3s ease; }
@media (max-width:560px){ .bar-row{ grid-template-columns:1fr 44px; } .bar{ grid-column:1 / -1; order:3; } }

fieldset{ border:1px solid var(--line); border-radius:var(--radius-sm); padding:18px; margin:0 0 20px; }
legend{ padding:0 8px; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); font-weight:700; }