/* Wygenerowane z projekt-html/blog-kara-grzywna.html przez narzedzia/zbuduj-motyw.py. Nie edytuj ręcznie. */
:root{
  --ink:#14181C; --ink-2:#3D444A; --ink-3:#5E676E;
  --cream:#F2F1EB; --pearl:#FAF9F4; --white:#FFFFFF; --line:#E4E2D9;
  --line-on-ink:rgba(255,255,255,.16); --ink-soft:#C8CDD2;
  --teal:#12B5A6; --teal-mid:#0C837A; --teal-deep:#0A6E66; --teal-tint:#DEF4F1;
  --coral:#E51D40; --coral-hover:#C20B2E; --coral-tint:#FFE4E8;
  --gold:#FFC200; --gold-tint:#FFF3CC;
  --mint:#DCF3E8; --sky:#DDE9F8; --peach:#FDE5D6; --lilac:#E9E2F8; --butter:#FEF1CC;
  --r-in:14px; --r-card:24px; --r-img:32px; --r-panel:40px; --r-pill:999px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s6:24px; --s8:32px;
  --s12:48px; --s16:64px; --s24:96px; --s30:120px;
  --ease:cubic-bezier(.22,.61,.28,1); --ease-out:cubic-bezier(.16,1,.3,1);
  --t1:130ms; --t2:240ms; --t3:460ms;
  --font:'Albert Sans','Avenir Next','Helvetica Neue',Arial,system-ui,sans-serif;
  --wrap:1200px; --gut:32px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{font-family:var(--font);font-size:1.0625rem;line-height:1.65;color:var(--ink-2);
  background:var(--cream);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,svg{display:block;max-width:100%}
button{background:none;border:0;cursor:pointer;font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
:focus-visible{outline:3px solid var(--teal-deep);outline-offset:3px;border-radius:6px}
::selection{background:var(--gold);color:var(--ink)}

h1,h2,h3,h4{color:var(--ink);text-wrap:balance;font-weight:700;letter-spacing:-.02em}
h1{font-size:clamp(2.25rem,4.6vw,3.5rem);line-height:1.06;letter-spacing:-.035em}
h2{font-size:clamp(1.625rem,2.6vw,2.125rem);line-height:1.18;letter-spacing:-.028em}
h3{font-size:1.25rem;line-height:1.3}
p{max-width:64ch}
strong{font-weight:700;color:var(--ink)}
.lead{font-size:1.1875rem;line-height:1.6;color:var(--ink-3)}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:var(--white);
  padding:14px 22px;border-radius:0 0 var(--r-in) 0;font-weight:700}
.skip:focus{left:0}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;
  padding:0 30px;border-radius:var(--r-pill);font-size:1.0625rem;font-weight:700;letter-spacing:-.01em;
  border:2px solid transparent;text-align:center;white-space:nowrap;
  transition:background var(--t1) var(--ease),color var(--t1) var(--ease),
             border-color var(--t1) var(--ease),transform var(--t1) var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn--coral{background:var(--coral);color:var(--white);border-color:var(--coral)}
.btn--coral:hover{background:var(--coral-hover);border-color:var(--coral-hover)}
.btn--ink{background:var(--ink);color:var(--white);border-color:var(--ink)}
.btn--ink:hover{background:#000}
.btn--line{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--line:hover{background:var(--ink);color:var(--white)}
.btn--white{background:var(--white);color:var(--ink);border-color:var(--white)}
.btn--white:hover{background:var(--cream);border-color:var(--cream)}
.btn--sm{min-height:46px;padding:0 22px;font-size:.9375rem}
.btns{display:flex;flex-wrap:wrap;gap:var(--s3)}
.arr{width:18px;height:18px;flex:none}
@keyframes puls{0%{box-shadow:0 0 0 0 rgba(229,29,64,.42)}55%{box-shadow:0 0 0 13px rgba(229,29,64,0)}
  100%{box-shadow:0 0 0 0 rgba(229,29,64,0)}}
.btn--pulse{animation:puls 2.8s var(--ease-out) infinite}
.btn--pulse:hover,.btn--pulse:focus-visible{animation:none}

.nav{position:sticky;top:0;z-index:70;background:rgba(242,241,235,.88);
  backdrop-filter:saturate(150%) blur(12px);border-bottom:1px solid transparent;
  transition:border-color var(--t2) var(--ease)}
.nav.is-stuck{border-bottom-color:var(--line);background:rgba(242,241,235,.95)}
.nav__in{display:flex;align-items:center;gap:var(--s6);height:76px}
.brand{display:flex;align-items:center;margin-right:auto;min-height:48px}
.brand__name{font-weight:800;font-size:1.375rem;letter-spacing:-.03em;color:var(--ink)}
.nav__links{display:flex;gap:var(--s6)}
.nav__links a{font-size:.9375rem;font-weight:600;color:var(--ink-2);padding:13px 0;border-radius:6px}
.nav__links a:hover,.nav__links a[aria-current]{color:var(--teal-deep)}
.nav__links .nav__film{display:inline-flex;align-items:center;gap:7px;color:var(--teal-deep)}
.nav__film svg{width:18px;height:18px;flex:none}

.nav__links a{white-space:nowrap}
@media (max-width:1240px){.nav__links{gap:var(--s4)}}
@media (max-width:1140px){.nav__links .nav__reg{display:none}}
@media (max-width:1020px){.nav__links .nav__pob{display:none}}

.film{margin-block:var(--s8)}
.film__ramka{position:relative;aspect-ratio:16/9;border-radius:var(--r-card);overflow:hidden;background:var(--ink)}
.film__ramka iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#000}
.film__start{position:absolute;inset:0;width:100%;display:grid;place-content:center;justify-items:center;gap:var(--s4);
  border:0;padding:var(--s6);cursor:pointer;font:inherit;color:var(--white);
  background:radial-gradient(120% 120% at 20% 10%,var(--teal-deep) 0%,var(--ink) 62%) center/cover no-repeat}
.film__start::before{content:"";position:absolute;inset:0;background:rgba(10,14,18,.28)}
.film__play,.film__lbl{position:relative}
.film__play{width:72px;height:72px;border-radius:50%;background:var(--coral);display:grid;place-items:center;transition:transform var(--t2) var(--ease)}
.film__play svg{width:30px;height:30px;margin-left:4px}
.film__start:hover .film__play{transform:scale(1.06)}
.film__start:focus-visible{outline:3px solid var(--gold);outline-offset:-6px}
.film__lbl{font-size:1.0625rem;font-weight:800;text-align:center}
.film__lbl small{display:block;margin-top:2px;font-size:.8125rem;font-weight:500;opacity:.8}
.film__ramka--wkrotce .film__start{background:var(--coral);cursor:default}
.film__ramka--wkrotce .film__start::before{display:none}
.film__ramka--wkrotce .film__play{background:var(--white);color:var(--coral)}
.film__ramka--wkrotce .film__start:hover .film__play{transform:none}
.nav__tel{font-size:.9375rem;font-weight:700;color:var(--ink);white-space:nowrap;
  display:flex;align-items:center;min-height:48px}

.foot{background:var(--ink);color:var(--ink-soft);border-radius:var(--r-panel) var(--r-panel) 0 0;
  padding:var(--s24) 0 var(--s12);margin-top:var(--s16)}
.foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.25fr 1fr;gap:var(--s10,40px)}
.foot h3{font-size:.75rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--teal);margin-bottom:var(--s6)}
.foot ul{display:grid;gap:2px}
.foot li a,.foot li{display:inline-block;padding-block:6px;font-size:.9375rem}
.foot li a:hover{color:var(--white)}
.foot__brand{margin-bottom:var(--s4)}
.foot__brand .brand__name{color:var(--white)}
.foot__about{font-size:.9375rem;max-width:36ch}
.pay{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.pay span{font-size:.75rem;font-weight:700;color:var(--white);background:rgba(255,255,255,.12);
  border-radius:8px;padding:6px 11px;line-height:1}
.foot__pay{margin-top:var(--s16);padding-top:var(--s8);border-top:1px solid var(--line-on-ink);
  display:flex;align-items:flex-start;gap:var(--s8);flex-wrap:wrap}
.foot__pay-l{flex:0 1 26rem}
.foot__pay-t svg{width:14px;height:14px;flex:none}
.foot__pay-t{display:flex;align-items:center;gap:7px;font-size:.6875rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--teal);margin-bottom:12px}

.foot__pay .pay{margin-top:0;gap:8px}
.foot__pay .pay span{font-size:.8125rem;padding:9px 14px;border-radius:10px;
  background:rgba(255,255,255,.1);border:1px solid var(--line-on-ink);letter-spacing:-.01em}
.foot__pay .pay .pay__x{background:var(--white);color:var(--ink);border-color:var(--white);font-weight:800}
.foot__pay p{flex:1 1 18rem;max-width:none;font-size:.8125rem;line-height:1.6;color:#98A0A7}
.foot__legal{margin-top:var(--s16);padding-top:var(--s8);border-top:1px solid var(--line-on-ink);
  display:flex;justify-content:space-between;gap:var(--s6);flex-wrap:wrap;font-size:.8125rem;color:#98A0A7}
.foot__legal a{padding-block:4px;display:inline-block}
.foot__legal a:hover{color:var(--white)}

.js .rv{opacity:0;transform:translateY(14px);
  transition:opacity var(--t3) var(--ease-out),transform var(--t3) var(--ease-out)}
.js .rv.in{opacity:1;transform:none}

@media (max-width:1080px){:root{--gut:24px;--s30:88px;--s24:72px;--s16:48px}
  .foot__grid{grid-template-columns:1fr 1fr}}
@media (max-width:900px){.nav__links{display:none}}
@media (max-width:640px){:root{--gut:18px;--s24:56px;--s16:40px;--s12:32px}
  .nav__in{height:66px}.nav__tel{display:none}
  .foot__grid{grid-template-columns:1fr;gap:var(--s8)}
  .foot__pay{flex-direction:column;align-items:flex-start;gap:var(--s4)}
  .foot{border-radius:var(--r-card) var(--r-card) 0 0}
  .btns{flex-direction:column;align-items:stretch}.btns .btn{width:100%;white-space:normal;line-height:1.25}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none}.btn--pulse{animation:none}.btn:hover{transform:none}}


.art{max-width:44rem;margin-inline:auto;padding-block:var(--s12) var(--s16)}
.art__back{display:flex;width:fit-content;align-items:center;gap:9px;font-size:.9375rem;font-weight:700;
  color:var(--ink-3);padding:10px 0;margin-bottom:var(--s6)}
.art__back svg{width:16px;height:16px;transition:transform var(--t1) var(--ease)}
.art__back:hover{color:var(--ink)}
.art__back:hover svg{transform:translateX(-4px)}
.art__k{display:inline-block;font-size:.6875rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  background:var(--ink);color:var(--white);border-radius:var(--r-pill);padding:7px 14px;margin-bottom:var(--s6)}
.art h1{margin-bottom:var(--s6)}
.art__lead{font-size:1.25rem;line-height:1.55;color:var(--ink-3);max-width:none;margin-bottom:var(--s8)}
.art__meta{display:flex;flex-wrap:wrap;gap:var(--s4);align-items:center;padding-block:var(--s6);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.875rem;color:var(--ink-3)}
.art__meta b{color:var(--ink);font-weight:700}
.art__av{width:38px;height:38px;border-radius:50%;object-fit:cover;flex:none;background:var(--teal);color:#04312D;
  display:grid;place-items:center;font-weight:800;font-size:.8125rem}
.art__who{display:flex;align-items:center;gap:11px}

.art__body{padding-top:var(--s8)}
.art__body p{font-size:1.125rem;line-height:1.75;max-width:none;margin-bottom:var(--s6);color:var(--ink-2)}
.art__body h2{margin:var(--s12) 0 var(--s4)}
.art__body h3{margin:var(--s8) 0 var(--s3);font-size:1.125rem}
.art__body ul,.art__body ol{display:grid;gap:14px;margin-bottom:var(--s6)}
.art__body li{font-size:1.125rem;line-height:1.7;padding-left:34px;position:relative;color:var(--ink-2)}
.art__body ul li::before{content:"";position:absolute;left:4px;top:.62em;width:11px;height:6px;
  border-left:2.5px solid var(--teal-mid);border-bottom:2.5px solid var(--teal-mid);transform:rotate(-45deg)}
.art__body ol{counter-reset:k}
.art__body ol li{counter-increment:k}
.art__body ol li::before{content:counter(k);position:absolute;left:0;top:.18em;width:24px;height:24px;
  border-radius:var(--r-pill);background:var(--ink);color:#fff;font-size:.8125rem;font-weight:800;
  display:grid;place-items:center}
.art__body a{color:var(--teal-deep);font-weight:600;border-bottom:2px solid rgba(10,110,102,.3)}
.art__body a:hover{border-bottom-color:var(--teal-deep)}

.box{border-radius:var(--r-card);padding:var(--s8);margin-block:var(--s8);display:flex;gap:var(--s4)}
.box--info{background:var(--sky)}
.box--warn{background:var(--peach)}
.box--tip{background:var(--mint)}
.box__i{width:38px;height:38px;flex:none;border-radius:12px;background:var(--ink);display:grid;place-items:center}
.box__i svg{width:19px;height:19px;color:#fff}
.box b{display:block;font-size:1.0625rem;font-weight:700;color:var(--ink);margin-bottom:6px}
.box p{font-size:1rem!important;line-height:1.6!important;margin-bottom:0!important;color:var(--ink-2)}
.box p+p{margin-top:12px!important}

.tab{width:100%;border-collapse:collapse;margin-block:var(--s6);font-size:1rem;
  background:var(--white);border-radius:var(--r-card);overflow:hidden}
.tab th,.tab td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--line)}
.tab th{background:var(--ink);color:var(--white);font-weight:700;font-size:.875rem;
  letter-spacing:.02em;border-bottom:0}
.tab tr:last-child td{border-bottom:0}
.tab td:first-child{font-weight:700;color:var(--ink);white-space:nowrap}
.tabwrap{overflow-x:auto;border-radius:var(--r-card)}

.artcta{background:var(--ink);color:var(--ink-soft);border-radius:var(--r-panel);
  padding:var(--s12);margin-block:var(--s12);text-align:center}
.artcta h2{color:var(--white);margin-bottom:var(--s4);max-width:24ch;margin-inline:auto}
.artcta p{font-size:1rem!important;margin:0 auto var(--s8)!important;max-width:48ch;color:var(--ink-soft)!important}
.artcta .btns{justify-content:center}

.artcta .btn{border:2px solid transparent}
.artcta .btn--coral{color:var(--white);border-color:var(--coral)}
.artcta .btn--coral:hover{color:var(--white);border-color:var(--coral-hover)}
.artcta .btn--white{color:var(--ink);border-color:var(--white)}
.artcta .btn--white:hover{color:var(--ink);border-color:var(--cream)}

.rel{padding-bottom:var(--s16)}
.rel h2{margin-bottom:var(--s8)}
.relg{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6)}
.relc{background:var(--white);border:2px solid var(--white);border-radius:var(--r-card);padding:var(--s8);
  transition:border-color var(--t2) var(--ease),transform var(--t2) var(--ease)}
.relc:hover{transform:translateY(-4px);border-color:var(--ink)}
.relc span{display:inline-block;font-size:.6875rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--teal-deep);background:var(--teal-tint);border-radius:var(--r-pill);padding:5px 11px;margin-bottom:var(--s4)}
.relc b{display:block;font-size:1.0625rem;font-weight:700;color:var(--ink);letter-spacing:-.02em;line-height:1.35}

