/*
Theme Name: Trustudio Boilerplate
Description: Wordpress theme made by trustudio.pl
Text Domain: trustudio
Version: 1.2
Author: fry.li
Author URI: http://trustudio.pl
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
*/



@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,opsz,wght@0,18..144,300..900;1,18..144,300..900&display=swap');



html { font-size: 62.5%; /* to to samo co ustalenie fot-size:10px; */}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
body { line-height: 1.5; -webkit-font-smoothing: antialiased;}
img, picture, video, canvas, svg { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; }
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word;}
p { text-wrap: pretty; }
h1, h2, h3, h4, h5, h6 { text-wrap: balance; }
#root, #__next { isolation: isolate; }


/*  CONTAINERY I GRID */

.wrap {
  --padding-inline: 2rem;
  --content-max-width: 930px;
  --alignwide-max-width: 1390px;
  --alignwide-size: calc( (var(--alignwide-max-width) - var(--content-max-width)) / 2 );

  display: grid;
  grid-template-columns:
    [alignfull-start] minmax(var(--padding-inline), 1fr)
    [alignwide-start] minmax(0, var(--alignwide-size))
    [content-start] min(100% - (var(--padding-inline) * 2), var(--content-max-width))
    [content-end]
    minmax(0, var(--alignwide-size)) [alignwide-end]
    minmax(var(--padding-inline), 1fr) [alignfull-end];
}




.wrap > :not(.alignwide, .alignfull), /* .alignfull > :not(.alignwide, .alignfull),*/ .alignwide > :not(.alignwide, .alignfull) { grid-column: content; gap:51px; }
.wrap > .alignwide { grid-column: alignwide; display: grid; grid-template-columns: inherit;}
.wrap > .alignfull { grid-column: alignfull; display: grid; grid-template-columns: inherit; }

.wrap > .alignwide > .wp-block-group__inner-container { grid-column: alignwide;}


.wrap > .alignfull > .wp-block-group__inner-container { grid-column: alignfull;}
.wrap > .wp-block-image.alignfull > img {  grid-column: alignfull; }


/* poprawki gridu */
.wrap > .alignfull > .wp-block-cover__background { grid-column: alignfull;}
.wrap > .alignwide > .wp-block-cover__background { grid-column: alignwide;}

.wrap > .alignfull > .wp-block-cover__image-background { grid-column: alignfull;}
.wrap > .alignwide > .wp-block-cover__image-background { grid-column: alignwide;}

.wrap > .wp-block-cover { padding: 0;}



.container-normal { width:min(100% - 3rem, 1320px); margin-inline:auto; }
.container-wide { width:min(100% - 3rem, 1540px); margin-inline:auto; }



@media (max-width: 780px) {
	.wrap > .wp-block-group.alignwide > .wp-block-group__inner-container { grid-column: alignfull;}
}





/* dodatkowe utilities */
.wp-block-column.aright { text-align: right; }
.aright { text-align: right; }

.bigmargin { padding: 0px 200px;}
.pa20 { padding: 20px;}



