/* ============ TOKENY ============ */
:root{
  /* paleta z briefu */
  --krem:#F6E7C6; --roz:#E8CCC5; --nieb:#BDCED3; --oliw:#CFD4AE;
  --szary:#BBB9B2; --jasny:#E3E3E3; --ciem:#807E79;
  --papier:#FAF8F4; --ink:#2B2A28;
  /* bryły izometryczne: 1 = góra (jasna), 2 = lewa ściana, 3 = prawa ściana (ciemna) */
  --krem-1:#F6E7C6; --krem-2:#E4D3AE; --krem-3:#D0BD92;
  --roz-1:#E8CCC5; --roz-2:#D9B2A9; --roz-3:#CB9689;
  --nieb-1:#BDCED3; --nieb-2:#A5BAC0; --nieb-3:#89A5AD;
  --oliw-1:#CFD4AE; --oliw-2:#BCC294; --oliw-3:#AAB277;
  --szary-1:#BBB9B2; --szary-2:#A6A49C; --szary-3:#908E83;
  --jasny-1:#E3E3E3; --jasny-2:#CDCDCD; --jasny-3:#B6B6B6;
  --ciem-1:#807E79; --ciem-2:#696864; --ciem-3:#52514E;
  --papier-1:#FAF8F4; --papier-2:#EBE5D7; --papier-3:#DCD0B9;
  --skin-1:#EBCFC0; --skin-2:#DDB7A4; --skin-3:#CB9F8A;
  --ink-1:#4A4844; --ink-2:#3A3936; --ink-3:#2B2A28;
  /* przygaszone akcenty animacji (tylko w scenach) */
  --cegla-1:#B5654D; --cegla-2:#9C5541; --cegla-3:#7F4535;
  --musz-1:#C9A452; --musz-2:#B08D43; --musz-3:#927537;

  --radius:8px;
  --line:1px solid var(--szary);
  --font-head:"Bricolage Grotesque", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --font-body:"Manrope", "Segoe UI", system-ui, -apple-system, sans-serif;
  --wrap:1120px;
  --gutter:16px;
  --section:clamp(72px, 9vw, 128px);
}
@media (min-width:768px){ :root{ --gutter:32px; } }
@media (min-width:1200px){ :root{ --gutter:40px; } }

/* ============ BAZA ============ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
html:focus-within{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--papier); color:var(--ink);
  font-family:var(--font-body); font-size:17px; line-height:1.6;
  font-feature-settings:"ss01" 0; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
@media (min-width:768px){ body{ font-size:18px; } }
img,svg{ max-width:100%; }
h1,h2,h3,h4{ font-family:var(--font-head); font-weight:700; line-height:1.08; margin:0; letter-spacing:-0.015em; font-variation-settings:"opsz" 96; }
p{ margin:0; }
a{ color:inherit; }
ul,ol{ margin:0; padding:0; }
:focus-visible{ outline:3px solid var(--ink); outline-offset:3px; border-radius:4px; }
.sr-only{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.wrap{ width:100%; max-width:calc(var(--wrap) + 2*var(--gutter)); margin:0 auto; padding:0 var(--gutter); }
.skip{ position:absolute; left:12px; top:-60px; z-index:100; background:var(--ink); color:var(--papier); padding:10px 16px; border-radius:var(--radius); text-decoration:none; font-weight:700; }
.skip:focus{ top:12px; }

/* przyciski */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:48px; padding:12px 22px; border-radius:var(--radius);
  font:700 16px/1.2 var(--font-body); text-decoration:none; cursor:pointer;
  border:1px solid var(--ink); transition:background-color .2s, color .2s, transform .2s;
}
.btn--main{ background:var(--ink); color:var(--papier); }
.btn--main:hover{ background:#45433F; }
.btn--ghost{ background:transparent; color:var(--ink); }
.btn--ghost:hover{ background:rgba(43,42,40,.06); }
.btn svg{ width:18px; height:18px; flex:none; }

.lead{ font-size:1.08em; max-width:62ch; }
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-weight:700; font-size:15px; line-height:1.3;
}
.cube-mark{ width:18px; height:20px; flex:none; }