@media (max-width:640px){
  .relg{grid-template-columns:1fr}
  .artcta{padding-inline:var(--s8);border-radius:var(--r-card)}
  .art__body p,.art__body li{font-size:1.0625rem}
  .box{flex-direction:column;gap:var(--s3)}
}



.nav__burger{display:none}
.mnav{display:none}
@media (max-width:640px){
  .nav__in>.btn{display:none}
  .nav__burger{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
    width:44px;height:44px;margin-left:auto;margin-right:-10px;border-radius:12px;background:none;border:0;cursor:pointer}
  .nav__burger span{display:block;width:22px;height:2px;border-radius:2px;background:var(--ink)}
  .mnav{display:flex;flex-direction:column;position:fixed;inset:0;z-index:600;background:var(--cream);
    padding:0 var(--gut,18px) calc(var(--s8,32px) + env(safe-area-inset-bottom));overflow-y:auto;
    opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}
  .mnav.open{opacity:1;visibility:visible}
  .mnav__top{display:flex;align-items:center;justify-content:flex-end;height:66px;flex:none}
  .mnav__x{width:44px;height:44px;margin-right:-10px;display:grid;place-items:center;background:none;border:0;cursor:pointer;color:var(--ink)}
  .mnav__x svg{width:22px;height:22px}
  .mnav__list{list-style:none;margin:var(--s8,32px) 0 0;padding:0}
  .mnav__list a{display:block;padding:9px 0;font-size:2rem;line-height:1.15;font-weight:700;letter-spacing:-.035em;color:var(--ink);
    opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease,color .15s ease}
  .mnav__list a:active{color:var(--teal-deep)}
  .mnav.open .mnav__list a{opacity:1;transform:none}
  .mnav.open .mnav__list li:nth-child(2) a{transition-delay:.04s}
  .mnav.open .mnav__list li:nth-child(3) a{transition-delay:.08s}
  .mnav.open .mnav__list li:nth-child(4) a{transition-delay:.12s}
  .mnav.open .mnav__list li:nth-child(5) a{transition-delay:.16s}
  .mnav.open .mnav__list li:nth-child(6) a{transition-delay:.2s}
  .mnav.open .mnav__list li:nth-child(7) a{transition-delay:.24s}
  html.mnav-on{overflow:hidden}
  #kontakt{scroll-margin-top:84px}
}
@media (max-width:640px) and (prefers-reduced-motion:reduce){
  .mnav,.mnav__list a{transition:none}
}


.foot a[target="_blank"]{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}