body { font-family: "Merriweather", serif; font-optical-sizing: auto; -webkit-font-smoothing: antialiased; font-size: 1.3rem; line-height: 2.1rem; color: #000; font-style: italic; transition: all 0.25s ease-out; }
img { max-width: 100%; height:auto; }
a, a:hover, a:focus, button, input{ color: inherit; text-decoration: none; -webkit-transition: all 0.25s ease-out; -moz-transition: all 0.25s ease-out; -ms-transition: all 0.25s ease-out; -o-transition: all 0.25s ease-out; transition: all 0.25s ease-out; }
a { color:inherit;  }
a * {-webkit-transition: all 0.25s ease-out; -moz-transition: all 0.25s ease-out; -ms-transition: all 0.25s ease-out; -o-transition: all 0.25s ease-out; transition: all 0.25s ease-out;}
a:hover { opacity:0.7;  }
a.blocked { display: block;}
.clr, .clear { clear:both;}
button { border:none; background: none;}
blockquote p { font-family: "Work Sans", sans-serif; font-size: 3rem; line-height:4.2rem; color:#0000fe;  background: none; max-width: 400px;;}





section.fullContent p a { text-decoration: underline; }

a.mybtn { background: #000; color: #fff; padding: 10px 30px; display: inline-block; text-decoration: none; border-radius:0; }
a.mybtn:after { font-family: 'Font Awesome 5 Pro'; content: '\f105'; margin:0 5px 0 20px; font-size:1.8rem; transition: margin 0.25s ease-out;}
a.mybtn:hover {   padding: 10px 30px; }
a.mybtn:hover:after { margin:0 5px 0 40px;}


button.mybtn { background: #000; color: #fff; padding: 10px 30px; display: inline-block; text-decoration: none; border-radius:0;}

.uppercase { text-transform: uppercase; }
.through { text-decoration: line-through; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.aligncenter { text-align: center;}
.normalcase { text-transform: none !important; }
.lowercase { text-transform: lowercase;}

h1, h2, h3, h4, h5, h6 {  font-family: "Work Sans", sans-serif; font-weight: normal; margin: 0 0 18px 0px;  -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;   }
p { font-size: 1.4rem;  line-height: 2.2rem; margin-bottom: 12px;  text-align: left;  }
p.normal {font-style:normal;}
p.intro { font-size: 1.6rem;  line-height: 2.9rem; text-align: justify; font-style:normal; margin: 0px 70px;}

@media (max-width: 780px) {
	p.intro {  margin: 0px 0px;}
}

.fullContent ul li, .fullContent ol li { font-size: 1.6rem;  line-height: 2.6rem; margin-bottom: 12px;  text-align: left;}
h1 {  font-size:4.2rem; line-height: 5.0rem; }
h2 {  font-size:3.4rem; line-height: 4.0rem; }
h3 {  font-size:2.8rem; line-height: 3.4rem; }
h4 {  font-size:2.4rem; line-height: 3.0rem; }
h5 {  font-size:2.1rem; line-height: 2.8rem; }
h6 {  font-size:1.8rem; line-height: 2.4rem; }

p em { font-family: "Work Sans", sans-serif; font-size: 1.3rem; list-style: 1.7rem; font-style: normal; letter-spacing: 0.2rem;}
p.normal { font-style: normal; }
p.waskie { margin: 0px 110px; font-family: "Work Sans", sans-serif; font-style: normal;}
p.caption { font-family: "Work Sans", sans-serif; font-size: 1.3rem; list-style: 1.7rem; font-style: normal; padding-top: 10px;}


@media (max-width: 990px) {
	p.waskie { margin: 0px 50px;}
}


.fullContent { margin-bottom: 100px;}

hr.wp-block-separator { border: 0; height: 1px; width: 20%; position: relative; margin: 30px auto; opacity:1; background: #000; }
hr.wp-block-separator:before { content: ""; width: 16px; height: 16px; background: #000; display: inline-block; border: 5px solid #000; border-radius: 50%; position: absolute; top: -4px; left: 50%; margin: 0 0 0 -3px; }

.wp-block-spacer { height: 100px !important;}
.wp-block-spacer.bigger { height: 100px !important;}

@media (max-width: 990px) {
	.wp-block-spacer { height: 60px !important;}
  .wp-block-spacer.bigger { height: 60px !important;}
  .wp-block-spacer.height30 { height: 30px !important;}
}

/*  ROZPOCZYNAMY */
/*
:where(.wp-block-columns.is-layout-flex) { gap: 10em; }*/


header#mainHeader { padding: 0px 0px; margin-bottom: 0px; height: 230px; }
header#mainHeader .inside { display: flex; justify-content: space-between; align-items: flex-start;}
header#mainHeader .menubtn { padding: 0px;}
header#mainHeader .menubtn button { position: absolute; top:30px; left:30px; z-index: 1020;;}


header#mainHeader a.logo-link { position: absolute; top: 120px; left: 0; width: 100%; display: flex; justify-content: center; z-index: 11;}
header#mainHeader .logo-link img { width: 300px;; }


@media (max-width: 1610px) {
	header#mainHeader .menubtn button { top:30px; left:30px;}
}






.menu-toggle { width: 30px; height: 22px; background: none; border: 0; cursor: pointer;}
.menu-toggle span { position: absolute; left: 0; width: 100%; height: 2px; background: #000; transition: transform 0.3s ease, top 0.3s ease; }
.menu-toggle span:nth-child(1) { top: 0; }
.menu-toggle span:nth-child(2) { top: 8px; }
.menu-toggle span:nth-child(3) { top: 16px; }

body.menu-open { background-color: #f9f6f7;}

.menu-open .menu-toggle span:nth-child(1) { top: 8px; transform: rotate(45deg); }
.menu-open .menu-toggle span:nth-child(2) { opacity: 0; }
.menu-open .menu-toggle span:nth-child(3) { top: 8px; transform: rotate(-45deg); }


#hugemenu { position: fixed; inset: 0; top:0px; left:0px; width: 500px; background: #fff; z-index: 1000;; transition: transform 0.4s ease; transform: translateX(-100%);}
#hugemenu .bigmenuinside { height:100%;  padding: 0px;}
#hugemenu .bigmenuinside ul { list-style: none; padding-left: 0px;}
#hugemenu .bigmenuinside ul li { font-family: "Work Sans", Helvetica, sans-serif; font-size: 1.0rem; line-height: 1.8rem; margin-bottom: 0px; letter-spacing: 0.2rem; text-transform: uppercase; font-style: normal; }
#hugemenu .bigmenuinside ul li.current-menu-item li.current-menu-item { font-weight: bold;  color: #000;}
#hugemenu .bigmenuinside ul li.current-menu-parent li.current-menu-item { font-weight: bold; color: #000;}

#hugemenu .bigmenuinside > .menu-content > ul {  display: flex; flex-direction: column ; gap:20px; color: #444; padding-top: 100px;;}
#hugemenu .bigmenuinside > .menu-content > ul > li { font-size:1.5rem; line-height: 2.4rem; text-transform: none; margin-bottom: 0px; }

#hugemenu .bigmenuinside > .menu-content { flex: 1; height: 100%; overflow-y: auto;  -webkit-overflow-scrolling: touch;  padding: 0px 80px 0px 120px; display: flex; align-items: top;}


@media (max-width: 600px) {
	#hugemenu { width: 100%;}
}


.menu-open #hugemenu { transform: translateX(0); }
.menu-open header#mainHeader .menubtn button { position: fixed;}

#langmenu { display: none; width: 100%; background: #fff;;  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.2); position: fixed; top:0px; left: 50%; transform: translateX(-50%); z-index: 99;  gap:0px; justify-content: center; z-index: 2000;}
#langmenu button { padding: 10px 20px; cursor: pointer; }
#langmenu button:hover { background: #eee;;}
#langmenu button img { width: 18px; height: auto;}
#langmenu button.active { background: #ddd;;}





body.menushowed #hugemenu { height: 100dvh; }

.langs .lang-switcher { list-style: none;  display: flex; gap:10px;}
.langs .lang-switcher li a { padding: 5px 10px;}
.langs .lang-switcher li a.active { background: #000; color: #fff; }


a.wp-block-button__link { background: #000; color: #fff; padding: 10px 30px; display: inline-block; text-decoration: none; border-radius:0; }
a.wp-block-button__link:hover {   padding: 10px 30px; }

.wp-block-buttons.orange a.wp-block-button__link { background: #000;}




.wp-block-button.bigbtn { line-height: 4.0rem;}
p.has-text-align-left { text-align: justify;}


.wp-block-column.borderleft { border-left:1px solid #ccc; padding:30px 0px 30px 30px; margin-bottom: 20px;}
.wp-block-column.borderright { border-right:1px solid #ccc; padding:30px 30px 30px 0px; margin-bottom: 20px;}

.wp-block-image.is-style-rounded { text-align: center;}
.wp-block-image.is-style-rounded img { width: 300px; height: auto;}




/* HOME I PODSTRONY */

.fullContent { margin-bottom: 20px; }
#allBody { margin-bottom: 100px; }


.title { letter-spacing: 2px; font-family: "Work Sans", Helvetica, sans-serif; font-style: normal; }

.wp-block-columns { gap:51px; }


.audio-player { display: inline-block; margin: 10px 0px;}
.audio-player .audio-btn {--size: 48px; width: var(--size); height: var(--size); border-radius: 50%; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center;  padding: 0;}
.audio-player .audio-btn svg { width: 60%; height: 60%;}
.audio-player .icon-pause { display: none;}
.audio-player .audio-btn.playing .icon-speaker {display: none;}
.audio-player .audio-btn.playing .icon-pause { display: block;}
.audio-player .audio-title { font-style: normal; color: #0000FF; padding-left: 30px; display: block;}


.radio-player { display: block; padding: 50px; border:1px solid #0000fe; text-align: center; margin: 0px 130px;}
.radio-player .audio-btn { cursor: pointer;}
.radio-player .audio-title, .radio-player .audio-length { text-transform: uppercase; color:#0000fe; font-family: "Work Sans", Helvetica, sans-serif; font-style: normal;}
.radio-player .radio-audio { display: none; width: 100%; accent-color: #0000fe; }
.radio-player.is-playing .audio-btn { display: none; }
.radio-player.is-playing .radio-audio { display: block; }

@media (max-width: 990px) {
	/* .radio-player { margin: 0px 50px;} */
  .radio-player { margin: 0px 0px; padding: 10px 10px;}
  .wp-block-column:empty { display: none;;}
  .wp-block-column p:last-child { margin-bottom: 0; }
}



body .moveup { margin-top: -230px;}
body .is-layout-flex.flogos { gap:30px; justify-content: space-between;}
body .is-layout-flex.flogos img { max-width: 180px; max-height: 60px; width: auto; height: auto; object-fit: contain; }

@media (max-width: 1300px) {
	body .is-layout-flex.flogos { gap:60px; justify-content:center;}
	body .is-layout-flex.flogos img { max-width: 150px; max-height: 40px; width: auto; height: auto; object-fit: contain;
}
}

@media (max-width: 990px) {
	body .is-layout-flex.flogos { flex-wrap: wrap;}
}



/* POPRAWKI */

/* .csound { position: relative; left:-80px; } */

@media (max-width: 990px) {
 .csound { position: static; }
}


body.page-id-150 p em { font-size:1.15rem; line-height: 2.4rem; letter-spacing: 0;;}

#upsection { text-align: center; margin-bottom: 50px;}
#upsection svg { width: 30px; height: auto;}
#upsection button { cursor: pointer;}

/* tabela */
.wp-block-table table { border-collapse: collapse; margin: 25px 0;  min-width: 400px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);}
.wp-block-table table thead tr { background-color: #11424e; color: #ffffff; text-align: left; }
.wp-block-table table th,
.wp-block-table table td {  padding: 12px 15px; border: none; transition: all 0.25s ease-out;}
.wp-block-table table tbody tr { background: none; }
.wp-block-table table tr:nth-of-type(even) { background-color: #242b3c; }
.wp-block-table table tr:last-of-type { border-bottom: 2px solid #11424e;}

.wp-block-table table tr:hover td { background: #242b3c;}




.wp-block-embed__wrapper { aspect-ratio: 16 / 9; width: 100%;}
.wp-block-embed__wrapper iframe { width: 100%; height: 100%; border: 0; }


.wp-block-cb-carousel-v2 .cb-button-prev::after, .wp-block-cb-carousel-v2 .cb-button-next::after { font-style: normal;}



/* tylko gdy jest blockotue przesuwamy w prawo tekst */
@media (min-width: 990px) {
	.wp-block-columns:has(> .wp-block-column:nth-child(2)):not(:has(> .wp-block-column:nth-child(3))) > .wp-block-column:last-child:has(blockquote) > * { padding-left: 165px; }
  .alignfull.superwide .wp-block-columns:has(> .wp-block-column:nth-child(2)):not(:has(> .wp-block-column:nth-child(3))) > .wp-block-column:last-child:has(blockquote) > * { padding-left: 0px; } 

  /* gdy mamy fullsize, i blockote po lewej, to musimy dać minimalny odstęp */
  .alignfull.superwide .wp-block-columns:has(> .wp-block-column:nth-child(2)):not(:has(> .wp-block-column:nth-child(3))) > .wp-block-column:first-child:has(blockquote) > * { padding-left: 60px; } 

  blockquote.wp-block-quote { margin-bottom: 100px;} /* tu odstęp między dźwiękiem a cytatem */
}

/* w Gdańsk Research pojawia się duży odstęp przy nierównych kolumnach - odstęp usunięty, ale dodajemy mały margines pod zdjęciem*/
@media (min-width: 2200px) {
  .alignfull.superwide .wp-block-columns:has(> .wp-block-column:nth-child(2)):not(:has(> .wp-block-column:nth-child(3))) > .wp-block-column > figure  { margin-bottom: 60px;}
}


@media (min-width: 780px) {
	.mobileonly { display: none;;}
}






@media (max-width: 780px) {

    /* musi być trochę niżej, bo menu językowe zasłania */
	header#mainHeader .menubtn button { top:60px; left:30px;}
  body.hidelangs header#mainHeader .menubtn button { top:30px; left:30px;}

  .hidemobile { display: none;;}
  .mobile-reverse { flex-direction: column-reverse;}
  blockquote p { max-width: 100%;}

	.wp-block-columns > .wp-block-column:has(blockquote:not(.hidden))  { padding: 60px 0px; }
  .wp-block-columns > .wp-block-column:has(blockquote:not(.hidden)) > .wp-block-spacer { display: none;}
  .wp-block-columns > .wp-block-column:has(blockquote:not(.hidden)) .csound { padding-top: 60px;}

  body.bodylang-hr .hr-hidemobile { display: none; }
  body.bodylang-en .en-hidemobile { display: none; }
  body.bodylang-pl .pl-hidemobile { display: none; }

  .audio-player { margin: 0px 0px;}

  .wp-block-cb-carousel-v2 { width: 90%; margin-left: 5%; }

  /* dodajemy odstęp w karuzelach */
  .wp-block-group__inner-container:has(> .cb-carousel-block) > p.caption { position: relative; left:5%; }
  p.caption { position: relative; left:0%;}
}




@media (max-width: 780px) {
	header#mainHeader .menubtn {
	padding: 40px 20px;
	}

	#langmenu { display: flex; }
	.wp-block-columns { gap: 0px; }
	.pl, .hr { display: none;}
}