/* Ciemny pas u góry strony - ten sam co w nagłówku strony głównej.
   Używany przez centrum pomocy i strony serwisu (logowanie, rejestracja, potwierdzenie, weryfikacja).
   Kopia w pomoc/assets/pasmo.css - zmiany wprowadzaj w obu plikach.

   body.hd      - strona z ciemnym pasem (belka u góry robi się jasna na ciemnym tle)
   .hd-head     - pas kończy się pod tym elementem (odstęp: --hd-pod)
   .hd-k        - karta leżąca na krawędzi pasa; pas kończy się --hd-zak px poniżej jej górnej krawędzi
   .hd-t        - jasny tekst na pasie (nagłówek, opis nad kartą)                                      */
body.hd{overflow-x:clip;--pasmo:radial-gradient(900px 560px at 84% 100vh,rgba(34,169,130,.48),transparent 62%),radial-gradient(760px 560px at 8% calc(100vh + 200px),rgba(28,141,108,.30),transparent 66%),radial-gradient(900px 520px at 55% 100%,rgba(34,169,130,.24),transparent 66%),linear-gradient(180deg,#11302a calc(100vh - 0px),#0d2119 100%),#0e231b}
body.hd .hd-head,body.hd .hd-k{position:relative}
body.hd .hd-head::before,body.hd .hd-k::before{content:"";position:absolute;z-index:-1;left:50%;width:100vw;margin-left:-50vw;top:-100vh;height:auto;transform:none;filter:none;border-radius:0;background:var(--pasmo);pointer-events:none}
body.hd .hd-head::before{bottom:calc(-1 * var(--hd-pod,110px))}
body.hd .hd-k::before{height:calc(100vh + var(--hd-zak,140px))}

body.hd .hd-t,body.hd .hd-t :is(h1,h2,b,strong,label){color:#fff}
body.hd .hd-t :is(p,.lead,.hint,.sub),body.hd p.hd-t:is(.lead,.hint,.sub){color:rgba(255,255,255,.66)}
body.hd .hd-t a:not(.btn),body.hd .hd-t .crumbs a{color:#7fd6b8}
body.hd .hd-t .crumbs,body.hd .hd-t .crumbs b{color:rgba(255,255,255,.66)}
body.hd .hd-t em{color:#7fd6b8}
body.hd .hd-t .chip.mint{background:rgba(127,214,184,.14);color:#7fd6b8}

/* belka na ciemnym pasie - do przewinięcia (klasa .scr) i poza rozwiniętym menu */
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr){background:transparent;box-shadow:none;border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .brand{color:#fff}
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .brand-dim{color:rgba(255,255,255,.45)}
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-links a{color:rgba(255,255,255,.7)}
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-links a:hover,body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-links a.on{color:#fff}
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-cta .btn:not(.btn-p){background:transparent;border-color:rgba(255,255,255,.22);color:#fff}
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-cta .btn-p{background:#fff;color:#12201b!important;box-shadow:none}
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-burger{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-burger span,
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-burger span::before,
body.hd:not(.menu-open) :is(.navb,.nav):not(.scr) .nav-burger span::after{background:#fff}
body.hd :is(.navb,.nav){transition:background .25s,box-shadow .25s}