/* ============ NAGŁÓWEK ============ */
.top{ background:var(--krem); position:relative; z-index:20; }
.top__bar{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:72px; }
/* logo: znak z kafelkami (jak w filmikach, stories/kit.js → logo()) + nazwa */
.brand{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); }
.brand__mark{ width:36px; height:36px; flex:none; overflow:visible; }
.brand__name{ font:800 21px/1 var(--font-head); letter-spacing:-0.02em; white-space:nowrap; }
.logo__bg{ fill:var(--papier); stroke:var(--ink); stroke-width:2.7; }
.logo__t{ stroke:var(--ink); stroke-width:1.89; }
.logo__t--1{ fill:var(--roz); } .logo__t--2{ fill:var(--nieb); } .logo__t--3{ fill:var(--oliw); } .logo__t--4{ fill:var(--musz-1); }
@media (min-width:768px){ .brand{ gap:12px; } .brand__mark{ width:40px; height:40px; } .brand__name{ font-size:23px; } }
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .logo__t{ transition:transform .3s cubic-bezier(.3,1.5,.5,1); }
  .brand:hover .logo__t--1{ transform:translate(-2px,-2px); }
  .brand:hover .logo__t--2{ transform:translate(2px,-2px); }
  .brand:hover .logo__t--3{ transform:translate(-2px,2px); }
  .brand:hover .logo__t--4{ transform:translate(2px,2px); }
}
.nav{ display:flex; align-items:center; gap:28px; }
.nav__list{ list-style:none; display:flex; gap:24px; }
.nav__list a{ text-decoration:none; font-weight:600; font-size:16px; padding:6px 0; border-bottom:2px solid transparent; }
.nav__list a:hover{ border-bottom-color:var(--ink); }
.nav .btn{ min-height:44px; padding:10px 18px; font-size:15px; }
.menu-btn{ display:none; }
@media (max-width:959px){
  .menu-btn{
    display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 14px;
    background:transparent; border:1px solid var(--ink); border-radius:var(--radius);
    font:700 15px/1 var(--font-body); color:var(--ink); cursor:pointer;
  }
  .menu-btn__icon{ width:18px; height:12px; position:relative; }
  .menu-btn__icon::before,.menu-btn__icon::after{ content:""; position:absolute; left:0; right:0; height:2px; background:currentColor; transition:transform .25s; }
  .menu-btn__icon::before{ top:2px; } .menu-btn__icon::after{ bottom:2px; }
  .menu-btn[aria-expanded="true"] .menu-btn__icon::before{ transform:translateY(3px) rotate(45deg); }
  .menu-btn[aria-expanded="true"] .menu-btn__icon::after{ transform:translateY(-3px) rotate(-45deg); }
  .nav{ display:none; position:absolute; left:0; right:0; top:100%; background:var(--krem); border-top:var(--line); border-bottom:var(--line);
        flex-direction:column; align-items:stretch; gap:8px; padding:12px var(--gutter) 20px; }
  .nav.is-open{ display:flex; }
  .nav__list{ flex-direction:column; gap:0; }
  .nav__list a{ display:block; padding:12px 0; border-bottom:1px solid rgba(43,42,40,.12); }
  .nav .btn{ margin-top:8px; min-height:48px; }
}
.no-js .nav{ display:flex; position:static; }
.no-js .menu-btn{ display:none; }

/* ============ HERO ============ */
.hero{ background:var(--krem); padding:24px 0 56px; overflow:clip; }
.hero__grid{ display:grid; gap:24px; }
.hero__head{ display:grid; gap:18px; }
.hero h1{ font-size:clamp(2.1rem, 1.3rem + 3.2vw, 3.55rem); line-height:1.03; letter-spacing:-0.025em; max-width:24ch; }
.hero h1 span{ display:block; text-wrap:balance; }
.hero__copy{ display:grid; gap:24px; align-content:start; }
.hero__sub{ font-size:1.1em; max-width:46ch; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:12px; }
.ticks{ list-style:none; display:grid; gap:10px; font-weight:600; font-size:16px; }
@media (max-width:1023px){ .hero .stage{ order:3; } .hero .ticks{ order:4; } .hero__grid{ row-gap:22px; } }
.ticks li{ display:flex; gap:10px; align-items:center; }
.ticks svg{ width:16px; height:18px; flex:none; }
@media (min-width:1024px){
  .hero{ padding:40px 0 72px; }
  .hero__grid{ grid-template-columns:minmax(0,4fr) minmax(0,8fr); grid-template-rows:auto auto 1fr; column-gap:36px; row-gap:28px; }
  .hero__head{ grid-column:1/-1; }
  .hero__copy{ grid-column:1; grid-row:2; }
  .hero .stage{ grid-column:2; grid-row:2 / span 2; }
  .hero .ticks{ grid-column:1; grid-row:3; align-self:start; }
  .hero h1{ max-width:none; }
  .hero__copy{ padding-top:24px; }
}

