/*****************************/
/*** Core html setup stuff ***/
/*****************************/

html {
  height: 100%;
  margin-bottom: 1px;
}

form {
  margin: 0;
  padding: 0;
}

body {
	font-family: Helvetica,Arial,sans-serif;
	line-height: 1.3em;
	margin: 0px 0px 0px 0px;
	font-size: 12px;
	color: #333;
}

a:link, a:visited {
	text-decoration: none;
	font-weight: normal;
}

a:hover {
	text-decoration: underline;
	font-weight: normal;
}

input.button { cursor: pointer; }

p { margin-top: 0; margin-bottom: 5px; }

img { border: 0 none; }

/*****************************************/
/*** Template specific layout elements ***/
/*****************************************/
#page_bg {
	padding: 10px 0;
	margin-bottom: 1px;
}

div.center {
  text-align: center;
}

div#wrapper {
	margin-left: auto;
	margin-right: auto;
}

body.width_medium div#wrapper {
	width: 950px;
}

body.width_small div#wrapper {
	width: 773px;
}

body.width_fmax div#wrapper {
	min-width: 750px;
	max-width: 1050px;
}

div#header_l {
	position: relative;
}

div#header_r {
	height: 90px;
	padding-left: 370px;
	padding-right: 30px;
	padding-top: 25px;
	overflow: hidden;
	text-align: left;
}

div#logo {
	position: absolute;
	left: 0;
	top: 0;
	float: left;
	width: 298px;
	height: 75px;
	background: url(../images/mw_joomla_logo.png) 0 0 no-repeat;
	margin-left: 30px;
	margin-top: 25px;
}

div#newsflash {
	width: auto;
	margin-left: 350px;
	margin-right: 30px;
	border: 1px solid #00f;
}

div#tabarea {
	background: #f7f7f7 url(../images/mw_header_b.png) 0 0 repeat-x;
	margin: 0 11px;

}

div#tabarea_l {
	background: url(../images/mw_header_l_b.png) 0 0 no-repeat;
	padding-left: 32px;
}

div#tabarea_r {
	height: 42px;
	background: url(../images/mw_header_r_b.png) 100% 0 no-repeat;
	padding-right: 1px;
}

div#footer_r {
	padding-top: 10px;
	height: 47px;
	overflow: hidden;
}

div#footer_r div {
	text-align: center;
	font-size: .90em;
	color: #aaa;
}

div#footer_r a:link, div#footer_r a:visited  {
	color: #999;
}

div#footerspacer {
	height: 10px;
}

#pathway {
	padding: 0px 10px 8px;
	width: auto;
	margin-top: -2px;
	margin-right: 250px;
	text-align: left;
}

#search {
	float: right;
	width:320px;
	margin-top: -20px;
	margin-right: 30px;
	height: 40px;
	overflow: hidden;
	text-align:right;
}

form#searchForm input {
	vertical-align: middle;
}

form#searchForm table {
	border-collapse: collapse;
}

form#searchForm td {
	padding:0;
}

#mod_search_searchword {
	padding-left: 3px;
}

#area {
	padding: 0;
}

#whitebox {
	margin: 0 21px 0px 21px;
	background: #fff;
	width: auto;
}

#whitebox div {
	text-align: left;
}

#whitebox_t {
	background: #fff url(../images/mw_content_t.png) 0 0 repeat-x;
}

#whitebox_tl {
	background: url(../images/mw_content_t_l.png) 0 0 no-repeat;
}

#whitebox_tr {
	height: 10px;
	overflow: hidden;
	background: url(../images/mw_content_t_r.png) 100% 0 no-repeat;
}

#whitebox_m {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	width: auto;
	padding: 1px 8px;
}

#whitebox_b {
	margin-top: -5px;
	background: url(../images/mw_content_b.png) 0 100% repeat-x;
}

#whitebox_bl {
	background: url(../images/mw_content_b_l.png) 0 100% no-repeat;
}

#whitebox_br {
	height: 13px;
	background: url(../images/mw_content_b_r.png) 100% 100% no-repeat;
}

/* horizontal pill menu */
table.pill {
  margin-left: auto;
  margin-right: auto;
  padding: 0;
}

td.pill_l {
  background: url(../images/mw_menu_cap_l.png) no-repeat;
  width:  20px;
  height: 32px;

}

td.pill_m {
  background: url(../images/mw_menu_normal_bg.png) repeat-x;
  padding: 0;
  margin: 0;
  width: auto;
}

td.pill_r {
  background: url(../images/mw_menu_cap_r.png) no-repeat;
  width:  19px;
  height: 32px;
}

#pillmenu {
  white-space: nowrap;
  height: 32px;
  float: left;
}

#pillmenu ul {
  margin: 0;
  padding: 0;
  list-style:none;
}

#pillmenu li {
	float: left;
	background: url(../images/mw_menu_separator.png) top right no-repeat;
	margin: 0;
	padding: 0;
}

#pillmenu a {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
	float:left;
  display:block;
  height: 24px;
  line-height: 24px;
  padding: 0 20px;
  color: #000;
  text-decoration: none;
}

#pillmenu a#active_menu-nav {
	margin-top:2px;
	height: 21px;
	line-height: 21px;
	background-position: 0 0;
}

#leftcolumn {
	padding: 0;
	margin: 0;
	width: 20%;
	float:left;
}

#maincolumn,
#maincolumn_full {
	margin-left: 20%;
	padding-left: 15px;
	width: 75%;
}

#maincolumn_full {
	margin-left: 0;
	padding: 0;
	width: 100%;
}

table.nopad {
	width: 100%;
	border-collapse: collapse;
	padding: 0;
	margin: 0;
	margin-bottom: 15px;
}

table.nopad td.middle_pad {
	width: 20px;
}

/*****************************************/
/*** Joomla! specific content elements ***/
/*****************************************/

div.offline {
	background: #fffebb;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	font-size: 1.2em;
	padding: 5px;
}

span.pathway {
  display: block;
  margin: 0 20px;
  height: 16px;
  line-height: 16px;
  overflow: hidden;
}

/* headers */
div.componentheading {
  padding-left: 0px;
}

h1 {
	padding: 0;
	font-family:Helvetica ,Arial,sans-serif;
	font-size: 1.3em;
	font-weight: bold;
	vertical-align: bottom;
	color: #666;
	text-align: left;
	width: 100%;
}

h2, .contentheading {
	padding: 0;
	font-family: Arial, Helvetica,sans-serif;
	font-size: 1.4em;
	font-weight: normal;
	vertical-align: bottom;
	color: #333;
	text-align: left;
	width: 100%;
}

table.contentpaneopen h3 {
	margin-top: 25px;
}

h4 {
	font-family: Arial, Helvetica, sans-serif;
	color: #333;
}

h3, .componentheading, table.moduletable th, legend {
  margin: 0;
  font-weight: bold;
  font-family: Helvetica,Arial,sans-serif;
  font-size: 1.5em;
  padding-left: 0px;
	margin-bottom: 10px;
	text-align: left;
}

/* small text */
.small {
	font-size: .90em;
	color: #999;
	font-weight: normal;
	text-align: left;
}

.modifydate {
  height: 20px;
  vertical-align: bottom;
	font-size: .90em;
	color: #999;
	font-weight: normal;
	text-align: left;
}

.createdate {
	height: 20px;
	vertical-align: top;
	font-size: .90em;
	color: #999;
	font-weight: normal;
	vertical-align: top;
	padding-bottom: 5px;
	padding-top: 0px;

}

a.readon {
	margin-top: 10px;
	display: block;
	float: left;
	background: url(../images/mw_readon.png) top right no-repeat;
	padding-right: 20px;
	line-height: 14px;
	height: 16px;
}

/* form validation */
.invalid { border-color: #ff0000; }
label.invalid { color: #ff0000; }


/** overlib **/

.ol-foreground {
	background-color: #f6f6f6;
}

.ol-background {
	background-color: #666;
}

.ol-textfont {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
}

.ol-captionfont {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #f6f6f6;
	font-weight: bold;
}
.ol-captionfont a {
	color: #0B55C4;
	text-decoration: none;
	font-size: 12px;
}

.ol-closefont {}

/* menu links */
a.mainlevel:link, a.mainlevel:visited {
	padding-left: 5px;
}

a.mainlevel:hover {

}

/* spacers */
span.article_separator {
	display: block;
	height: 20px;
}

.article_column {
	padding-right: 5px;
}

.column_separator {
	border-left: 1px dashed #e0e0e0;
	padding-left: 10px;
}

td.buttonheading {

}

td.buttonheading img {
	border:none;
}

.clr {
	clear: both;
}

td.greyline {
  width: 20px;
  background: url(../images/mw_line_grey.png) 50% 0 repeat-y;
}

div#maindivider {
  border-top: 1px solid #ddd;
  margin-bottom: 10px;
  overflow: hidden;
  height: 1px;
}

table.blog span.article_separator {
	display: block;
	height: 20px;
}

/* edit button */
.contentpaneopen_edit{
	float: left;
}

/* table of contents */
table.contenttoc {
  margin: 5px;
  border: 1px solid #ccc;
  padding: 5px;
  float: right;
}

table.contenttoc td {
  padding: 0 5px;
}


/* content tables */
td.sectiontableheader {
  background: #efefef;
  color: #333;
  font-weight: bold;
  padding: 4px;
  border-right: 1px solid #fff;
}

tr.sectiontableentry0 td,
tr.sectiontableentry1 td,
tr.sectiontableentry2 td {
  padding: 4px;
}

td.sectiontableentry0,
td.sectiontableentry1,
td.sectiontableentry2 {
  padding: 3px;
}


/* content styles */
table.contentpaneopen, table.contentpane {
	margin: 0;
	padding: 0;
	width: 100%;
}

table.contentpaneopen li {
	margin-bottom: 5px;
}

table.contentpaneopen fieldset {
	border: 0;
	border-top: 1px solid #ddd;
}

table.contentpaneopen h3 {
	margin-top: 25px;
}

table.contentpaneopen h4 {
	font-family: Arial, Helvetica, sans-serif;
	color: #333;
}

.highlight {
	background-color: #fffebb;
}

/* module control elements */
table.user1user2 div.moduletable {
	margin-bottom: 0px;
}

div.moduletable, div.module {
  margin-bottom: 25px;
}

div.module_menu h3 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #eee;
	margin: -23px -4px 5px -5px;
	padding-left: 10px;
	padding-bottom: 2px;
}

div.module_menu {
	margin: 0;
	padding: 0;
	margin-bottom: 15px;
}

div.module_menu div div div {
	padding: 10px;
	padding-top: 30px;
	padding-bottom: 15px;
	width: auto;
}

div.module_menu div div div div {
	background: none;
	padding: 0;
}

div.module_menu ul {
	margin: 10px 0;
	padding-left: 20px;
}

div.module_menu ul li a:link, div.module_menu ul li a:visited {
	font-weight: bold;
}

#leftcolumn div.module {
	padding: 0 10px;
}

#leftcolumn div.module table {
	width: auto;
}

/* forms */
table.adminform textarea {
  width: 540px;
  height: 400px;
  font-size: 1em;
  color: #000099;
}

div.search input {
	width: 145px;
	border: 1px solid #ccc;
	margin: 15px 0 10px 0;
}

form#form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
form#form-login ul { padding-left: 20px; }

form#com-form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
form#com-form-login ul { padding-left: 20px; }

/* thumbnails */
div.mosimage         {  margin: 5px; }
div.mosimage_caption {  font-size: .90em; color: #666; }

div.caption       { padding: 0 10px 0 10px; }
div.caption img   { border: 1px solid #CCC; }
div.caption p     { font-size: .90em; color: #666; text-align: center; }

div.img_caption       { padding: 0 10px 0 10px; }
div.img_caption img   { border: 1px solid #CCC; }
div.img_caption p     { font-size: .90em; color: #666; text-align: center; }

/* Parameter Table */
table.paramlist {
	margin-top: 5px;
}

table.paramlist td.paramlist_key {
	width: 128px;
	text-align: left;
	height: 30px;
}

table.paramlist td.paramlist_value {
}

div.message {
	font-family : "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size : 14px;
	color : #c30;
	text-align: center;
	width: auto;
	background-color: #f9f9f9;
	border: solid 1px #d5d5d5;
	margin: 3px 0px 10px;
	padding: 3px 20px;
}

/* Banners module */

/* Default skyscraper style */
.bannergroup {
}

.banneritem img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Text advert style */

.banneritem_text {
	padding: 4px;
	font-size: 11px;
}

.bannerfooter_text {
	padding: 4px;
	font-size: 11px;
	background-color: #F7F7F7;
	text-align: right;
}

/* System Messages */
/* see system general.css */

.pagination span { padding: 2px; }
.pagination a    { padding: 2px; }

/* Polls */
.pollstableborder td {
	text-align: left;
}

/* WebLinks */
span.description {
	display:block;
	padding-left: 30px;
}

/* Frontend Editing*/
fieldset {
	border: 1px solid #ccc;
	margin-top: 15px;
	padding: 15px;
}

legend {
	margin: 0;
	padding: 0 10px;
}

td.key {
	border-bottom:1px solid #eee;
	color: #666;
}

/* Tooltips */

.tool-tip {
	float: left;
	background: #ffc;
	border: 1px solid #D4D5AA;
	padding: 5px;
	max-width: 200px;
}

.tool-title {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-weight: bold;
	margin-top: -15px;
	padding-top: 15px;
	padding-bottom: 5px;
	background: url(../../system/images/selector-arrow.png) no-repeat;
}

.tool-text {
	font-size: 100%;
	margin: 0;
}

/* System Standard Messages */
#system-message { margin-bottom: 20px; }

#system-message dd.message ul { background: #C3D2E5 url(../../system/images/notice-info.png) 4px center no-repeat;border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

/* System Error Messages */
#system-message dd.error ul { color: #c00; background: #E6C0C0 url(../../system/images/notice-alert.png) 4px center no-repeat; border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

/* System Notice Messages */
#system-message dd.notice ul { color: #c00; background: #EFE7B8 url(../../system/images/notice-note.png) 4px center no-repeat; border-top: 3px solid #F0DC7E; border-bottom: 3px solid #F0DC7E; margin:0px; padding-left: 40px; text-indent:0px;}

#syndicate{
	float:left;
	padding-left: 25px;
}

#power_by{
	float:right;
	padding-right: 25px;
}

/* Component Specific Fixes */

#component-contact table td {
	padding: 2px 0;
}

.item-page .article-info, ul.pager {
display:none;
}

.pasektop {
background: rgba(0, 0, 0, 0) url("../images/pasek_top.jpg") no-repeat scroll 0 0;
float: left;
width: 100%;
padding-bottom:1px;
}


.pasektop #fontsize, .pasektop .jfontsize {
float:right;
padding-top:4px;
margin-right:40px;

background:#fff;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
display:block;
  padding: 2px 15px 2px 15px;
  margin-top:8px;
}



.pasektop .jfontsize #jfontsize-minus {
  font-size: 1.1em;
  color:#000;
}

.pasektop .jfontsize #jfontsize-default {
  font-size: 1.3em;
  font-weight: 600;
  color:#e5692d;
}

.pasektop .jfontsize #jfontsize-plus {
  font-size: 1.6em;
  font-weight: 700;
    color:#000;
}

.pasektop .jfontsize a {
  color: #b73c00;
  padding: 0 1px 0 0;
  text-decoration: none;
  border:0px;
}

.pasektop .jfontsize a:hover {
background:none;
}


.content-outer {

margin: auto;
width: 1000px;
background:#f2ebcf;
overflow:hidden;
}



.pasektop  a.niedowidzacy-btn {
  background: #fff url("../images/dla_niedowidzacych_ico.png") no-repeat scroll right center !important;

  float: right;
  font-weight: bold;
font-size:1.2em;
color:#000;
  margin-right: 20px;
margin-top:8px;
  padding: 6px 48px 6px 15px;


-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
display:block;
}

.pasektop  a.normalny-btn {
  background: #fff url("../images/dla_niedowidzacych_ico.png") no-repeat scroll right center !important;

  float: right;
  font-weight: bold;
font-size:1.2em;
color:#000;
  margin-right: 20px;
margin-top:8px;
  padding: 6px 48px 6px 15px;


-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
display:block;
}




#menu .vvisit_counter  {
padding:0px;
margin:20px 0px 20px 0px;
}

#menu .vvisit_counter div, #menu .vvisit_counter hr {
display:none;
}

#menu .vvisit_counter div.vdigit_counter {
display:block;
}

dt.a-m-d, .a-m-t-n, .a-m-t, .sf-menu li {
background: url(../images/normal/linia3.jpg) 24px 0 no-repeat;
padding-top: 17px;
padding-left: 44px;
padding-bottom: 10px;
font-family: "Century Gothic", Verdana;
font-size: 1.3em; /*15px;*/
/*height: 20px;*/
z-index: 100;
}

.sf-menu li.item-101 {
background:none;
}

.breadcrumb {
  font-size: 1.3em;
}

body .item-page {
font-size:1.3em;
overflow:hidden;
}

.articlebody {
float: left;
width: 95%;
}

a._dodatkowa {
  padding: 10px 20px !important;   
  text-align: left !important;
  width: 60% !important;
  height: 20px !important;
  
}

/* ==========================================================================
   Dodatki WCAG 2.1 oraz Asystent AI Chat (Stowarzyszenie SRNIS)
   ========================================================================== */

/* Skip Link dla klawiatury */
.wcag-skip-link {
    position: absolute;
    top: -100px;
    left: 50%;
    transform: translateX(-50%);
    background: #e06000;
    color: #ffffff !important;
    padding: 8px 15px;
    border-radius: 0 0 4px 4px;
    font-weight: bold;
    font-family: Arial, sans-serif;
    z-index: 10000;
    transition: top 0.2s ease;
    outline: none;
    text-decoration: none !important;
}
.wcag-skip-link:focus {
    top: 0;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
}

/* Przyciski WCAG w nagłówku */
.wcag-btn-inline {
    background-color: #ffffff;
    color: #333333;
    border: 1px solid #cccccc;
    border-radius: 3px;
    padding: 2px 6px;
    font-size: 11px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s ease;
}
.wcag-btn-inline:hover, .wcag-btn-inline:focus {
    background-color: #e06000;
    color: #ffffff;
    border-color: #e06000;
    outline: none;
}

/* Nadpisania WCAG dla wielkości czcionek */
body.wcag-font-small { font-size: 10px !important; }
body.wcag-font-large { font-size: 15px !important; }
body.wcag-font-large h1, body.wcag-font-large .componentheading { font-size: 20px !important; }
body.wcag-font-large p, body.wcag-font-large td, body.wcag-font-large li { font-size: 15px !important; }

/* Podkreślanie linków */
body.wcag-underlines a {
    text-decoration: underline !important;
}

/* Czcionka dla dyslektyków */
body.wcag-readable-font {
    font-family: Arial, sans-serif !important;
    letter-spacing: 0.03em;
    word-spacing: 0.06em;
}

/* Stylizacja Asystenta AI Chat */
.fop-chat-toggle {
    position: fixed;
    bottom: 25px;
    right: 25px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #002e5b;
    color: #ffffff;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    outline: none;
}
.fop-chat-toggle:hover, .fop-chat-toggle:focus {
    transform: scale(1.08);
    background-color: #e06000;
}
.fop-chat-toggle .fop-chat-ico-close { display: none; width: 25px; height: 25px; }
.fop-chat-toggle .fop-chat-ico-chat { display: block; width: 25px; height: 25px; }
.fop-chat-toggle.is-open .fop-chat-ico-close { display: block; }
.fop-chat-toggle.is-open .fop-chat-ico-chat { display: none; }

.fop-chat-panel {
    position: fixed;
    bottom: 95px;
    right: 25px;
    width: 350px;
    height: 480px;
    max-height: calc(100vh - 120px);
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    overflow: hidden;
    border: 1px solid rgba(0,0,0,0.1);
    font-family: Arial, sans-serif;
}
.fop-chat-panel.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.fop-chat-head {
    background: linear-gradient(135deg, #002e5b, #001a35);
    color: #ffffff;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
}
.fop-chat-head__avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f39200;
}
.fop-chat-head__avatar svg { width: 20px; height: 20px; }
.fop-chat-head__t { display: flex; flex-direction: column; }
.fop-chat-head__t b { font-size: 13.5px; font-weight: bold; }
.fop-chat-head__t span { font-size: 10.5px; color: rgba(255, 255, 255, 0.7); }

.fop-chat-close {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #ffffff;
    font-size: 22px;
    cursor: pointer;
    opacity: 0.8;
}

.fop-chat-body {
    flex: 1;
    padding: 12px;
    overflow-y: auto;
    background-color: #f4f6f9;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fop-msg {
    max-width: 85%;
    padding: 8px 12px;
    border-radius: 10px;
    font-size: 12.5px;
    line-height: 1.4;
    word-wrap: break-word;
}
.fop-msg--bot {
    background-color: #ffffff;
    color: #333333;
    align-self: flex-start;
    border-bottom-left-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.fop-msg--user {
    background-color: #002e5b;
    color: #ffffff;
    align-self: flex-end;
    border-bottom-right-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.fop-chat-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 5px;
    width: 100%;
}
.fop-chip {
    background-color: #ffffff;
    color: #002e5b;
    border: 1px solid #002e5b;
    padding: 5px 10px;
    border-radius: 12px;
    font-size: 11px;
    cursor: pointer;
    font-weight: bold;
}
.fop-chip:hover {
    background-color: #002e5b;
    color: #ffffff;
}

.fop-chat-foot {
    padding: 8px;
    background-color: #ffffff;
    border-top: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    gap: 6px;
}
.fop-chat-foot input {
    flex: 1;
    border: 1px solid #e2e8f0;
    border-radius: 15px;
    padding: 6px 12px;
    font-size: 12.5px;
    outline: none;
}
.fop-chat-foot button {
    background-color: #002e5b;
    color: #ffffff;
    border: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.fop-chat-foot button svg { width: 14px; height: 14px; transform: rotate(45deg); }
.fop-chat-disclaimer { background-color: #edf2f7; color: #718096; font-size: 9px; padding: 3px; text-align: center; }

.fop-typing {
    background-color: #ffffff;
    padding: 8px 12px;
    border-radius: 10px;
    border-bottom-left-radius: 2px;
    display: flex;
    align-items: center;
    gap: 3px;
    align-self: flex-start;
}
.fop-typing span {
    width: 5px;
    height: 5px;
    background-color: #a0aec0;
    border-radius: 50%;
    animation: fopBounce 1.4s infinite ease-in-out both;
}
.fop-typing span:nth-child(1) { animation-delay: -0.32s; }
.fop-typing span:nth-child(2) { animation-delay: -0.16s; }

/* Odbudowa stylów Breadcrumbs dla Joomla 5 */
.breadcrumb {
    display: inline-flex !important;
    flex-wrap: wrap !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 8px !important;
}
.breadcrumb-item {
    display: inline-flex !important;
    align-items: center !important;
}
.breadcrumb-item a {
    color: #402000 !important; /* dopasowanie do brązowych odcieni paska */
    text-decoration: underline !important;
}
.breadcrumb-item a:hover {
    text-decoration: none !important;
}
.breadcrumb-item + .breadcrumb-item::before {
    content: " » " !important;
    padding-right: 8px !important;
    color: #402000 !important;
}
.breadcrumb-item.active {
    font-weight: bold !important;
    color: #000000 !important;
}

/* ==========================================================================
   KASOWANIE SZTYWNYCH ELEMENTÓW I TŁA RHUK MILKYWAY
   ========================================================================== */
#part2, #part3, #part6, .part0, #part5, #part7 {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    float: none !important;
}

#menu, #content {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* ==========================================================================
   NOWY RESPONSYWNY LAYOUT I ESTETYKA PREMIUM (Outfit, Flexbox, Karty)
   ========================================================================== */

/* Globalna zmiana czcionki na Outfit */
body, p, li, a, span, div, td, input, button, select, textarea, h1, h2, h3, h4, h5, h6 {
    font-family: 'Outfit', sans-serif !important;
}

/* Elastyczne kontenery główne */
#center {
    width: 95% !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

.content-outer {
    width: 95% !important;
    max-width: 1100px !important;
    margin: 20px auto !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
    display: flex !important;
    flex-wrap: wrap !important;
    padding: 20px !important;
    gap: 20px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Responsywny baner nagłówkowy */
#header_image {
    width: 100% !important;
    max-width: 1100px !important;
    height: 0 !important;
    padding-top: 22.9% !important; /* Proporcja oryginalnego banera 229px / 1000px */
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    margin: 0 auto !important;
    border-radius: 12px !important;
}

#header_image2 {
    width: 100% !important;
    max-width: 1100px !important;
    height: 6px !important;
    background-size: contain !important;
    margin: 5px auto !important;
}

/* Układ jednokolumnowy (bez lewej kolumny) */
#menu {
    display: none !important; /* Całkowite ukrycie lewej kolumny */
}

#content {
    width: 100% !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

/* Karty Premium dla modułów w sidebarze i głównej treści */
#menu div.module, #menu div.module_menu, #menu .sidebar-card {
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
    padding: 20px !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    box-sizing: border-box !important;
}

#menu div.module:hover, #menu div.module_menu:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06) !important;
}

/* Główny kontener treści jako karta */
#content #part4 {
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
    padding: 25px !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 !important;
}

/* Czysta lista menu bez legacy linii linia3.jpg i marginów */
.mod-menu {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.mod-menu li {
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
    font-size: 1.15em !important;
}

.mod-menu li:last-child {
    border-bottom: none !important;
}

.mod-menu li a {
    padding: 10px 14px !important;
    display: block !important;
    text-decoration: none !important;
    border-left: 3px solid transparent !important;
}

.mod-menu ul.nav-child {
    list-style: none !important;
    padding-left: 15px !important;
    margin-top: 5px !important;
}

.mod-menu ul.nav-child li {
    border-bottom: none !important;
    font-size: 0.9em !important;
}

/* Uporządkowanie stopki */
#part8 {
    width: 100% !important;
    float: none !important;
    margin-top: 20px !important;
    padding: 22px 25px !important;
    clear: both !important;
    box-sizing: border-box !important;
    background: linear-gradient(135deg, #0f385a 0%, #123f66 100%) !important;
    border-radius: 14px !important;
    color: #dbe6f0 !important;
    font-size: 0.9em !important;
    text-align: center !important;
    line-height: 1.6 !important;
    box-shadow: 0 8px 20px rgba(15, 56, 90, 0.12) !important;
}

#part8 a {
    color: #f2a154 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

#part8 a:hover {
    color: #ffffff !important;
    text-decoration: underline !important;
}

#part8 * {
    color: inherit !important;
}

#part8 img {
    border-radius: 8px !important;
}

img {
    max-width: 100% !important;
    height: auto !important;
}

/* Pasek WCAG - ulepszenia wyglądu */
.pasektop {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
    padding: 12px 20px !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    margin-bottom: 15px !important;
}

/* ==========================================================================
   NOWOCZESNE WIDŻETY WIZUALNE (Hero, Statystyki, Terapie)
   ========================================================================== */

/* Hero Banner */
.srnis-hero {
    background: linear-gradient(135deg, #0f385a 0%, #1a5276 100%) !important;
    border-radius: 14px !important;
    padding: 40px 30px !important;
    color: #ffffff !important;
    margin-bottom: 30px !important;
    text-align: left !important;
    box-shadow: 0 4px 15px rgba(15, 56, 90, 0.15) !important;
}

.srnis-hero h1 {
    font-size: 2.1em !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin: 0 0 15px 0 !important;
    line-height: 1.25 !important;
}

.srnis-hero p {
    font-size: 1.15em !important;
    line-height: 1.6 !important;
    margin: 0 0 20px 0 !important;
    color: #e2e8f0 !important;
}

.srnis-hero-btn {
    display: inline-block !important;
    background-color: #e5692d !important;
    color: #ffffff !important;
    padding: 10px 22px !important;
    border-radius: 30px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease !important;
}

.srnis-hero-btn:hover {
    background-color: #d1561b !important;
    text-decoration: none !important;
    color: #ffffff !important;
}

/* Siatka Statystyk / Liczb */
.srnis-stats-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
    margin: 30px 0 !important;
    justify-content: space-between !important;
}

.srnis-stat-card {
    flex: 1 !important;
    min-width: 180px !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
    padding: 20px 15px !important;
    text-align: center !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    transition: transform 0.2s ease !important;
}

.srnis-stat-card:hover {
    transform: translateY(-3px) !important;
}

.srnis-stat-number {
    font-size: 2.8em !important;
    font-weight: 700 !important;
    color: #e5692d !important;
    margin-bottom: 5px !important;
    line-height: 1 !important;
}

.srnis-stat-label {
    font-size: 1.05em !important;
    font-weight: 600 !important;
    color: #0f385a !important;
    text-transform: uppercase !important;
}

.srnis-stat-desc {
    font-size: 0.88em !important;
    color: #718096 !important;
    margin-top: 5px !important;
    line-height: 1.4 !important;
}

/* Siatka Terapii / Usług */
.srnis-features-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
    gap: 15px !important;
    margin: 30px 0 !important;
}

.srnis-feature-card {
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
    padding: 20px !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    transition: all 0.2s ease !important;
    text-align: left !important;
}

.srnis-feature-card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(15, 56, 90, 0.08) !important;
    border-color: #0f385a !important;
}

.srnis-feature-title {
    font-size: 1.25em !important;
    font-weight: 700 !important;
    color: #0f385a !important;
    margin: 0 0 10px 0 !important;
    border-bottom: 2px solid #e5692d !important;
    padding-bottom: 6px !important;
    display: inline-block !important;
}

.srnis-feature-text {
    font-size: 0.95em !important;
    color: #4a5568 !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

/* CTA 1.5% podatku */
.srnis-cta-15 {
    background-color: #f7fafc !important;
    border: 2px dashed #e5692d !important;
    border-radius: 12px !important;
    padding: 25px !important;
    margin-top: 30px !important;
    text-align: center !important;
}

.srnis-cta-15 h3 {
    color: #0f385a !important;
    margin: 0 0 10px 0 !important;
    font-size: 1.4em !important;
}

.srnis-cta-15 b {
    color: #e5692d !important;
    font-size: 1.3em !important;
}

/* Responsywność mobilna */
@media (max-width: 800px) {
    .content-outer {
        flex-direction: column !important;
        padding: 15px !important;
    }
    #menu {
        width: 100% !important;
    }
    .pasektop {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    .srnis-hero {
        padding: 25px 20px !important;
    }
    .srnis-hero h1 {
        font-size: 1.7em !important;
    }
    .srnis-stats-grid {
        flex-direction: column !important;
    }
    .srnis-slider {
        height: 220px !important;
    }
    .srnis-slide {
        padding: 0 25px !important;
    }
    .srnis-slide-content h2 {
        font-size: 1.25em !important;
    }
    .srnis-slide-content p {
        display: none !important;
    }
}

/* ==========================================================================
   POZIOME MENU (menu-h) - RÓWNA SIATKA ZAKŁADEK ZAMIAST ROZJEŻDŻAJĄCYCH SIĘ PIGUŁEK
   ========================================================================== */
.menu-h-container {
    background-color: #ffffff !important;
    border-bottom: 2px solid rgba(15, 56, 90, 0.08) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
    width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 8px !important;
    margin-bottom: 15px !important;
    overflow: hidden !important;
}

.menu-h-container .mod-menu {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: 0 !important;
    padding: 0 !important;
}

.menu-h-container .mod-menu li {
    border-bottom: none !important;
    position: relative !important;
    display: flex !important;
    box-shadow: -1px 0 0 rgba(15, 56, 90, 0.07) !important;
}

.menu-h-container .mod-menu li a,
.menu-h-container .mod-menu li span.separator,
.menu-h-container .mod-menu li span.mod-menu__separator {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 14px 12px !important;
    min-height: 52px !important;
    box-sizing: border-box !important;
    font-size: 0.92em !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
    color: #2d3748 !important;
    border-left: none !important;
    border-bottom: 3px solid transparent !important;
    border-radius: 0 !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
}

.menu-h-container .mod-menu li a:hover,
.menu-h-container .mod-menu li:hover > span.separator,
.menu-h-container .mod-menu li:hover > span.mod-menu__separator {
    color: #e5692d !important;
    background-color: rgba(229, 105, 45, 0.06) !important;
    border-bottom-color: rgba(229, 105, 45, 0.4) !important;
}

.menu-h-container .mod-menu li.active > a,
.menu-h-container .mod-menu li.current > a,
.menu-h-container .mod-menu li.active > span.separator,
.menu-h-container .mod-menu li.current > span.separator {
    color: #0f385a !important;
    background-color: rgba(15, 56, 90, 0.06) !important;
    border-bottom-color: #0f385a !important;
    font-weight: 700 !important;
}

/* Submenu rozwijane (Dropdown) */
.menu-h-container .mod-menu ul.mod-menu__sub {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important; /* Wyśrodkowanie podmenu pod przyciskiem */
    background-color: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1) !important;
    border-radius: 8px !important;
    padding: 8px 0 !important;
    min-width: 220px !important;
    z-index: 1000 !important;
}

.menu-h-container .mod-menu li:hover > ul.mod-menu__sub {
    display: block !important;
}

.menu-h-container .mod-menu ul.mod-menu__sub li {
    width: 100% !important;
}

.menu-h-container .mod-menu ul.mod-menu__sub li a {
    padding: 10px 20px !important;
    font-size: 0.95em !important;
    border-bottom: none !important;
    border-left: 3px solid transparent !important;
    border-radius: 0 !important;
    text-align: left !important;
}

.menu-h-container .mod-menu ul.mod-menu__sub li a:hover {
    background-color: #f7fafc !important;
    border-left-color: #e5692d !important;
    color: #e5692d !important;
}

/* Dostosowanie mobilne dla menu poziomego */
@media (max-width: 800px) {
    .menu-h-container .mod-menu {
        grid-template-columns: 1fr !important;
    }
    .menu-h-container .mod-menu li {
        width: 100% !important;
        box-shadow: 0 -1px 0 rgba(15, 56, 90, 0.07) !important;
    }
    .menu-h-container .mod-menu li:first-child {
        box-shadow: none !important;
    }
    .menu-h-container .mod-menu li a {
        padding: 14px 20px !important;
        border-bottom: none !important;
        border-left: 3px solid transparent !important;
        justify-content: flex-start !important;
        text-align: left !important;
        border-radius: 0 !important;
    }
    .menu-h-container .mod-menu li a:hover,
    .menu-h-container .mod-menu li.active > a,
    .menu-h-container .mod-menu li.current > a {
        border-left-color: #0f385a !important;
        background-color: rgba(15, 56, 90, 0.05) !important;
    }
    .menu-h-container .mod-menu ul.mod-menu__sub {
        position: static !important;
        transform: none !important;
        box-shadow: none !important;
        border: none !important;
        padding-left: 20px !important;
        background-color: #fafbfc !important;
        display: block !important;
    }
}

/* ==========================================================================
   NOWY CZYSTY NAGŁÓWEK HTML I BRANDING Z MOTYLKIEM
   ========================================================================== */
.site-header-inner {
    width: 100% !important;
    background-color: #ffffff !important;
    border-radius: 12px !important;
    padding: 15px 20px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    box-sizing: border-box !important;
    margin-bottom: 15px !important;
}

.site-brand-container {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
}

.site-logo-link {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
    text-decoration: none !important;
}

.site-logo-link:hover {
    text-decoration: none !important;
}

.site-logo-img {
    width: 85px !important;
    height: 85px !important;
    background-color: #ffffff !important;
    background-image: url(../images/normal/layout_wersja2_A_01.jpg) !important;
    background-repeat: no-repeat !important;
    /* Oryginał ma 1000x229px, znaczek stowarzyszenia leży w lewym górnym rogu.
       Skalujemy 1:1 do wysokości kafla (85px), by pokazać cały znaczek bez ucięcia. */
    background-size: 371px auto !important;
    background-position: 0 0 !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 12px rgba(15, 56, 90, 0.15) !important;
    flex-shrink: 0 !important;
}

.site-logo-text {
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
}

.site-logo-title {
    font-size: 1.6em !important;
    font-weight: 800 !important;
    color: #0f385a !important;
    line-height: 1.15 !important;
    font-family: 'Outfit', sans-serif !important;
}

.site-logo-subtitle {
    font-size: 0.92em !important;
    color: #718096 !important;
    margin-top: 4px !important;
    font-weight: 500 !important;
    font-family: 'Outfit', sans-serif !important;
}

/* ==========================================================================
   WIDŻET SLAJDERA (SLAJDSHOW) NA STRONIE GŁÓWNEJ
   ========================================================================== */
.srnis-slider {
    position: relative !important;
    width: 100% !important;
    height: 240px !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    margin-bottom: 20px !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08) !important;
    box-sizing: border-box !important;
}

.srnis-slides {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
    transition: transform 0.7s cubic-bezier(0.65, 0, 0.35, 1) !important;
    will-change: transform !important;
}

.srnis-slide {
    position: relative !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 50px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.srnis-slide-bg {
    position: absolute !important;
    inset: 0 !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    z-index: -1 !important;
    transform: scale(1.06) !important;
    transition: transform 6s linear !important;
}

.srnis-slide.active .srnis-slide-bg {
    transform: scale(1.14) !important;
}

.srnis-slide-eyebrow {
    display: inline-block !important;
    background: rgba(255, 255, 255, 0.16) !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    color: #ffffff !important;
    font-size: 0.72em !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 4px 12px !important;
    border-radius: 30px !important;
    margin-bottom: 10px !important;
    backdrop-filter: blur(6px) !important;
    animation: fadeInUp 0.7s ease-out both !important;
}

.srnis-slide-content {
    max-width: 480px !important;
    color: #ffffff !important;
    text-align: left !important;
    animation: fadeInUp 0.8s ease-out both !important;
}

.srnis-slide-progress {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 4px !important;
    background: rgba(255, 255, 255, 0.18) !important;
    z-index: 5 !important;
}

.srnis-slide-progress span {
    display: block !important;
    height: 100% !important;
    width: 0% !important;
    background: linear-gradient(90deg, #e5692d, #f2a154) !important;
}

@keyframes srnisSlideProgressFill {
    from { width: 0%; }
    to   { width: 100%; }
}

.srnis-slide-content h2 {
    font-size: 1.65em !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.2 !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

.srnis-slide-content p {
    font-size: 0.95em !important;
    line-height: 1.4 !important;
    color: #f7fafc !important;
    margin: 0 0 14px 0 !important;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.4) !important;
}

.srnis-slider-btn {
    display: inline-block !important;
    background-color: #e5692d !important;
    color: #ffffff !important;
    padding: 9px 20px !important;
    border-radius: 30px !important;
    font-weight: 700 !important;
    font-size: 0.9em !important;
    text-decoration: none !important;
    box-shadow: 0 4px 15px rgba(229, 105, 45, 0.3) !important;
    transition: background-color 0.2s ease, transform 0.2s ease !important;
}

.srnis-slider-btn:hover {
    background-color: #d1561b !important;
    color: #ffffff !important;
    text-decoration: none !important;
    transform: translateY(-2px) !important;
}

.srnis-slider-dots {
    position: absolute !important;
    bottom: 20px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    display: flex !important;
    gap: 10px !important;
    z-index: 10 !important;
}

.srnis-dot {
    width: 12px !important;
    height: 12px !important;
    border-radius: 50% !important;
    background-color: rgba(255, 255, 255, 0.4) !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;
}

.srnis-dot.active {
    background-color: #ffffff !important;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ==========================================================================
   WIZUALNE WODOTRYSKI - DYNAMICZNE TŁO I SZKLANY EFEKT (GLASSMORPHISM)
   ========================================================================== */

/* Zwiększenie szerokości witryny na ekrany komputerów */
#center {
    width: 95% !important;
    max-width: 1250px !important;
}

.content-outer {
    width: 95% !important;
    max-width: 1250px !important;
    background-color: rgba(255, 255, 255, 0.85) !important; /* Szklane, półprzezroczyste tło */
    backdrop-filter: blur(12px) !important; /* Efekt rozmycia szkła (WCAG 2.1) */
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    box-shadow: 0 20px 50px rgba(15, 56, 90, 0.06) !important;
}

/* Pływające w tle, świecące bąble gradientowe (efekt nowoczesności/głębi) */
body {
    position: relative !important;
    overflow-x: hidden !important;
}

body::before, body::after {
    content: "" !important;
    position: fixed !important;
    width: 600px !important;
    height: 600px !important;
    border-radius: 50% !important;
    z-index: -10 !important;
    filter: blur(80px) !important;
    opacity: 0.75 !important;
    pointer-events: none !important;
    animation: floatBlobs 25s infinite alternate ease-in-out !important;
}

body::before {
    background: radial-gradient(circle, rgba(15, 56, 90, 0.8) 0%, rgba(15, 56, 90, 0) 70%) !important;
    top: -200px !important;
    left: -150px !important;
}

body::after {
    background: radial-gradient(circle, rgba(229, 105, 45, 0.65) 0%, rgba(229, 105, 45, 0) 70%) !important;
    bottom: -150px !important;
    right: -200px !important;
    animation-delay: -12s !important;
}

@keyframes floatBlobs {
    0% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(120px, 80px) scale(1.15);
    }
    100% {
        transform: translate(-60px, 120px) scale(0.9);
    }
}

/* 3D Interaktywny ruch motylka (Efekt głębi 3D po najechaniu myszką) */
.site-logo-img {
    transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.6s ease !important;
    perspective: 1000px !important;
    transform-style: preserve-3d !important;
}

.site-logo-link:hover .site-logo-img {
    transform: scale(1.12) rotateY(18deg) rotateX(12deg) translateY(-3px) !important;
    box-shadow: 0 12px 24px rgba(15, 56, 90, 0.22) !important;
}

/* ==========================================================================
   REWIZJA 2.0 - SZERSZY UKŁAD, NAGŁÓWEK Z POŚWIATĄ, KARTY AKTUALNOŚCI
   ========================================================================== */

/* Lepsze wykorzystanie szerokości ekranu na dużych monitorach */
#center, .content-outer {
    max-width: 1320px !important;
}

@media (min-width: 1400px) {
    #center, .content-outer {
        max-width: 1400px !important;
    }
}

@media (max-width: 1024px) {
    #menu {
        width: 100% !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
    }
    #menu > div {
        flex: 1 1 260px !important;
    }
    .content-outer {
        flex-direction: column !important;
    }
}

/* Nagłówek - subtelna poświata i akcent na dole */
.site-header-inner {
    position: relative !important;
    overflow: hidden !important;
}

.site-header-inner::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 3px !important;
    background: linear-gradient(90deg, #0f385a, #e5692d, #0f385a) !important;
    background-size: 200% 100% !important;
    animation: srnisHeaderSheen 6s linear infinite !important;
}

@keyframes srnisHeaderSheen {
    0%   { background-position: 0% 0%; }
    100% { background-position: 200% 0%; }
}

/* Pierścień/poświata wokół logo - efekt głębi 3D */
.site-logo-link {
    position: relative !important;
}

.site-logo-orbit {
    position: absolute !important;
    top: 50% !important;
    left: 42.5px !important;
    width: 100px !important;
    height: 100px !important;
    transform: translate(-50%, -50%) !important;
    border-radius: 50% !important;
    background: conic-gradient(from 0deg, #0f385a, #e5692d, #f2a154, #0f385a) !important;
    filter: blur(9px) !important;
    opacity: 0.35 !important;
    z-index: -1 !important;
    animation: srnisOrbitSpin 8s linear infinite !important;
    pointer-events: none !important;
}

@keyframes srnisOrbitSpin {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to   { transform: translate(-50%, -50%) rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .site-header-inner::after,
    .site-logo-orbit,
    body::before,
    body::after {
        animation: none !important;
    }
}

/* ==========================================================================
   KARTA WSPARCIA 1,5% (zastępuje stare plakietki/loga zewnętrzne w sidebarze)
   ========================================================================== */
.srnis-support-card {
    background: linear-gradient(160deg, #0f385a 0%, #16497a 100%) !important;
    color: #ffffff !important;
    border-radius: 14px !important;
    padding: 24px 20px !important;
    text-align: center !important;
    box-shadow: 0 10px 25px rgba(15, 56, 90, 0.18) !important;
    box-sizing: border-box !important;
}

.srnis-support-card__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.14) !important;
    color: #f2a154 !important;
    margin-bottom: 12px !important;
}

.srnis-support-card__icon svg {
    width: 24px !important;
    height: 24px !important;
}

.srnis-support-card h3 {
    font-size: 1.15em !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin: 0 0 8px 0 !important;
}

.srnis-support-card p {
    font-size: 0.9em !important;
    color: #dbe6f0 !important;
    line-height: 1.5 !important;
    margin: 0 0 16px 0 !important;
}

.srnis-support-card__krs {
    display: inline-block !important;
    background-color: #e5692d !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 0.9em !important;
    padding: 9px 18px !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, transform 0.2s ease !important;
}

.srnis-support-card__krs:hover {
    background-color: #d1561b !important;
    color: #ffffff !important;
    text-decoration: none !important;
    transform: translateY(-2px) !important;
}

/* ==========================================================================
   PRZYCISK "DO GÓRY" (zastępuje stare grafiki dogorynormal/dogorynigh)
   ========================================================================== */
.srnis-backtotop {
    position: fixed !important;
    bottom: 25px !important;
    left: 25px !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
    background-color: #ffffff !important;
    color: #0f385a !important;
    border: 1px solid rgba(15, 56, 90, 0.15) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.12) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 900 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(12px) !important;
    transition: all 0.25s ease !important;
}

.srnis-backtotop.is-visible {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

.srnis-backtotop:hover {
    background-color: #0f385a !important;
    color: #ffffff !important;
    transform: translateY(-3px) !important;
}

.srnis-backtotop svg {
    width: 20px !important;
    height: 20px !important;
}

/* ==========================================================================
   ANIMACJE POJAWIANIA SIĘ PRZY PRZEWIJANIU (WODOTRYSKI)
   ========================================================================== */
.srnis-reveal {
    opacity: 0 !important;
    transform: translateY(24px) !important;
    transition: opacity 0.6s ease, transform 0.6s ease !important;
}

.srnis-reveal.is-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

@media (prefers-reduced-motion: reduce) {
    .srnis-reveal {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* ==========================================================================
   AKTUALNOŚCI (com_content - widok kategorii typu blog) - WYMUSZONY,
   SPÓJNY STYL KART NIEZALEŻNIE OD SZABLONU JOOMLA
   ========================================================================== */
.com-content-category-blog {
    background: transparent !important;
}

.com-content-category-blog > h1,
.com-content-category-blog > h2 {
    font-size: 1.9em !important;
    font-weight: 800 !important;
    color: #0f385a !important;
    margin: 0 0 10px 0 !important;
    font-family: 'Outfit', sans-serif !important;
}

.com-content-category-blog .category-desc {
    background: linear-gradient(135deg, #0f385a 0%, #1a5276 100%) !important;
    color: #f7fafc !important;
    border-radius: 14px !important;
    padding: 22px 26px !important;
    margin-bottom: 26px !important;
    box-shadow: 0 4px 15px rgba(15, 56, 90, 0.15) !important;
}

.com-content-category-blog .category-desc,
.com-content-category-blog .category-desc p {
    color: #f7fafc !important;
}

.com-content-category-blog__items.blog-items {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)) !important;
    gap: 24px !important;
    margin: 20px 0 !important;
    list-style: none !important;
    padding: 0 !important;
}

.com-content-category-blog__items.items-leading {
    grid-template-columns: 1fr !important;
    margin-bottom: 8px !important;
}

.com-content-category-blog__item {
    background: #ffffff !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 14px rgba(15, 56, 90, 0.06) !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease !important;
    box-sizing: border-box !important;
}

.com-content-category-blog__item:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 28px rgba(15, 56, 90, 0.12) !important;
}

.com-content-category-blog__item .item-image {
    margin: 0 !important;
    display: block !important;
}

.com-content-category-blog__item .item-image img {
    display: block !important;
    width: 100% !important;
    aspect-ratio: 16 / 10 !important;
    object-fit: cover !important;
}

.com-content-category-blog__item .item-content {
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
}

.com-content-category-blog__item .page-header {
    border: none !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
}

.com-content-category-blog__item .page-header h2 {
    font-size: 1.2em !important;
    font-weight: 700 !important;
    color: #0f385a !important;
    line-height: 1.35 !important;
    margin: 0 !important;
}

.com-content-category-blog__item .page-header h2 a {
    color: #0f385a !important;
    text-decoration: none !important;
}

.com-content-category-blog__item .page-header h2 a:hover {
    color: #e5692d !important;
}

.com-content-category-blog__item .article-info {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px 12px !important;
    font-size: 0.78em !important;
    color: #718096 !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
}

.com-content-category-blog__item .article-info dt {
    display: none !important;
}

.com-content-category-blog__item .article-info dd {
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.com-content-category-blog__item p {
    color: #4a5568 !important;
    font-size: 0.95em !important;
    line-height: 1.55 !important;
}

.com-content-category-blog__item .readmore {
    margin-top: auto !important;
    padding-top: 10px !important;
}

.com-content-category-blog__item .readmore a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background-color: #e5692d !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 0.85em !important;
    padding: 8px 18px !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    border: none !important;
    transition: background-color 0.2s ease, transform 0.2s ease !important;
}

.com-content-category-blog__item .readmore a:hover {
    background-color: #d1561b !important;
    color: #ffffff !important;
    text-decoration: none !important;
    transform: translateY(-2px) !important;
}

.com-content-category-blog .items-more {
    margin-top: 20px !important;
    padding-top: 16px !important;
    border-top: 1px solid rgba(15, 56, 90, 0.08) !important;
}

.com-content-category-blog .items-more ol {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.com-content-category-blog .items-more a {
    color: #0f385a !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.com-content-category-blog .items-more a:hover {
    color: #e5692d !important;
    text-decoration: underline !important;
}

.com-content-category-blog__navigation {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    margin-top: 20px !important;
    padding-top: 16px !important;
    border-top: 1px solid rgba(15, 56, 90, 0.08) !important;
}

.com-content-category-blog__pagination ul.pagination {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.com-content-category-blog__pagination .pagination li {
    display: inline-flex !important;
}

.com-content-category-blog__pagination .pagination a,
.com-content-category-blog__pagination .pagination span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 34px !important;
    height: 34px !important;
    padding: 0 8px !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    border: 1px solid rgba(15, 56, 90, 0.12) !important;
    color: #0f385a !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 0.9em !important;
}

.com-content-category-blog__pagination .pagination a:hover {
    background: #0f385a !important;
    color: #ffffff !important;
}

.com-content-category-blog__children {
    margin-top: 30px !important;
    padding-top: 20px !important;
    border-top: 1px solid rgba(15, 56, 90, 0.08) !important;
}

/* ==========================================================================
   POJEDYNCZY ARTYKUŁ (com_content - item-page) - DOPRACOWANIE TYPOGRAFII
   ========================================================================== */
.item-page .page-header {
    border: none !important;
    margin: 0 0 16px 0 !important;
    padding: 0 0 14px 0 !important;
    border-bottom: 2px solid rgba(15, 56, 90, 0.08) !important;
}

.item-page .page-header h2 {
    font-size: 1.7em !important;
    font-weight: 800 !important;
    color: #0f385a !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}

.item-page .item-image {
    margin: 0 0 20px 0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 20px rgba(15, 56, 90, 0.1) !important;
}

.item-page .item-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
}

.articlebody {
    line-height: 1.7 !important;
    color: #2d3748 !important;
}

.articlebody h2, .articlebody h3, .articlebody h4 {
    color: #0f385a !important;
    font-weight: 700 !important;
    margin-top: 1.4em !important;
}

.articlebody img {
    border-radius: 10px !important;
}

/* Responsywność kart Aktualności na mniejszych ekranach */
@media (max-width: 640px) {
    .com-content-category-blog__items.blog-items {
        grid-template-columns: 1fr !important;
    }
    .srnis-backtotop {
        left: 16px !important;
        bottom: 16px !important;
    }
}

/* ==========================================================================
   UKRYCIE STRONY GŁÓWNEJ I OBSŁUGA ROZWIJANIA PODMENU W BOK (FLY-OUT LEVEL 3)
   ========================================================================== */

/* Ukrywamy link 'Strona główna' w menu, bo kliknięcie w logo motylka pełni tę samą rolę */
.menu-h-container .mod-menu li.item-101 {
    display: none !important;
}

/* Obsługa trzeciego poziomu menu (np. Działania -> Szkolenia -> Stymulacja Bazalna) */
.menu-h-container .mod-menu ul.mod-menu__sub ul.mod-menu__sub {
    display: none !important;
    position: absolute !important;
    top: 0 !important;
    left: 100% !important; /* Rozwijanie podmenu w prawo */
    margin-left: 2px !important;
    margin-top: -8px !important;
    background-color: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1) !important;
    border-radius: 8px !important;
    padding: 8px 0 !important;
    min-width: 220px !important;
    z-index: 1100 !important;
}

/* Aktywacja rozwijania 3 stopnia */
.menu-h-container .mod-menu ul.mod-menu__sub li:hover > ul.mod-menu__sub {
    display: block !important;
}

/* Usunięcie zaokrągleń wewnątrz menu rozwijanego */
.menu-h-container .mod-menu ul.mod-menu__sub ul.mod-menu__sub li a {
    border-radius: 0 !important;
}

/* ==========================================================================
   NOWA ESTETYKA GÓRY: FLEX NAGŁÓWEK, BANER KRS I USUNIĘCIE ŻÓŁCI (WCAG 2.1)
   ========================================================================== */

/* Zmiana kontenera nagłówka na układ Flexbox (Logo po lewej, KRS po prawej) */
.site-header-inner {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
}

/* Stylizacja pigułki KRS w nagłówku */
.header-krs-badge {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    background-color: #0f385a !important; /* markowy ciemnoniebieski */
    color: #ffffff !important;
    padding: 8px 16px !important;
    border-radius: 30px !important;
    box-shadow: 0 4px 12px rgba(15, 56, 90, 0.12) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.krs-badge-icon {
    font-size: 1.3em !important;
    color: #e5692d !important; /* pomarańczowe serduszko */
    animation: krsHeartbeat 1.4s infinite alternate ease-in-out !important;
}

.krs-badge-content {
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
}

.krs-badge-title {
    font-size: 0.82em !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    color: #ffffff !important;
}

.krs-badge-krs {
    font-size: 0.9em !important;
    color: #e2e8f0 !important;
}

.krs-badge-krs b {
    color: #e5692d !important; /* Wyróżnienie numeru KRS na pomarańczowo */
}

@keyframes krsHeartbeat {
    from { transform: scale(1); }
    to { transform: scale(1.18); }
}

/* Likwidacja żółtych/kremowych elementów z paska WCAG (pasektop) */
.pasektop {
    background-color: transparent !important; /* Usunięcie żółtego tła */
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    box-shadow: none !important;
    padding: 10px 15px !important;
    border-radius: 8px !important;
    color: #4a5568 !important;
    margin-bottom: 15px !important;
}

.pasektop a, .breadcrumb-item a {
    color: #0f385a !important; /* Granat zamiast żółci/brązu */
    text-decoration: none !important;
}

.pasektop a:hover, .breadcrumb-item a:hover {
    color: #e5692d !important;
}

/* Unowocześnienie przycisków WCAG (Wersja kontrastowa) */
a.niedowidzacy-btn, a.normalny-btn {
    background-color: #0f385a !important; /* Granatowy przycisk */
    color: #ffffff !important;
    border-radius: 20px !important;
    padding: 6px 16px !important;
    font-weight: 700 !important;
    font-size: 0.85em !important;
    text-decoration: none !important;
    box-shadow: 0 2px 6px rgba(15, 56, 90, 0.15) !important;
    transition: all 0.2s ease !important;
    border: 1px solid transparent !important;
}

a.niedowidzacy-btn:hover, a.normalny-btn:hover {
    background-color: #e5692d !important; /* Pomarańczowy na hover */
    color: #ffffff !important;
    box-shadow: 0 4px 10px rgba(229, 105, 45, 0.25) !important;
}

/* Likwidacja kremowych i żółtych teł witryny */
body {
    background-color: #f1f5f9 !important; /* Nowoczesne, chłodne szare tło */
}

#center {
    background: transparent !important; /* Usunięcie starego kremowego obrazka tła (body.jpg) */
}

#content {
    background: transparent !important; /* Usunięcie kremowego koloru kontenera treści */
}

/* ==========================================================================
   INTERAKTYWNE KAFELKI I DYNAMICZNE UKŁADY KART (KAFELKI/GRID)
   ========================================================================== */

/* Automatyczna konwersja tradycyjnych list (ul) w artykułach na nowoczesną siatkę kafelków */
#content #part4 ul:not(.mod-menu) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)) !important;
    gap: 20px !important;
    padding: 15px 0 !important;
    list-style-type: none !important;
    margin: 15px 0 !important;
}

#content #part4 ul:not(.mod-menu) li {
    background: #ffffff !important;
    border-radius: 12px !important;
    padding: 22px !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
    position: relative !important;
    overflow: hidden !important;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.35s ease !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

/* Kolorowy pasek gradientowy po lewej stronie każdego kafelka */
#content #part4 ul:not(.mod-menu) li::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 4px !important;
    height: 100% !important;
    background: linear-gradient(to bottom, #0f385a, #e5692d) !important;
    transition: width 0.3s ease !important;
}

/* Efekt najechania (uniesienie i powiększenie paska gradientu) */
#content #part4 ul:not(.mod-menu) li:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 12px 28px rgba(15, 56, 90, 0.1) !important;
    border-color: rgba(229, 105, 45, 0.25) !important;
}

#content #part4 ul:not(.mod-menu) li:hover::before {
    width: 6px !important;
}

/* Wygładzenie animacji pojawiania się elementów podczas przewijania strony */
.srnis-reveal {
    opacity: 0 !important;
    transform: translateY(35px) !important;
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) !important;
    will-change: transform, opacity !important;
}

.srnis-reveal.is-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* Siatka kafelków dla aktualności (Joomla Category Blog View) */
.com-content-category-blog__items, 
.blog-items {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
    gap: 25px !important;
    padding: 15px 0 !important;
}

.blog-item,
.com-content-category-blog__item {
    background: #ffffff !important;
    border-radius: 14px !important;
    padding: 26px !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
    position: relative !important;
    overflow: hidden !important;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.35s ease !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
    box-sizing: border-box !important;
}

/* Górny gradientowy pasek na kafelkach aktualności */
.blog-item::before,
.com-content-category-blog__item::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #0f385a, #e5692d) !important;
    border-top-left-radius: 14px !important;
    border-top-right-radius: 14px !important;
    opacity: 0.95 !important;
}

.blog-item:hover,
.com-content-category-blog__item:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 16px 35px rgba(15, 56, 90, 0.12) !important;
    border-color: rgba(229, 105, 45, 0.25) !important;
}

html {
    scroll-behavior: smooth !important;
}

/* ==========================================================================
   KOLOROWA REWOLUCJA KAFELKÓW (ZAMIANA STERYLNEJ BIELI NA ENERGETYCZNE GRADIENTY)
   ========================================================================== */

/* Kafelki Statystyk (w liczbach) - nadanie im głębokich, wyrazistych gradientów */
.srnis-stat-card {
    border-radius: 14px !important;
    padding: 25px !important;
    text-align: center !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 10px 25px rgba(15, 56, 90, 0.08) !important;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease !important;
}

.srnis-stat-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 16px 35px rgba(15, 56, 90, 0.15) !important;
}

/* Kafel 1: Granatowy gradient */
.srnis-stat-card:nth-child(1) {
    background: linear-gradient(135deg, #0f385a 0%, #1e4e79 100%) !important;
}

/* Kafel 2: Pomarańczowy gradient */
.srnis-stat-card:nth-child(2) {
    background: linear-gradient(135deg, #e5692d 0%, #f97316 100%) !important;
}

/* Kafel 3: Błękitny gradient */
.srnis-stat-card:nth-child(3) {
    background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%) !important;
}

.srnis-stat-card h3 {
    font-size: 2.4em !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    margin: 0 0 5px 0 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) !important;
}

.srnis-stat-card h4 {
    font-size: 1.05em !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin: 0 0 10px 0 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
}

.srnis-stat-card p {
    font-size: 0.95em !important;
    color: rgba(255, 255, 255, 0.9) !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

/* Kafelki Obszarów Wspomagania i Terapii (Feature cards) */
.srnis-feature-card {
    background: #ffffff !important;
    border-radius: 14px !important;
    padding: 26px !important;
    border: 1px solid rgba(15, 56, 90, 0.08) !important;
    box-shadow: 0 8px 20px rgba(15, 56, 90, 0.03) !important;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.35s ease !important;
}

.srnis-feature-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 15px 32px rgba(15, 56, 90, 0.08) !important;
    border-color: rgba(229, 105, 45, 0.25) !important;
}

.srnis-feature-card h3 {
    font-size: 1.3em !important;
    font-weight: 700 !important;
    color: #0f385a !important;
    margin: 0 0 12px 0 !important;
    border-bottom: 2px solid rgba(229, 105, 45, 0.15) !important;
    padding-bottom: 8px !important;
    transition: border-color 0.3s ease !important;
}

.srnis-feature-card:hover h3 {
    border-bottom-color: #e5692d !important; /* Pomarańczowa linia pod nagłówkiem przy hoverze */
}

/* Przebudowa ramkowanego boksu 1.5% w pełnoekranowy dynamiczny baner */
.srnis-cta-15 {
    background: linear-gradient(135deg, #0f385a 0%, #1e4e79 100%) !important;
    border: none !important;
    border-radius: 14px !important;
    padding: 35px 30px !important;
    color: #ffffff !important;
    box-shadow: 0 12px 35px rgba(15, 56, 90, 0.14) !important;
    text-align: center !important;
    margin-top: 40px !important;
    box-sizing: border-box !important;
}

.srnis-cta-15 h3 {
    color: #ffffff !important;
    font-size: 1.6em !important;
    font-weight: 800 !important;
    margin: 0 0 15px 0 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.srnis-cta-15 p {
    color: #e2e8f0 !important;
    font-size: 1.1em !important;
    margin: 0 0 15px 0 !important;
}

.srnis-cta-15 p b {
    color: #e5692d !important;
}

/* ==========================================================================
   STYLIZACJA ROZJECHANEJ NAWIGACJI STRON JOOMLA (POPRZEDNIA / NASTĘPNA)
   ========================================================================== */
#content #part4 .pagenav, 
#content #part4 .pager,
#content #part4 .pagination,
#content #part4 .item-navigation {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    list-style-type: none !important;
    padding: 20px 0 0 0 !important;
    margin: 30px 0 0 0 !important;
    border-top: 1px solid rgba(15, 56, 90, 0.08) !important;
    gap: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#content #part4 .pagenav li,
#content #part4 .pager li {
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block !important;
}

/* Wygląd przycisków nawigacji */
#content #part4 .pagenav-prev a,
#content #part4 .pagenav-next a,
#content #part4 .pagenav a,
#content #part4 .pager a {
    display: inline-flex !important;
    align-items: center !important;
    background-color: #0f385a !important;
    color: #ffffff !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 0.9em !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(15, 56, 90, 0.15) !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

#content #part4 .pagenav-prev a:hover,
#content #part4 .pagenav-next a:hover,
#content #part4 .pagenav a:hover,
#content #part4 .pager a:hover {
    background-color: #e5692d !important;
    box-shadow: 0 8px 20px rgba(229, 105, 45, 0.3) !important;
    transform: translateY(-2px) !important;
}

/* Strzałki w przyciskach */
#content #part4 .pagenav-prev a::before {
    content: "←  " !important;
}

#content #part4 .pagenav-next a::after {
    content: "  →" !important;
}

/* ==========================================================================
   POPRAWKA ROZJECHANEJ NAWIGACJI STRON JOOMLA (PAGENAVIGATION)
   ========================================================================== */

/* Klasa ukrywająca tekst pomocniczy dla czytników ekranu (WCAG) */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.pagenavigation {
    display: block !important;
    width: 100% !important;
    margin-top: 35px !important;
    padding-top: 22px !important;
    border-top: 1px solid rgba(15, 56, 90, 0.08) !important;
    box-sizing: border-box !important;
}

.pagenavigation .pagination {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    gap: 15px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Wygląd przycisków Poprzednia / Następna */
.pagenavigation .pagination a.previous,
.pagenavigation .pagination a.next {
    display: inline-flex !important;
    align-items: center !important;
    background-color: #0f385a !important;
    color: #ffffff !important;
    padding: 12px 24px !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 0.92em !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(15, 56, 90, 0.15) !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
}

.pagenavigation .pagination a.previous:hover,
.pagenavigation .pagination a.next:hover {
    background-color: #e5692d !important;
    box-shadow: 0 8px 20px rgba(229, 105, 45, 0.3) !important;
    transform: translateY(-2px) !important;
}

.pagenavigation .pagination a.previous::before {
    content: "←  " !important;
}

.pagenavigation .pagination a.next::after {
    content: "  →" !important;
}

/* ==========================================================================
   JESZCZE MOCNIEJSZE GRADIENTY NA POZIOMIE KAFELKÓW (MAKSYMALNE NASYCENIE)
   ========================================================================== */

/* Kafel 1: Ultramocny granatowo-błękitny gradient */
.srnis-stat-card:nth-child(1) {
    background: linear-gradient(135deg, #071b2b 0%, #0f385a 50%, #1d72b8 100%) !important;
    border: 1px solid rgba(29, 114, 184, 0.2) !important;
}

/* Kafel 2: Ognisty, neonowy pomarańczowo-czerwony gradient */
.srnis-stat-card:nth-child(2) {
    background: linear-gradient(135deg, #e5692d 0%, #f97316 60%, #e11d48 100%) !important;
    border: 1px solid rgba(249, 115, 22, 0.2) !important;
}

/* Kafel 3: Głęboki indygo-fioletowy gradient */
.srnis-stat-card:nth-child(3) {
    background: linear-gradient(135deg, #1e3b8b 0%, #4f46e5 50%, #7c3aed 100%) !important;
    border: 1px solid rgba(124, 58, 237, 0.2) !important;
}

/* Wzmocnienie dolnego baneru KRS */
.srnis-cta-15 {
    background: linear-gradient(135deg, #071b2b 0%, #0f385a 50%, #1e4e79 100%) !important;
    border-left: 5px solid #e5692d !important; /* Gruby pomarańczowy akcent z boku */
}