/* scena */
.stage{ position:relative; margin:0; }
.scene{ position:relative; width:100%; aspect-ratio:760/470; }
.scene > svg{ position:absolute; inset:0; width:100%; height:100%; display:block; overflow:hidden; }
@media (max-width:899px){
  .stage__live .scene{ border:1px solid rgba(43,42,40,.22); border-radius:var(--radius); overflow:hidden; background:#F9ECCF; }
  .scene__act{ left:8px; top:8px; font-size:12.5px; padding:5px 9px; }
  .scene__counter{ right:8px; top:8px; padding:6px 9px; }
  .scene__counter span{ font-size:11.5px; } .scene__counter strong{ font-size:21px; }
}
@media (max-width:599px){ .scene{ aspect-ratio:328/372; } }
.scene__act{
  position:absolute; left:0; top:0; z-index:2;
  font:700 14px/1.2 var(--font-body); background:var(--papier); border:1px solid var(--ink);
  border-radius:var(--radius); padding:7px 11px; transition:background-color .4s;
}
.scene__act.is-app{ background:var(--oliw); }
.scene__banner{
  position:absolute; left:50%; top:16%; z-index:3; transform:translate(-50%, 10px); opacity:0; visibility:hidden;
  font:700 clamp(17px, 1.2rem + .8vw, 26px)/1.15 var(--font-head); letter-spacing:-0.01em; text-align:center;
  background:var(--ink); color:var(--papier); padding:12px 18px; border-radius:var(--radius); width:max-content; max-width:88%;
  transition:opacity .45s, transform .45s, visibility 0s .45s;
}
.scene__banner.is-on{ opacity:1; visibility:visible; transform:translate(-50%,0); transition:opacity .45s, transform .45s, visibility 0s; }
.scene__counter{
  position:absolute; right:0; top:0; z-index:2; display:grid; gap:2px; text-align:right;
  background:var(--papier); border:1px solid var(--ink); border-radius:var(--radius); padding:8px 12px;
  opacity:0; transform:translateY(-6px); transition:opacity .4s, transform .4s;
}
.scene__counter.is-on{ opacity:1; transform:none; }
.scene__counter span{ font-size:13px; font-weight:700; line-height:1.2; }
.scene__counter strong{ font:800 26px/1 var(--font-head); letter-spacing:-0.02em; font-variant-numeric:tabular-nums; }
.controls{ display:flex; align-items:center; gap:14px; margin-top:14px; }
.controls__btn{
  display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 14px; flex:none;
  background:var(--papier); color:var(--ink); border:1px solid var(--ink); border-radius:var(--radius);
  font:700 14px/1 var(--font-body); cursor:pointer;
}
.controls__btn svg{ width:14px; height:14px; }
.controls__btn:hover{ background:var(--jasny); }
.progress{ flex:1; display:grid; grid-template-columns:12fr 14fr; gap:6px; min-width:0; }
.progress__seg{ display:grid; gap:6px; font-size:13px; font-weight:700; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.progress__bar{ height:6px; border-radius:3px; background:rgba(43,42,40,.12); overflow:hidden; }
.progress__bar i{ display:block; height:100%; width:100%; background:var(--ink); transform-origin:0 50%; transform:scaleX(0); }
.stage__static{ display:none; }
.is-reduced .stage__static{ display:grid; gap:16px; }
.is-reduced .stage__live{ display:none; }
.stage__frame{ margin:0; display:grid; gap:8px; }
.stage__frame figcaption{ font-weight:700; font-size:15px; }
.stage__frame .scene{ aspect-ratio:760/470; }
@media (min-width:600px){ .is-reduced .stage__static{ grid-template-columns:1fr 1fr; } }
.no-js .stage{ display:none; }

/* ============ HISTORIA (scrollytelling) ============ */
.story{ background:var(--papier); position:relative; }
.story__grid{ display:grid; grid-template-columns:minmax(0,1fr); }
.story__stage{ position:sticky; top:0; z-index:5; height:44vh; height:44svh; margin:0 calc(-1*var(--gutter)); background:var(--krem); border-bottom:1px solid rgba(43,42,40,.15); transition:background-color .6s; }
.story__stage.is-color{ background:var(--nieb); }
.story__stage .scene{ position:absolute; inset:0; aspect-ratio:auto; height:100%; }
.story__chip{
  position:absolute; left:var(--gutter); bottom:10px; z-index:2;
  font:700 13px/1.2 var(--font-body); background:var(--papier); border:1px solid var(--ink); border-radius:var(--radius); padding:6px 10px;
}
.story__flow{ position:relative; z-index:1; padding:40px 0 var(--section); }
.story__part + .story__part{ margin-top:var(--section); }
.story__intro{ display:grid; gap:16px; padding:8px 0 24px; }
.story__intro h2, .sec-title{ font-size:clamp(2rem, 1.35rem + 2.3vw, 3.1rem); letter-spacing:-0.02em; }
.chapters{ list-style:none; display:grid; }
.chapter{ min-height:62vh; display:flex; align-items:center; padding:28px 0; }
.chapter__card{ display:grid; gap:10px; overflow-wrap:anywhere; background:var(--papier); border:1px solid var(--szary); border-radius:var(--radius); padding:20px 20px 22px; transition:border-color .3s; }
.chapter.is-active .chapter__card{ border-color:var(--ink); }
.chapter h3{ font-size:clamp(1.3rem, 1.1rem + .7vw, 1.65rem); letter-spacing:-0.01em; display:flex; gap:12px; align-items:baseline; }
.chapter__no{ font:800 15px/1 var(--font-body); display:inline-grid; place-items:center; width:30px; height:30px; flex:none; border-radius:50%; background:var(--nieb); transform:translateY(-3px); }
.story__closing{ font:700 clamp(1.2rem, 1.05rem + .6vw, 1.5rem)/1.3 var(--font-head); letter-spacing:-0.01em; max-width:30ch; padding:24px 0 0; }
.chapter__static{ display:none; }
@media (min-width:960px){
  .story__grid{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); column-gap:56px; }
  .story__stage{ grid-column:2; grid-row:1; top:max(12px, calc(50vh - 320px)); height:min(84vh, 640px); margin:6vh 0 0; border:1px solid rgba(43,42,40,.15); border-radius:var(--radius); align-self:start; }
  .story__flow{ grid-column:1; grid-row:1; padding:80px 0 var(--section); }
  .chapter{ min-height:86vh; }
  .story__chip{ left:16px; bottom:16px; }
}
.no-js .story__stage{ display:none; }
.no-js .ba .scene, .no-js .portrait .scene{ display:none; }
.story__pause{ position:absolute; right:var(--gutter); bottom:10px; z-index:2; width:40px; height:40px; min-height:40px; padding:0; justify-content:center; }
@media (min-width:960px){ .story__pause{ right:16px; bottom:16px; } }
.no-js .chapter{ min-height:0; }
.is-reduced .story__stage{ display:none; }
.is-reduced .chapter{ min-height:0; padding:14px 0; }
.is-reduced .chapter__static{ display:block; margin-top:6px; border-radius:var(--radius); background:var(--krem); }
.is-reduced .chapter__static.is-color{ background:var(--nieb); }
.is-reduced .chapter__static .scene{ aspect-ratio:16/10; }
@media (min-width:960px){ .is-reduced .story__grid{ grid-template-columns:minmax(0,1fr); } .is-reduced .chapters{ grid-template-columns:1fr 1fr; gap:24px; } }

/* ============ PORÓWNANIE ============ */
.compare{ background:var(--nieb); padding:var(--section) 0; }
.compare h3{ font-size:clamp(1.7rem, 1.3rem + 1.6vw, 2.5rem); letter-spacing:-0.02em; margin-bottom:28px; }
.ctable{ width:100%; border-collapse:separate; border-spacing:0; background:var(--papier); border:1px solid var(--ink); border-radius:var(--radius); overflow:hidden; }
.ctable th, .ctable td{ text-align:left; vertical-align:top; padding:16px 18px; border-bottom:1px solid var(--szary); }
.ctable tr:last-child th, .ctable tr:last-child td{ border-bottom:0; }
.ctable thead th{ font-family:var(--font-head); font-size:1.1em; background:var(--jasny); }
.ctable thead th:last-child{ background:var(--oliw); }
.ctable tbody th{ font-weight:700; width:24%; }
.ctable td:last-child{ background:rgba(207,212,174,.35); font-weight:600; }
@media (max-width:719px){
  .ctable, .ctable tbody, .ctable tr, .ctable th, .ctable td{ display:block; width:auto; }
  .ctable thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .ctable tbody th{ background:var(--jasny); border-bottom:0; padding-bottom:10px; width:auto; }
  .ctable td{ padding:10px 18px 12px; border-bottom:0; }
  .ctable td::before{ content:attr(data-label); display:block; font-size:14px; font-weight:800; margin-bottom:2px; }
  .ctable tr{ border-bottom:1px solid var(--ink); }
  .ctable tr:last-child{ border-bottom:0; }
}

/* ============ PRZYKŁADY ============ */
.cases{ padding:var(--section) 0; }
.sec-head{ display:grid; gap:16px; margin-bottom:44px; }
.case + .case{ margin-top:56px; }
.case__label{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14px; background:var(--roz); border-radius:var(--radius) var(--radius) 0 0; padding:7px 12px 6px; border:1px solid var(--ink); border-bottom:0; }
.case__card{ border:1px solid var(--ink); border-radius:0 var(--radius) var(--radius) var(--radius); background:var(--papier); overflow:hidden; }
.case__head{ padding:22px 22px 18px; display:grid; gap:6px; border-bottom:1px solid var(--ink); }
.case__industry{ font-weight:700; font-size:15px; }
.case__head h3{ font-size:clamp(1.4rem, 1.15rem + 1vw, 2rem); letter-spacing:-0.015em; }
.case__ba{ display:grid; }
.ba{ padding:20px 22px 22px; display:grid; gap:12px; align-content:start; }
.ba--before{ background:var(--jasny); }
.ba--after{ background:var(--oliw); border-top:1px solid var(--ink); }
.ba__tag{ font:800 14px/1 var(--font-body); display:inline-flex; align-items:center; gap:8px; }
.ba__tag::before{ content:""; width:10px; height:10px; border-radius:2px; background:currentColor; }
.ba--before .ba__tag{ color:#4F4D49; }
.ba .scene{ aspect-ratio:3/2; background:var(--papier); border:1px solid rgba(43,42,40,.18); border-radius:var(--radius); overflow:hidden; }
.ba--after .scene{ background:var(--krem); }
.case__fx{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--ink); }
.fx{ padding:18px 14px 20px; display:grid; gap:6px; align-content:start; }
.fx + .fx{ border-left:1px solid var(--szary); }
.fx strong{ font:800 clamp(1.9rem, 1.4rem + 2vw, 3.2rem)/1 var(--font-head); letter-spacing:-0.03em; white-space:nowrap; }
.fx span{ font-size:14px; line-height:1.35; font-weight:600; }
@media (max-width:559px){
  .case__fx{ grid-template-columns:1fr; }
  .fx{ grid-template-columns:minmax(96px,auto) 1fr; align-items:center; gap:14px; padding:14px 18px; }
  .fx + .fx{ border-left:0; border-top:1px solid var(--szary); }
  .fx span{ font-size:15px; }
}
@media (min-width:768px){
  .case__ba{ grid-template-columns:1fr 1fr; }
  .ba--after{ border-top:0; border-left:1px solid var(--ink); }
  .case__head{ padding:26px 28px 22px; } .ba{ padding:24px 28px 26px; } .fx{ padding:22px 28px 24px; }
  .fx span{ font-size:15px; }
}

/* ============ USŁUGI ============ */
.services{ background:var(--jasny); padding:var(--section) 0; }
.tiles{ display:grid; gap:16px; list-style:none; }
.tile{ background:var(--papier); border:1px solid var(--szary); border-radius:var(--radius); padding:22px; display:grid; gap:10px; align-content:start; }
.tile svg{ width:124px; height:97px; margin-left:-6px; }
.tile h3{ font-size:1.35rem; }
.tile--main{ border-color:var(--ink); }
.more-link{ display:inline-flex; margin-top:28px; font-weight:700; text-underline-offset:4px; text-decoration-thickness:2px; }
@media (min-width:768px){ .tiles{ grid-template-columns:repeat(3,1fr); } }

/* ============ O MNIE ============ */
.about{ background:var(--krem); padding:var(--section) 0; }
.about__grid{ display:grid; gap:36px; align-items:center; }
.about__text{ display:grid; gap:18px; max-width:62ch; }
.facts{ list-style:none; display:grid; gap:10px; font-weight:600; margin-top:6px; }
.facts li{ display:flex; gap:10px; align-items:center; }
.facts svg{ width:16px; height:18px; flex:none; }
.portrait{ margin:0; display:grid; gap:10px; justify-items:center; background:var(--roz); border-radius:var(--radius); padding:20px 16px 18px; border:1px solid var(--ink); }
.portrait .scene{ aspect-ratio:1/0.82; max-width:420px; }
.portrait figcaption{ font-weight:700; font-size:15px; }
@media (min-width:900px){ .about__grid{ grid-template-columns:7fr 5fr; gap:64px; } }

/* ============ FAQ ============ */
.faq{ padding:var(--section) 0; }
.faq__list{ display:grid; gap:10px; max-width:860px; }
.faq details{ border:1px solid var(--szary); border-radius:var(--radius); background:var(--papier); }
.faq details[open]{ border-color:var(--ink); background:#fff; }
.faq summary{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:16px; align-items:center; padding:18px 20px; font-weight:700; font-size:1.05em; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:""; width:12px; height:12px; flex:none; border-right:2px solid var(--ink); border-bottom:2px solid var(--ink); transform:rotate(45deg) translateY(-3px); transition:transform .25s; }
.faq details[open] summary::after{ transform:rotate(-135deg) translate(-2px,-2px); }
.faq details p{ padding:0 20px 20px; max-width:68ch; }

/* ============ KONTAKT ============ */
.contact{ background:var(--krem); padding:var(--section) 0; }
.contact__grid{ display:grid; gap:36px; max-width:760px; }
.form{ display:grid; gap:18px; background:var(--papier); border:1px solid var(--ink); border-radius:var(--radius); padding:22px; }
.field{ display:grid; gap:6px; }
.field label{ font-weight:700; font-size:16px; }
.field label small{ font-weight:600; font-size:14px; }
.field input, .field textarea{
  width:100%; font:500 17px/1.5 var(--font-body); color:var(--ink); background:#fff;
  border:1px solid var(--ciem); border-radius:var(--radius); padding:12px 14px;
}
.field textarea{ min-height:150px; resize:vertical; }
.field input:focus-visible, .field textarea:focus-visible{ outline:3px solid var(--ink); outline-offset:1px; border-color:var(--ink); }
.field ::placeholder{ color:#6B6964; }
.form__legal{ font-size:14px; line-height:1.5; }
.form__status{ font-weight:700; min-height:1.6em; }
.captcha{ min-height:78px; }   /* miejsce na widżet reCAPTCHA, żeby formularz nie skakał */
@media (max-width:359px){ .captcha{ transform:scale(.88); transform-origin:0 0; } }
.form__status.is-ok{ color:#3F4A1E; }
.form__status.is-err{ color:#7F3A28; }
@media (min-width:900px){ .form{ padding:30px; } }

/* ============ STOPKA ============ */
.foot{ background:var(--jasny); padding:48px 0 36px; font-size:15px; }
.foot__grid{ display:grid; gap:24px; }
.foot__brand{ display:grid; gap:12px; justify-items:start; align-content:start; }
.foot__tag{ font-weight:600; max-width:34ch; }
.foot__firm{ font-style:normal; display:grid; gap:2px; line-height:1.45; padding-top:16px; margin-top:4px; border-top:1px solid var(--szary); }
.foot__firm strong{ font-weight:800; }
.foot__links{ list-style:none; display:flex; flex-wrap:wrap; gap:8px 22px; }
.foot__links a{ font-weight:600; text-underline-offset:4px; }
.foot__meta{ display:grid; gap:4px; }
@media (min-width:900px){ .foot__grid{ grid-template-columns:1.2fr 1.6fr 1fr; align-items:start; } }

/* ============ POLITYKA PRYWATNOŚCI (okno modalne) ============ */
.modal{ width:min(760px, calc(100% - 2 * var(--gutter))); max-height:min(88vh, 900px); padding:0; border:1px solid var(--ink); border-radius:var(--radius); background:var(--papier); color:var(--ink); box-shadow:0 18px 50px rgba(43,42,40,.28); overflow:hidden; }
.modal[open]{ display:flex; flex-direction:column; animation:modal-in .22s ease-out; }
.modal::backdrop{ background:rgba(43,42,40,.55); }
@keyframes modal-in{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
.modal__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:20px var(--gutter) 16px; border-bottom:1px solid var(--szary); }
.modal__head h2{ font-size:clamp(1.5rem, 1.25rem + 1vw, 2rem); }
.modal__meta{ margin:6px 0 0; font-size:14px; color:var(--ciem-3); }
.modal__x{ flex:none; width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--ink); border-radius:var(--radius); background:transparent; color:var(--ink); cursor:pointer; }
.modal__x:hover{ background:rgba(43,42,40,.06); }
.modal__x svg{ width:18px; height:18px; }
.modal__body{ overflow-y:auto; overscroll-behavior:contain; padding:8px var(--gutter) 24px; font-size:16px; line-height:1.6; }
.modal__body h3{ font-size:1.15rem; margin:26px 0 8px; }
.modal__body p{ margin:0 0 10px; }
.modal__body ul, .modal__body ol{ margin:0 0 12px; padding-left:1.3em; }
.modal__body li{ margin:4px 0; }
.modal__body li > ul{ margin:4px 0 0; }
.modal__body a{ text-underline-offset:3px; }
.modal__body address{ font-style:normal; background:var(--krem); border-radius:var(--radius); padding:12px 14px; margin:0 0 10px; }
.modal__foot{ padding:14px var(--gutter); border-top:1px solid var(--szary); display:flex; justify-content:flex-end; }
html.modal-open{ overflow:hidden; }
.nowrap{ white-space:nowrap; }
@media (min-width:768px){ .modal__head{ padding:26px 32px 18px; } .modal__body{ padding:8px 32px 28px; } .modal__foot{ padding:16px 32px; } }

/* ============ PRZYCISK „NAPISZ DO NAS!” ============ */
.fab{ position:fixed; right:max(16px, env(safe-area-inset-right)); bottom:max(16px, env(safe-area-inset-bottom)); z-index:30;
  display:inline-flex; align-items:center; gap:10px; min-height:52px; padding:12px 22px 12px 16px;
  background:var(--ink); color:var(--papier); border:1px solid var(--ink); border-radius:999px;
  font:800 16px/1 var(--font-body); text-decoration:none; box-shadow:0 10px 26px rgba(43,42,40,.28);
  transition:transform .25s ease, opacity .25s ease, visibility .25s, background-color .2s; }
.fab svg{ width:24px; height:24px; flex:none; }
.fab:hover{ background:#45433F; transform:translateY(-2px); }
.fab:focus-visible{ outline:3px solid var(--musz-1); outline-offset:3px; }
.fab.is-hidden{ opacity:0; visibility:hidden; transform:translateY(16px); pointer-events:none; }
@media (max-width:480px){ .fab{ min-height:48px; padding:10px 18px 10px 13px; font-size:15px; } .fab svg{ width:22px; height:22px; } }
@media print{ .fab{ display:none; } }

@media (prefers-reduced-motion:reduce){
  html, html:focus-within{ scroll-behavior:auto; }
  *,*::before,*::after{ transition-duration:0s!important; animation-duration:0s!important; }
}

/* pole-pułapka na boty (honeypot) – niewidoczne dla ludzi i czytników ekranu */
.hp{ position:absolute!important; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }