/* New section - new style - koncept404 */



.mobile,
.filters-button.mobile{
  display: none;
}

.filter-wrapper.mobile{
  display: none;
}

.fixed-download-contact{
  display: none !important;
}

.shape-bg{
  display: none;
}




#syn.new-concept {
    padding-top: 83px;
    padding-bottom: 5.56vw;
    background-color: #1B1B1B;
    z-index: 1;
    position: relative;
}


#syn.new-concept.synthesizer{
  padding-top: 140px;
}

#syn.new-concept .section-width {
    width: 85.35vw;
    padding: 4.31vw 3.75vw 3.75vw;
    margin: 0 auto;
}

#syn.new-concept h1,
#syn.new-concept h2,
#syn.new-concept h3,
#syn.new-concept h4,
#syn.new-concept h5,
#syn.new-concept h6,
#syn.new-concept a,
#syn.new-concept p,
#syn.new-concept span,
#syn.new-concept ul,
#syn.new-concept ul li{
    font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
    letter-spacing: 0;
}

#syn.new-concept :is(h1, h2, h3, h4, h5, h6, a, p, span, ul, li):not(.tailwind-protect *) {
    color: #FFFFFF;
}

#syn.new-concept h1 {
  color: #FFF;
  font-size: 60px;
  font-weight: 200;
  line-height: 100%;
}
#syn.new-concept :is(h1):not(.tailwind-protect *) {
  margin-bottom: 3.61vw;
}

#syn.new-concept h2 {
  font-size: 26px;
  font-weight: 200;
  line-height: 1.1; 
  color: #FFFFFF;
}
#syn.new-concept :is(h2):not(.twp *) {
  margin-bottom: 3.06vw;
}


/* Normalize heading spacing inside single posts */
.single .single-content h1,
.single .single-content h2,
.single .single-content h3,
.single .single-content h4,
.single .single-content h5,
.single .single-content h6{
  line-height: 1.2;
  margin-top: 4px !important; /* reduce top margin on headings in single posts */
  margin-bottom: 15px !important;/* fixed spacing under each heading */
  padding-top: 0 !important; /* override padding-top from style.css */
  padding-bottom: 0 !important;
}

/* Avoid double-spacing when a paragraph follows a heading */
#syn.new-concept.single .single-content p{
  margin-top: 0;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Synthesizer V typography spacing overrides */
#syn.new-concept.synthesizer :is(h1, h2, h3, h4, h5, h6):not(.tailwind-protect *) {
  line-height: 1.2;
  margin-bottom: 3.06vw;
}

#syn.new-concept.synthesizer :is(p, .text-editor p, .section-content p):not(.tailwind-protect *) {
  line-height: 1.4;
  margin-bottom: 0;
}

/* Force FAQ (Synth) to inherit page font/color */
#syn.new-concept.synthesizer .faq-synth,
#syn.new-concept.synthesizer .faq-synth .question p,
#syn.new-concept.synthesizer .faq-synth .answer{
  font-family: inherit;
  color: inherit;
}

/* SynthesizerV FAQ explicit colors and row background */
#syn.new-concept.synthesizer .faq-synth .question p { color: #B6B6B6; }
#syn.new-concept.synthesizer .faq-synth .answer { color: #B6B6B6; }
#syn.new-concept.synthesizer .faq-synth .item {
  background-color: #2B2B2B;
  border: 1px solid #454545;
}

/* Divider before SynthesizerV FAQ title */
#syn.new-concept.synthesizer #sv-questions-answers .title-wrapper{
  margin-top: 2.5vw;
  padding-top: 5.56vw; /* match Specifications spacing after divider */
  position: relative;
}
#syn.new-concept.synthesizer #sv-questions-answers .title-wrapper:before{
  content: '';
  display: block;
  height: 1px;
  background: #2B2B2B;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}




/*-----------------------------------------------------------
Overlay menu
-------------------------------------------------------------*/

.overlay-section {
  display: none;
  align-items: center;
  top: -500%;
  left: 0;
  z-index: 5;
  width: 100%;
  transition: 1s;
  height: calc(var(--vh) * 100 - 66px); /* 100% wysokości okna */
  position: fixed;
  overflow: overlay;
  background-color: #1B1B1B;
  flex-direction: column;
}

.page-template-page-vocoflex-eula .overlay-section,
.page-template-page-vocoflex .overlay-section{
  background-color: #26262C;
}

.overlay-section.active {  
  top: 66px;
}

.overlay-section .section-width {
  padding: 18.60vw 20px;
  margin: 0;
  height: 100%;
}

.overlay-section .section-content {
  position: relative;
  transition: all 1s;
  transition-timing-function: ease;
  text-align: left;
  margin: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
  height: 100%;
}

.overlay-section .foot-menu ul.menu-bottom {
  display: grid;
  gap: 0;
  height: 104.42vw;
}

.overlay-section .foot-menu ul.menu-bottom li{
  text-align: center;
}

.overlay-section .foot-menu ul.menu-bottom li a{
  color: #FFF;
  font-size: 32px;
  font-weight: 300;
  line-height: 109.375%;
  text-align: center;
}

.overlay-section .copyright p,
.overlay-section .social-media p{
  font-size: 12px;
  line-height: 125%;
  color: #FFFFFF;
  font-size: 14px;
  font-weight: 300;
}

.overlay-section .bottom-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 48px;
}

.overlay-section .social-media {
  align-items: center;
  gap: 20px;
}

.overlay-section .social-media a img{
  filter: contrast(1.5) brightness(1.5);
  opacity: 1;
}

/*-----------------------------------------------------------
HAMBURGER
-------------------------------------------------------------*/

.hamburger {
	padding: 0;
	display: none;
  justify-content: center;
	cursor: pointer;
	transition-property: opacity, filter;
	transition-duration: 0.15s;
	transition-timing-function: linear;
	font: inherit;
	color: inherit;
	text-transform: none;
	background-color: transparent;
	border: 0;
	margin: 0;
	overflow: visible; 
}

.hamburger:hover {
	opacity: 1; 
}

.hamburger.is-active:hover {
	opacity: 1; 
}

.hamburger-box {
  display: inline-block;
  position: relative;
  width: 30px;
  height: 30px;
}

.hamburger-inner{
	transition: .5s;
}

.hamburger-inner, 
.hamburger-inner::before, 
.hamburger-inner::after {
  width: 27px;
	height: 1px;
	position: absolute;
	transition: .2s !important;
	background-color: #A3A3A3;
}

.hamburger-inner {
	display: block;
	top: calc(50% - 1px);
	margin: 0 auto;
	lefT: 0;
	right: 0; 
}

.hamburger-inner::before, 
.hamburger-inner::after {
	content: "";
	display: block; 
}

.hamburger-inner::before {
    top: -6px;
}

.hamburger-inner::after {
	bottom: -6px; 
}

.hamburger--emphatic .hamburger-inner::after {
	top: 6px;
}


/* Specific */

.hamburger--emphatic.is-active .hamburger-inner, 
.hamburger--emphatic.is-active .hamburger-inner::before, 
.hamburger--emphatic.is-active .hamburger-inner::after {
	background-color: #707070;
}





/*
* Emphatic
*/

.hamburger--emphatic {
	overflow: hidden; 
}

.hamburger--emphatic .hamburger-inner {
	transition: background-color 0.125s 0.175s ease-in; 
}

.hamburger--emphatic .hamburger-inner::before {
	left: 0;
	transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, left 0.125s 0.175s ease-in; 
}

.hamburger--emphatic .hamburger-inner::after {
	right: 0;
	transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.125s linear, right 0.125s 0.175s ease-in; 
}

.hamburger--emphatic.is-active .hamburger-inner {
	transition-delay: 0s;
	transition-timing-function: ease-out;
	background-color: transparent !important;
}

.hamburger--emphatic.is-active .hamburger-inner::before {
	left: -80px;
	top: -80px;
	transform: translate3d(80px, 80px, 0) rotate(45deg);
	transition: left 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); 
}

.hamburger--emphatic.is-active .hamburger-inner::after {
	right: -80px;
	top: -80px;
	transform: translate3d(-80px, 80px, 0) rotate(-45deg);
	transition: right 0.125s ease-out, top 0.05s 0.125s linear, transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1); 
}















.button-section{
  display: flex;
}

.button-section.green-v1 a {
  display: flex ;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  font-weight: 500;
  line-height: 125%;
  height: 36.09px;
  padding: 12px 33.169px;
  border-radius: 12px;
  color: #1B1B1B !important;
  background: #79D825;
  transition: .3s;
}

.button-section.green-v1 a:hover{
  opacity: .7;
}

.button-section.green-v2 a {
  display: flex;
  height: 36.09px;
  padding: 9.046px 33.169px;
  justify-content: center;
  align-items: center;
  gap: 16px;
  border-radius: 12px;
  border: 1px solid #79D825;
  color: #79D825 !important;
}

.button-section.green-v2 a:hover{
  opacity: .7;
}



.button-section.white-v1 a {
  display: flex  ;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  line-height: 125%;
  height: 36.09px;
  padding: 12px 33.169px;
  border-radius: 12px;
  color: #1B1B1B !important;
  background: #FFFFFF;
  transition: .3s;
}

.button-section.white-v1 a:hover{
  opacity: .7;
}




#syn.new-concept .slick-slide {
  opacity: 1;
}

.carousel-arrow {
  width: 100%;
  position: absolute;
  top: 50%;
  z-index: 2;
}

.carousel-arrow .arrow{
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translate( 0, -50% );
}

.carousel-arrow .arrow img{
  width: 4.17vw;
  height: 4.17vw;
  transition: .2s;
  border-radius: 50%;
}

.carousel-arrow .arrow img:hover{
  background-color: #1B1B1B;
}
























/* Voices */

#syn.new-concept #syn-lineup-v3 {
    background: #1B1B1B;
}

#syn.new-concept #voice_db section.wrap {
    width: 100%;
}

#syn.new-concept #voice_db .voice_db_content {
    padding-left: 0;
    padding-right: 0;
    background: #1B1B1B;
    border-radius: .5rem;
    width: 100%;
    position: relative;
    padding-bottom: 0;
    margin-bottom: 0;
}

#syn.new-concept #voice_db .voice_db_filters {
  display: flex;
  align-items: center;
  gap: 44px;
}

#syn.new-concept #voice_db .voice_db_filters .voice_db_filter {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

#syn.new-concept #voice_db .voice_db_filters .voice_db_filter .voice_db_filter_label{
  color: #B6B6B6;
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  font-size: 12px;
  font-weight: 300;
  line-height: 125%;
  letter-spacing: unset;
}




#syn.new-concept #voice_db .voice_db_filters .voice_db_filter .voice_db_filter_select select {
  border: none;
  outline: none;
  background-color: transparent;
  padding: 11px 0;
  border-radius: 0px;
  color: #FFFFFF;
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  line-height: 125%;
  letter-spacing: unset;
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/dropdown.svg');
  background-position: 100% 50%;
  cursor: pointer;
  border-bottom: 1px solid #454545;
  transition: .3s;
}

#syn.new-concept #voice_db .voice_db_filters .voice_db_filter .voice_db_filter_select select:hover{
  border-bottom: 1px solid #A3A3A3;
}

#syn.new-concept .voice_db_filter_select select option {
  background-color: #454545;
  color: #FFFFFF;
  padding: 0 10px !important;
}




/* Custom select/dropdown */

body .select2-container{
  opacity: 1;
}

/* Stylizacja głównego select */


body .select2-container--default .select2-selection--single {
  background-color: transparent;  
  border: none;
  border-radius: 0;         
  height: auto;             
  line-height: 1;          
  padding: 0 0 11px; 
  border-bottom: 1px solid #454545;
  transition: .3s;          
}

body .select2-container--default .select2-selection--single:hover{
  border-bottom: 1px solid #A3A3A3;
}

body .select2-container--default .select2-selection--single .select2-selection__rendered {
  font-size: 16px;
  font-weight: 300;
  line-height: 125%;       
  padding: 0;
}

body .select2-container--default .select2-selection--single .select2-selection__clear {
  margin-right: 5px;       
}



/* Ukrycie domyślnego elementu strzałki */

body .select2-container--default .select2-selection__arrow b {
  display: none;
}

/* Domyślny wygląd strzałki – obrazek ustawiony jako tło */

body .select2-container--default .select2-selection--single .select2-selection__arrow {
  background: url('/wp-content/themes/homepage_theme_240416/assets/img/dropdown.svg') no-repeat center;
  background-size: contain; 
  width: 26px;
  height: 26px;
  margin: 0;
  border: none; 
  transition: transform 0.3s ease;  /* Dodajemy animację */
}

/* Gdy dropdown jest otwarty – obracamy strzałkę o 180° */

body .select2-container--open .select2-selection__arrow {
  transform: rotate(180deg);
}





/* Stylizacja głównego kontenera dropdown */

body .select2-container--default .select2-dropdown {
  margin-top: 16px;
  background-color: #454545;
  opacity: 1;
  border: none;
  border-radius: 12px;
  padding: 0;
}

/* Stylizacja listy opcji */
body .select2-container--default .select2-results,
body .select2-container--default .select2-results>.select2-results__options {
  max-height: none;
  overflow-y: visible;
}

/* Stylizacja pojedynczych opcji */
body .select2-container--default .select2-results__option {
  color: #FFF;
  font-size: 16px;
  font-weight: 300;
  line-height: 125%;     
  padding: 14px 10px;
  position: relative;
}

body .select2-container--default .select2-results__option:before {
  content: '';
  width: 100%;
  height: 100%;
  background-color: #2B2B2B;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: .3s;
  z-index: -1;
}

body .select2-container--default .select2-results__option:first-child:before{
  border-radius: 12px 12px 0 0;
}

body .select2-container--default .select2-results__option:last-child:before{
  border-radius: 0 0 12px 12px;
}

body .select2-container--default .select2-results__option:hover:before{
  opacity: 1;
}





/* Stylizacja opcji podświetlonej (hover lub przy użyciu klawiatury) */
body .select2-container--default .select2-results__option--selected,
body .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: transparent;
  color: #fff;
}












#syn.new-concept #voice_db .voice_db_grid {
  margin-top: 3.61vw;
  margin-bottom: 1.11vw;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item, 
#syn.new-concept #voice_db .voice_db_grid .voice_db_item_spacer{
  max-width: calc(33% - 26px);
  margin-bottom: 44px;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item {
  padding: 24px;
  border-radius: 12px;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item:hover{
  background-color: transparent;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item:before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #2B2B2B;
  border-radius: 12px;
  opacity: .6;
  transition: .3s;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item:hover:before{
  opacity: 1;
}

#voice_db .voice_db_grid .voice_db_item div.voice_db_modal, 
#voice_db .voice_db_grid .voice_db_item_spacer div.voice_db_modal {
  height: 4.93vw;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item img.voice_db_item_image, 
#syn.new-concept #voice_db .voice_db_grid .voice_db_item_spacer img.voice_db_item_image {
  box-shadow: none;
  border-radius: 12px;
  background: unset;
  width: 4.93vw;
  height: 4.93vw;
  min-height: auto;
  min-width: auto;
  border: none;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item div.voice_db_modal .voice_db_item_title, 
#syn.new-concept #voice_db .voice_db_grid .voice_db_item_spacer div.voice_db_modal .voice_db_item_title {
  font-size: 18px;
  font-weight: 500;
  line-height: 122%;
  color: #FFFFFF;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item div.voice_db_modal .voice_db_item_caption, 
#syn.new-concept #voice_db .voice_db_grid .voice_db_item_spacer div.voice_db_modal .voice_db_item_caption {
  font-size: 12px;
  font-weight: 300;
  line-height: 125%;
  color: #A3A3A3;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item button.voice_db_play, 
#syn.new-concept #voice_db .voice_db_grid .voice_db_item_spacer button.voice_db_play {
  opacity: 1;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/play-voices.svg);
  background-color: transparent;
  width: 2.64vw;
  height: 2.64vw;
  padding: 0;
  box-shadow: none;
  min-width: auto;
  min-height: auto;
  background-size: contain;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item div.voice_db_modal .voice_db_item_caption,
#syn.new-concept #voice_db .voice_db_grid .voice_db_item button.voice_db_play{
  opacity: .6;
  transition: .3s;
}

#syn.new-concept #voice_db .voice_db_grid .voice_db_item:hover div.voice_db_modal .voice_db_item_caption,
#syn.new-concept #voice_db .voice_db_grid .voice_db_item:hover button.voice_db_play{
  opacity: .9;
}

.button-section.showmore{
  cursor: pointer;
  justify-content: center;
  opacity: .7;
  transition: .3s;
}

.button-section.showmore:hover{
  opacity: 1;
}

.button-section.showmore .support-wrapper{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.button-section.showmore .support-wrapper img{
  width: 2.08vw;
  height: 2.08vw;
}

.button-section.showmore .support-wrapper p{
  color: #A3A3A3;
  font-size: 16px;
  font-weight: 500;
  line-height: 125%;
}

/* Section - 20 Help Resources*/


#syn.new-concept.help-resources .section{
  display: noe;
}

#syn.new-concept #section-20.section{
  display: block;
}


#section-20.section .section-width{
  padding-bottom: 6.67vw;
}


#syn.new-concept #appPhoneme {
  color: #f0f0f0;
}

.fixed-download-contact {
  background: rgba(255, 255, 255, 0.05);
}

#syn.new-concept #appPhoneme header {
  display: flex;
  align-items: flex-start;
  margin-bottom: 5.56vw;
}

#syn.new-concept #appPhoneme header h1 {
  color: #B6B6B6;
  font-size: 40px;
  font-weight: 300;
  line-height: 110%;
  margin-bottom: 5px;
}

#syn.new-concept #appPhoneme header h2 {
  color: #79D825;
  font-size: 16px;
  font-weight: 300;
  line-height: 125%;
  margin-bottom: 0;
}

#syn.new-concept #appPhoneme .options-ctn {
  display: flex;
  flex: 1;
  flex-direction: row-reverse;
  margin-bottom: 0;
}

#syn.new-concept #appPhoneme .options-ctn .options {
  display: flex;
  padding: 0;
  border-radius: 0;
  margin-right: 0;
}

#syn.new-concept #appPhoneme .options label {
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  margin-bottom: 30px;
  color: #B6B6B6;
  font-size: 12px;
  font-weight: 300;
  line-height: 125%;
  display: block;
  min-width: 340px;
}

#syn.new-concept #appPhoneme .options select {
  border: none;
  outline: none;
  background-color: transparent;
  padding: 11px 0;
  border-radius: 0px;
  color: #FFFFFF;
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  line-height: 125%;
  letter-spacing: unset;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/dropdown.svg);
  background-repeat: no-repeat;
  background-position: 100% 50%;
  cursor: pointer;
  border-bottom: 1px solid #454545;
  transition: .3s;
  appearance: none;
  min-width: 340px;
}

#syn.new-concept #appPhoneme .options select:hover {
  border-bottom: 1px solid #A3A3A3;
}

#syn.new-concept #appPhoneme .options select option {
  background-color: #454545;
  color: #FFFFFF;
  padding: 0 10px !important;
}


#syn.new-concept #appPhoneme .table-group {
  display: grid;
  grid-template-columns: 50% 50%;
  width: 100%;
  gap: 16px;
}

#syn.new-concept #appPhoneme .table-ctn .table {
  width: 100%;
}

#syn.new-concept #appPhoneme .tr-big{
  text-align: left;
}

#syn.new-concept #appPhoneme .tr-big h4 {
  color: #B6B6B6;
  font-size: 26px;
  font-weight: 300;
  line-height: 111.538%;
  margin-bottom: 1.94vw;
}

#syn.new-concept #appPhoneme .tr-col.special{
  padding-top: 0;
  border: none;
}

#syn.new-concept #appPhoneme .tr-col p{
  color: #B6B6B6;
  font-size: 16px;
  font-weight: 300;
  line-height: 125%;
  transition: .5s;
}

#syn.new-concept #appPhoneme .tr-col.special p{
  font-size: 14px;
  font-weight: 600;
  line-height: 114.286%;
}

#syn.new-concept #appPhoneme .tr-col {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  justify-content: space-between;
  text-align: center;
  padding: 1.39vw 0;
  border-top: 1px solid #454545;
}

#syn.new-concept #appPhoneme .tr-col .phoneme{
  position: relative;
}

#syn.new-concept #appPhoneme .tr-col:hover p{
  color: white;
}

#syn.new-concept #appPhoneme .tr-col.special:hover p{
  color: #B6B6B6;
}

#syn.new-concept #appPhoneme .tr-col .phoneme:before{
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate( -50%, 0);
  min-width: 6px;
  min-height: 6px;
  width: 0.42vw;
  height: 0.42vw;
  background-color: #79D825;
  border-radius: 50%;
  opacity: 0;
  transition: .5s;
}

#syn.new-concept #appPhoneme .tr-col.special .phoneme:before{
  display: none;
}

#syn.new-concept #appPhoneme .tr-col:hover .phoneme:before{
  opacity: 1;
}

#syn.new-concept #appPhoneme .tbody .tr-col div:nth-child(4){
  display: none;
}

#syn.new-concept #appPhoneme .tbody{
  border-radius: 12px;
  background-color: #201F1F;
  padding: 2.22vw;
}














@media (max-width: 800px) {
  #syn.new-concept #appPhoneme header {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 767px) {
  .table-group {
    flex-direction: column;
  }
}


/* Modal Voices */

.dreamtonics.modal .modal__container {
  height: auto !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 29px;
  padding: 0 !important;
  border: none !important;
  border-radius: 12px !important;
  background-color: #2B2B2B !important;
}

.dreamtonics.modal .modal__close {
  position: absolute !important;
  top: 35px !important;
  right: 32px !important;
  background-image: none !important;
  width: 38px !important;
  height: 38px !important;
  padding: 0;
}

.dreamtonics.modal .modal__close:hover img{
  filter: brightness(1.2);
}

.dreamtonics.modal .modal__info {
  max-width: 100% !important;
  flex-direction: row !important;
  align-items: center;
  height: auto !important;
  padding: 2.43vw 2.22vw 0 !important;
  align-items: center;
  gap: 19px !important;
}

.dreamtonics.modal .modal__content {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr);
  align-items: flex-start !important;
  overflow: hidden;
  padding: 0 2.22vw !important;
  gap: 7.01vw !important;
}

.dreamtonics.modal .modal__content .col-right{
  overflow: hidden;
  height: 100%;
}

.dreamtonics.modal .modal__content .col-right .video-pagination{
  display: flex;
  justify-content: flex-end;
  gap: 20px;
  margin-top: 12px;
}

.video-pagination .video-page-btn{
  color: #B6B6B6;
  font-size: 12px;
  font-style: normal;
  font-weight: 300;
  line-height: 125%;
  cursor: pointer;
}

.video-pagination .video-page-btn.active{
  color: #FFFFFF;
}

.dreamtonics.modal .modal__info_scroll .video-desktop-wrapper iframe,
.dreamtonics.modal .modal__info_scroll .iframe-container iframe{
  border-radius: 12px;
}

.dreamtonics.modal .modal__info_scroll h4 {
  display: none;
}

.dreamtonics.modal .modal__info .player__ai img {
  filter: none;
  width: 4.86vw;
  height: 4.86vw;
  object-fit: cover;
  border-radius: 12px;
}

.dreamtonics.modal .modal__info_title {
  font-size: 26px !important;
  font-weight: 400 !important;
  margin-bottom: 8px;
}

.dreamtonics.modal .modal__info_caption,
.dreamtonics.modal .modal__info_about{
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif !important;
  line-height: 125% !important;
  font-weight: 300 !important;
  letter-spacing: 0 !important;
}

.dreamtonics.modal .modal__info_about {
  color: #B6B6B6 !important;
  font-size: 16px !important;
  margin-bottom: 32px;
}

.dreamtonics.modal .modal__info_product {
  display: flex !important;
  justify-content: flex-start;
  align-items: center;
  width: 190px;
  height: 30px;
  padding: 0 !important;
  padding-left: 38px !important;
  border-radius: 0 !important;
  color: #e5e5e5;
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif !important;
  font-size: 14px;
  line-height: 1.4 !important;
  letter-spacing: 0em;
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/button-arrow.svg') !important;
  background-repeat: no-repeat;
  background-size: 30px 30px;
  background-position: left !important;
  background-color: transparent !important;
  opacity: .6;
}

.dreamtonics.modal .modal__info_product:hover{
  opacity: 1;
}

.dreamtonics.modal .modal__info_caption{
  font-size: 12px !important;
  color: #A3A3A3 !important;
}


.dreamtonics.modal .modal__info_scroll {
  padding-right: 30px;
  overflow-x: hidden;
  overflow-y: scroll;
  scrollbar-width: auto !important;
}

.dreamtonics.bar .player__content {
  transform: none !important;
  padding: 38px 2.22vw 26px !important;
  box-shadow: none !important;
  border: none !important;
  background-color: rgba(27, 27, 27, .5) !important;
  border-radius: 0 0 12px 12px;
}

.dreamtonics button.player__next.mobile, 
.dreamtonics button.player__prev.mobile{
  display: none;
}



.dreamtonics.bar{
  z-index: 1 !important;
  opacity: 1 !important;
  position: relative !important;
}

.dreamtonics.bar .player__controls,
.dreamtonics.bar .player__mode{
  margin: 0 !important;
}

.dreamtonics.bar .player__controls {
  position: relative;
}



.dreamtonics.bar .player__track, 
.dreamtonics.bar .player__mode {
  background-color: transparent !important;
}

.player-select,
.player__controls,
.player__mode{
  width: 33.33333%;
}

.dreamtonics.bar span.player__trackname {
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  font-size: 16px;
  width: auto;
  min-width: auto !important;
  line-height: 125%;
  letter-spacing: 0;
  text-align: left;
  color: #B6B6B6;
}

.dreamtonics.modal .modal__info_scroll {
  padding-right: 0 !important;
}

.dreamtonics.bar .player__track{
  justify-content: flex-start !important;
  gap: 18px !important;
  border-radius: 0 !important;
  overflow: visible !important;
  position: relative;
}

.dreamtonics button.player__select {
  background: none !important;
  transform: none !important;
  width: 24px;
  height: 24px;
  padding: 0;
  top: 3px;
}

.div-width{
  display: flex;
  align-items: flex-end;
  gap: 16px;
  cursor: pointer;
}

.div-width:hover .player__trackname,
.div-width:hover button.player__select img{
  filter: brightness(1.3);
}

.dreamtonics.bar .player__track.player__select_active .player__select {
  transform: rotate(180deg) !important;
}

.dreamtonics button.player__select img{
  width: 24px;
  height: 24px;
  object-fit: contain;
}

span.player__select_track_tag {
  margin-left: 4px;
  color: #79D825;
  font-size: 12px;
  font-weight: 400;
  line-height: 15px;
  text-transform: capitalize;
}

.dreamtonics.bar .player__select_combo {
  background-color: #454545 !important;
  color: #FFFFFF !important;
  z-index: 1;
  top: unset !important;
  transform: none !important;
  bottom: 25px !important;
  min-width: 176px;
  height: 158px !important;
  border-radius: 12px !important;
  overflow: auto !important;
}

.dreamtonics.bar .player__select_combo::-webkit-scrollbar {
  display: none;
}

.dreamtonics.bar .player__track.player__select_active .player__select_combo li, 
.dreamtonics.bar .player__select_combo li {
  border-bottom: none !important;
  padding: 8px 16px;
  display: flex;
  gap: 3px !important;
  align-items: center;
  justify-content: flex-start !important;
}

.dreamtonics.bar .player__track.player__select_active .player__select_combo li span.player__select_track_name {
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  flex-grow: unset !important;
  font-size: 16px;
  font-weight: 300;
  letter-spacing: 0;
}

.dreamtonics.bar .player__track.player__select_active .player__select_combo li span.player__select_track_tag {
  background-color: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  text-transform: capitalize !important;
}

.dreamtonics.bar .player__select_combo li.selected,
.dreamtonics.bar .player__select_combo li:hover {
  background-color: #2B2B2B !important;
}

.dreamtonics.bar .player__mode{
  padding: 0 !important;
}






.dreamtonics.bar .player__progress{
  margin-top: 13px;
  order: 3 !important;
}

.dreamtonics.bar .player__seek-bar {
  background-color: #1B1B1B !important;
}

.dreamtonics.bar .player__play-bar {
  background-color: #454545 !important;
  border-radius: 12px;
}





.player__mode_container.desktop {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  position: relative;
}



.player__mode_container.desktop .player__mode_name {
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif !important;
  color: #B6B6B6 !important;
  font-size: 16px;
  font-weight: 300 !important;
  line-height: 125% !important;
  min-width: 0 !important;
}

.player__mode_container.desktop label{
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  font-size: 12px;
  font-weight: 300;
  line-height: 125%;
  color: #B6B6B6;
}

.player__mode_container.desktop:hover label,
.player__mode_container.desktop:hover .player__mode_name, 
.player__mode_container.desktop:hover button.player__select img {
  filter: brightness(1.3);
}

.player__mode_container.desktop button.player__select.active{
  transform: rotate(180deg) !important;
}

.player__mode_combo {
  display: none;
  position: absolute;
  bottom: 25px;
  right: 0;
  min-width: 100px;
  height: 158px;
  border-radius: 12px;
  color: #FFFFFF;
  background: #494949;
  list-style: none;
  margin: 0;
  padding: 0;
  z-index: 100;
  width: 100%;
  overflow: auto;
}

.player__mode_combo li {
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  padding: 8px 16px;
  cursor: pointer;
  font-size: 16px;
  color: #FFFFFF;
  line-height: 125%;
  font-weight: 300;
  display: flex;
  align-items: center;
  height: 40px;
}

.player__mode_combo li span{
  display: block;
}

.player__mode_combo li:hover,
.player__mode_combo li.selected {
  background-color: #2B2B2B;
}

.player__mode_combo::-webkit-scrollbar {
  display: none;
}

/* Ukrywamy wersję mobilną */
.player__mode_mobile.mobile {
  display: none;
}

.dreamtonics button.player__play,
.dreamtonics button.player__pause{
  transition: .5s;
  width: 39px;
  height: 39px;
  background-size: contain;
  background-color: transparent !important;
  border-radius: 50%;
}



.dreamtonics button.player__play {
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/play-1.svg') !important;
  background-color: #B6B6B6 !important;
}

.dreamtonics button.player__play:hover {
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/play-2.svg') !important;
}

.dreamtonics button.player__pause {
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/play-3.svg') !important;
  background-color: #FFFFFF !important;
}




.dreamtonics button.player__next, 
.dreamtonics button.player__prev {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/player-next.svg) !important;
  background-color: transparent !important;
  width: 13px;
  height: 18px;
  background-size: contain;
  border-radius: 0 !important;
  opacity: .6 !important;
}

.dreamtonics button.player__next:hover, 
.dreamtonics button.player__prev:hover{
  opacity: 1 !important;
}








/* Kolejne skecje tutaj */

#section-1.section {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-2.svg);
  background-repeat: no-repeat;
  background-size: contain;
}

#section-1.section .section-width{
  padding-bottom: 4.5vw;
}

#section-1.section .section-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

#section-1.section .image-wrapper img {
    width: 40.83vw;
    margin-bottom: 2.29vw;
}

#section-1.section .text-editor {
    margin-bottom: 3.61vw;
}

#section-1.section .text-editor h6{
  margin: 0 0 18px;
}

#section-1.section .text-editor h6 span{
  color: #FFF;
  font-size: 26px !important;
  font-weight: 300;
  line-height: 111.538%;
}

#section-1.section .text-editor h4 span{
  color: #B6B6B6 !important;
  font-size: 20px !important;
  font-style: normal;
  font-weight: 300;
  line-height: 122.222%;
}

#section-1.section .text-editor p{
  font-size: 26px;
  color: #B6B6B6; 
  font-weight: 300;
  line-height: 1.1;
}

#section-1.section .button-container {
    display: flex;
    justify-content: center;
    gap: 24px;
}

#section-1.section .button-section-2 a {
    padding: 9.046px 33.169px;
    border: 1px solid var(--SV-Green, #79D825);
    background: transparent;
    color: var(--SV-Green, #79D825);
}

#section-1.section .video{
  margin-top: 4.86vw;
}

.video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  cursor: pointer;
  z-index: 9999;
  transition: none !important;
  touch-action: pan-x; /* pozwala na poziomy swipe */
}


#section-1.section video,
#section-1.section iframe,
#section-1.section .video-thumbnail,
#section-1.section img.video-thumb{
  width: 72.36vw;
  height: 38.26vw;
  border-radius: 12px;
}

#section-1.section iframe{
  height: 38.26vw;
}

/* tux: make the height fill the slick track */
#section-2.section .slick-track {
  display: flex;
  align-items: stretch;
}

#section-2.section .slick-slide {
  /* tux: somewhere set height: 100%, which prevents the align-items in partent */
  height: auto;
}

/* tux: make necessary children fills */
#section-2.section .slick-slide > div,
#section-2.section .slick-slide .item,
#section-2.section .slick-slide .item .support-wrapper{
  height: 100%;
}

#section-2.section .section-width .title-wrapper h2{
  margin-bottom: 3.82vw;
}

#section-2.section .testimonials-carousel .item .support-wrapper {
  display: grid;
  grid-template-columns: 27.15vw auto;
  width: 61.25vw;
  gap: 4.17vw;
  padding: 20px 40px 20px 0;
  position: relative;
}

#section-2.section .testimonials-carousel .item .support-wrapper:before{
  content: '';
  width: calc( 61.25vw - 25px );
  height: 100%;
  background-color: #2B2B2B;
  position: absolute;
  top: 0;
  right: 0;
  border-radius: 12px;
}

#section-2.section .image-wrapper,
#section-2.section .image-wrapper img,
#section-2.section .video,
#section-2.section .video video,
#section-2.section .video iframe {
  width: 27.15vw;
  height: 14.31vw;
  border-radius: 12px;
  z-index: 1;
  object-fit: cover;
}


#section-2.section .text-column {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  z-index: 1;
}

#section-2.section .text-column .status p,
#section-2.section .text-column .text-editor p{
  color: #B6B6B6;
  font-weight: 200;
  line-height: 125%;
}

#section-2.section .text-column .status p{
  font-size: 14px;
}

#section-2.section .text-column .name p{
  font-weight: 600;
  line-height: 125%;
}


#section-2.section .person-info {
  display: grid;
  grid-template-columns: 5.76vw auto;
  align-items: center;
  gap: 12px;
}

#section-2.section .person-image{
  position: relative;
}

#section-2.section .person-image img{
  border-radius: 12px;
  object-fit: contain;
}

#section-2.section .person-image .person img {
  width: 4.58vw;
  height: 4.58vw;
  margin-left: 0;
  object-fit: cover;
}

#section-2.section .person-image .company img {
  width: 2.36vw;
  height: 2.36vw;
  position: absolute;
  top: -6px;
}




#section-2.section .testimonials-wrapper{
  position: relative;
}

#section-2.section .testimonials-wrapper:before, 
#section-2.section .testimonials-wrapper:after {
  content: '';
  width: 30vw;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: -11.5vw;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-gradient.svg);
  background-size: cover;
  background-repeat: no-repeat;
  z-index: 1;
}

#section-2.section .testimonials-wrapper:after{
  right: -11.5vw;
  left: unset;
  transform: rotate(180deg);
}

#section-2.section .testimonials-wrapper .slick-list {
  overflow: visible;
}

#section-2.section .testimonials-wrapper .slick-list .slick-slide>div {
  margin: 0 2.78vw;
}

#section-2.section .testimonials-wrapper  .carousel-arrow .arrow-left {
  left: 0;
}

#section-2.section .testimonials-wrapper  .carousel-arrow .arrow-right {
  right: 0;
}





/* Section 3 - Background Image */


#section-3.section .section-width {
  padding: 5.56vw 3.75vw;
}

#section-3.section .section-width .image-wrapper{
  position: relative;
}

#section-3.section .section-width .image-wrapper:before {
  content: '';
  width: 100%;
  height: 18.86vw;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/gradient-image-bottom.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  bottom: 0;
}


/* Section 4 - Image + list */

#section-4.section .section-width{
  padding: 4.5vw 3.75vw 0;
}

#section-4.section .section-content{
  padding-bottom: 5.56vw;
  border-bottom: 1px solid #2B2B2B;
}



#section-4.section .support-wrapper {
  display: grid;
  grid-template-columns: 38.13vw auto;
  gap: 4.72vw;
}

#section-4.section .col-left .image-wrapper,
#section-4.section .col-left img {
  width: 100%;
  height: 28.47vw;
  object-fit: cover;
  border-radius: 12px;
}

#section-4.section .col-right {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#section-4.section .point{
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid #2B2B2B;
}

#section-4.section .point:last-child{
  border: none;
}

#section-4.section .point p {
  font-size: 22px;
  font-weight: 300;
  line-height: 1.1;
  color: #FFFFFF;
  display: flex;
  gap: 9px;
}

#section-4.section .point p span {
  display: block;
  min-width: 6px;
  min-height: 6px;
  width: 0.42vw;
  height: 0.42vw;
  background-color: #79D825;
  border-radius: 50%;
  margin-top: 8px;
}

/* Stylizacja nagłówków tabów (bez ul/li) */

.tabs {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 3.06vw;
}

.tabs .tab {
  cursor: pointer;
  padding: 6px 22px;
  border-radius: 12px;
  background: #454545;
  margin-right: 10px;
  transition: background 0.3s;
}

.tabs .tab p{
  font-size: 16px;
  color: #1B1B1B !important;
}

.tabs .tab.active, 
.tabs .tab:hover {
  background: #B6B6B6;
}

/* Ukrywanie zawartości paneli */
.tab-panel {
  display: none;
}

/* Pokazujemy aktywny panel */
.tab-panel.active {
  display: block;
}


/* Stylizacja tab-content – już bez pozycji absolute i stałej wysokości */
.tab-content {
  overflow: hidden; /* pozwala ukryć zawartość podczas animacji */
}

/* Panele pozostają w normalnym przepływie dokumentu */
.tab-panel {
  display: none;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.tab-panel.active {
  display: block;
  opacity: 1;
}



/* Section 5 - Selected records */


#section-5.section .title-wrapper {
  text-align: left;
}

#section-5.section .text-editor {
  margin: 3.06vw 0 5.56vw;
}

#section-5.section .text-editor p{
  font-size: 40px;
  font-weight: 200;
  color: #B6B6B6;
  line-height: 1.1;
}

#section-5.section .support-wrapper{
  display: grid;
  grid-template-columns: 38.06vw 22.36vw;
  justify-content: space-between;
  align-items: center;

}



#section-5.section .animation-button{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 22.36vw;
  height: 24.38vw;
  background: radial-gradient(47.16% 47.13% at 50% 50%, rgba(84, 84, 84, 0.30) 0%, rgba(43, 43, 43, 0.00) 100%);
  position: relative;
}

#section-5.section .button-section {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 12vw;
  min-width: 197px;
  gap: 1.53vw;
  cursor: pointer;
}


#section-5.section .button-section {
  opacity: .7;
  transition: .3s;
}

#section-5.section .button-section .image-wrapper .button,
#section-5.section .button-section .image-wrapper .button img{
  width: 4.17vw;
  height: 4.17vw;
}

#section-5.section .button-section:hover{
  opacity: 1;
}

#section-5.section .button-section .link{
  color: #FFFFFF;
  font-size: 18px;
  font-weight: 500;
  line-height: 122.222%;
  transition: .3s;
}

#section-5.section .button-section:hover a{
  color: #ffffff;
}

#section-5.section .element{
  position: absolute;
  transition: .6s;
}

#section-5.section .element img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 12px;
}



#section-5.section .element.e1{
  top: 5.42vw;
  left: 0;
  width: 3.68vw;
  height: 3.68vw;
}

#section-5.section .animation-button:hover .element.e1{
  top: 3.82vw;
  left: 2.85vw;
  width: 2.08vw;
  height: 2.08vw;
  filter: blur(1px);
}



#section-5.section .element.e2{
  top: 0;
  left: 6.98vw;
  width: 2.22vw;
  height: 2.22vw;
  filter: blur(1px);
}

#section-5.section .animation-button:hover .element.e2{
  top: 4.86vw;
  left: 8.61vw;
  width: 3.68vw;
  height: 3.68vw;
  filter: none
}



#section-5.section .element.e3{
  top: 3.61vw;
  left: 9.51vw;
  width: 3.68vw;
  width: 3.68vw;
}

#section-5.section .animation-button:hover .element.e3{
  top: 3.06vw;
  left: 15.97vw;
  width: 2.92vw;
  width: 2.92vw;
}



#section-5.section .element.e4{
  top: 1.94vw;
  left: 15.97vw;
  width: 2.92vw;
  height: 2.92vw;
}

#section-5.section .animation-button:hover .element.e4{
  top: 8.54vw;
  left: 19.79vw;
  width: 2.08vw;
  width: 2.08vw;
  filter: blur(1px);
}



#section-5.section .element.e5{
  top: 8.26vw;
  left: 20.07vw;
  width: 2.29vw;
  height: 2.29vw;
}

#section-5.section .animation-button:hover .element.e5{
  top: 15.76vw;
  left: 16.88vw;
  width: 3.96vw;
  width: 3.96vw;
}



#section-5.section .element.e6{
  top: 15.83vw;
  left: 17.43vw;
  width: 3.68vw;
  height: 3.68vw;
}

#section-5.section .animation-button:hover .element.e6{
  top: 19.79vw;
  left: 11.18vw;
  width: 3.68vw;
  width: 3.68vw;
}



#section-5.section .element.e7{
  top: 20.35vw;
  left: 8.61vw;
  width: 3.68vw;
  height: 3.68vw;
}

#section-5.section .animation-button:hover .element.e7{
  top: 18.47vw;
  left: 0.83vw;
  width: 2.57vw;
  width: 2.57vw;
  filter: blur(1px);
}



#section-5.section .element.e8{
  top: 19.03vw;
  left: 2.85vw;
  width: 2.57vw;
  height: 2.57vw;
}

#section-5.section .animation-button:hover .element.e8{
  top: 16.53vw;
  left: 6.53vw;
  width: 2.57vw;
  width: 2.57vw;
  filter: blur(1px);
}



/* Układ elementu utworu */

.recording-item {
  width: 30.14vw;
  min-width: 327px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 30px;
  background-color: #2B2B2B;
  margin-bottom: 30px;
  border-radius: 12px;
}

.recording-item:hover{
  background-color: rgba(69, 69, 69, .6);
}

#section-5 > div > div > div.support-wrapper > div.selected-records > div:nth-child(2){
  margin-left: auto;
}

/* Lewa kolumna – informacje i pasek postępu */

#section-5.section .col-left {
	display: flex;
	flex-direction: column;
}

.avatar-wrapper {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-bottom: 20px;
}

.avatar-wrapper .image-wrapper,
.avatar-wrapper img {
  width: 4.93vw;
  height: 4.93vw;
  border-radius: 12px;
  object-fit: cover;
}

.recording-info .name{
	margin-bottom: 6px;
}

.recording-info .name p{
  font-size: 18px;
  font-weight: 600;
  line-height: 122.222%;
  color: #FFFFFF;
}

.recording-info .type p{
  color: #B6B6B6 !important;
  font-weight: 300;
  line-height: 125%;
}

.progress-bar {
	position: relative;
	background: #201F1F;
	height: 3px;
	width: 100%;
  max-width: 180px;
	border-radius: 3px;
	overflow: hidden;
}

.progress-bar .progress {
	background: #454545;
	height: 100%;
	width: 0%;
	transition: width 0.2s;
}

/* Prawa kolumna – przyciski */

#section-5.section .buttons{
  display: grid;
  gap: 16px;
}

#section-5.section .buttons .button-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}

#section-5.section .buttons .button-wrapper p{
  color: #A3A3A3 !important;
  font-size: 14px;
  font-weight: 500;
  line-height: 114.286%;
}

/* Stylizacja przycisków jako ikony */
.play-btn {
	width: 38px;  /* dostosuj rozmiar */
	height: 38px; /* dostosuj rozmiar */
	border: none;
	background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/play.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
	transition: background-image 0.3s;
  background-color: transparent;
	padding: 0;
}

/* Stan hover – zmiana obrazka */
.play-btn:hover {
	background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/hover-play.png');
}

/* Stan aktywny – odtwarzanie */
.play-btn.playing {
	background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/pause.png') !important;
}







/* Section 6/16 - CTA 1 and CTA 2 */

.cta.section  {
  width: 92.50vw;
  margin: auto;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 2.08vw;
}

.cta.section  .section-width {
  width: 100% !important;
  display: flex;
  justify-content: center;
  padding: 0 3.75vw !important;
  background-color: #2B2B2B;
  border-radius: 12px;
}

.cta.section  .section-width:before{
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-cta.svg);
  background-size: 100%;
  border-radius: 12px;
  opacity: .5;
  transition: .6s;
}

.cta.section  .section-width:hover:before{
  opacity: 1;
  left: -10%;
  transform: scale(1.3);
}

.cta.section  .section-content {
  width: 85.35vw;
  padding: 6.60vw 3.75vw;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 1;
}

.cta.section .title-wrapper h2 {
  margin-bottom: 1.11vw !important;
  font-size: 60px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  color: white !important;
}

.cta.section  .text-editor p{
  color: #B6B6B6 !important;
  font-size: 20px;
  font-weight: 300;
  line-height: 110%;
}

.cta.section  .button-section a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 4.17vw;
  height: 4.17vw;
  background-color: #79D825;
  border-radius: 50%;
  position: relative;
}

.cta.section  .button-section.white a{
  background-color: #FFFFFF;
}

.cta.section  .button-section a img{
  position: absolute;
  left: 55%;
  top: 50%;
  transform: translate(-50%, -50%); 
  height: 1.6vw;
}


#syn.new-concept.freetrial #section-6.cta{
  position: relative;
  margin-bottom: 0;
}

#syn.new-concept.freetrial #section-6.cta .element{
  position: absolute;
}

#syn.new-concept.freetrial #section-6.cta .element img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 12px;
}

#syn.new-concept.freetrial #section-6.cta .element.e-1{
  width: 3.75vw;
  height: 3.75vw;
  top: 3.68vw;
  right: 15.83vw;
}

#syn.new-concept.freetrial #section-6.cta .element.e-2{
  width: 2.22vw;
  height: 2.22vw;
  top: 8.33vw;
  right: 23.82vw;
  filter: blur(1px);
}

#syn.new-concept.freetrial #section-6.cta .element.e-3{
  width: 2.64vw;
  height: 2.64vw;
  top: 12.99vw;
  right: 19.58vw;
}

#syn.new-concept.freetrial #section-6.cta .element.e-4{
  width: 2.22vw;
  height: 2.22vw;
  top: 15.90vw;
  right: 13.54vw;
  filter: blur(1px);
}

#syn.new-concept.freetrial #section-6.cta .button-section a{
  padding: 0;
}



/* CTA 2 */

#section-16.section.cta{
  margin: 5.56vw auto 0;
}

#section-16.section.cta  .section-width {
  background-color: #201F1F;
  position: relative;
}

#section-16.section.cta  .section-width:before{
  display: none;
}

#section-16.section.cta .text-editor{
  width: 42.64vw;
}

#section-16.section.cta .section-width .shape {
  content: '';
  position: absolute;
  width: 99.38vw;
  height: 69.10vw;
  top: -130%;
  left: 4%;
  border-radius: 12px;
  transition: .6s;
  opacity: 1;
  transform: scale(1.1);
}

#section-16.section.cta .section-width:hover .shape{
  transform: scale(1,1) rotate(5deg);
  left: 7%;
}

#section-16.section.cta .element {
  position: absolute;
  transition: .6s;
  width: 20px;
  height: 20px;
}

#section-16.section.cta .element img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#section-16.section.cta .element.e1 {
  top: 11vw;
  left: 0;
  width: 60px;
  height: 60px;
}

#section-16.section.cta .section-width:hover .element.e1{
  top: 10vw;
  left: -1vw;
}



#section-16.section.cta .element.e2 {
  top: 5.83vw;
  left: 42.85vw;
}

#section-16.section.cta .section-width:hover .element.e2{
  top: 4.79vw;
  left: 45.90vw;
}



#section-16.section.cta .element.e3 {
  top: 14.24vw;
  left: 47.57vw;
}

#section-16.section.cta .section-width:hover .element.e3{
  top: 15.21vw;
  left: 50.07vw;
}



#section-16.section.cta .element.e4 {
  top: 7.99vw;
  left: 60.90vw;
}

#section-16.section.cta .section-width:hover .element.e4 {
  top: 9.24vw;
  left: 59.10vw;
}



#section-16.section.cta .element.e5 {
  bottom: 3.13vw;
  left: 66.11vw;
}

#section-16.section.cta .section-width:hover .element.e5 {
  bottom: 4.38vw;
  left: 66.39vw;
}



#section-16.section.cta .element.e6 {
  top: 3.13vw;
  left: 65.28vw;
}

#section-16.section.cta .section-width:hover .element.e6 {
  top: 2.78vw;
  left: 64.79vw;
}



#section-16.section.cta .element.e7 {
  top: 6.60vw;
  right: 16.94vw;
}

#section-16.section.cta .section-width:hover .element.e7 {
  top: 5.90vw;
  right: 19.72vw;
}



#section-16.section.cta .element.e8 {
  top: 12.78vw;
  right: 18.47vw;
}

#section-16.section.cta .section-width:hover .element.e8 {
  top: 12.43vw;
  right: 18.06vw;
}



/* Section 17 */

#section-17.section .section-width{
  padding-top: 0;
}


/* Section 7 - Title + text */

#section-7.section .section-width {
  padding-bottom: 1.81vw;
  padding-top: 0;
}

#section-7.section .section-content{
  padding-top: 3.75vw;
  border-top: 1px solid #2b2b2b;
}

#section-7 .title-wrapper h1 {
  margin-bottom: 2.5vw;
  font-size: 60px;
  font-weight: 200;
  line-height: 1;
}

#section-7 .title-wrapper h2 {
  margin-bottom: 2.5vw;
  font-size: 26px;
  font-weight: 300;
  line-height: 1.1;
}

#section-7.section.h1 .text-editor p{
  font-size: 26px;
  color: #B6B6B6;
  font-weight: 300;
  line-height: 1.1; /* 111.538% */
}

#section-7.section.h2 .text-editor p{
  font-size: 40px;
  font-weight: 200;
  color: #B6B6B6;
  line-height: 1.1;
}

#section-7.section .text-editor ul {
  color: #B6B6B6 !important;
  font-size: 18px;
  font-weight: 300;
  line-height: 122.222%;
  width: 46.67vw;
  margin-top: 5.56vw;
  padding-left: 20px;
}

#section-7.section .text-editor ul li {
  color: #B6B6B6 !important;
  list-style: disc;
  padding-bottom: 32px;
}



/* Section 7 Voices */

#syn.new-concept.voices #section-7.section{
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/shape-1.svg');
  background-size: 100%;
  background-repeat: no-repeat;
}

#syn.new-concept.voices #section-7.section .section-width{
  padding-top: 4.31vw;
}

#syn.new-concept.voices #section-7.section .section-content{
  border: none;
}

/* Section 7 help resource */

#syn.new-concept.help-resources #section-7.section .section-width{
  padding-top: 4.31vw;
}

#syn.new-concept.help-resources #section-7.section .section-content{
  border: none;
}

#syn.new-concept.help-resources #section-7.section {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/help-resources-top.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
}

/* Section 7 Terms */

#syn.new-concept.terms #section-7.section .section-width{
  padding-top: 4.31vw;
}

#syn.new-concept.terms #section-7.section .section-content{
  border: none;
}

#syn.new-concept.terms #section-7.section{
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/shape-top-terms.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
}




/* Section 7 Free Trial */

#syn.new-concept.freetrial #section-7.section {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/top-free-trial.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 0 30%;
}

#syn.new-concept.freetrial #section-7.section.number-4{
  background-image: none;
}

#syn.new-concept.freetrial #section-7.section.number-4 .section-width{
  padding-bottom: 5.56vw;
}

#syn.new-concept.freetrial #section-7.section.number-4 .section-content{
  padding-top: 5.26vw;
}


/* Section 8 */

#section-8.section .section-content {
  display: grid;
  grid-template-columns: 50% 50%;
  align-items: center;
}

#section-8.section.text.right .col-left{
  order: 1;
}

#section-8.section .section-content .col-left{
  display: flex;
  justify-content: center;
  align-items: center;
}

#section-8.section .section-content .col-left .support-wrapper{
  width: 23.40vw;
  position: relative;
}

#section-8.section .image-wrapper,
#section-8.section .image-wrapper img,
#section-8.section .video,
#section-8.section .video video,
#section-8.section .video iframe{
  width: 37.78vw;
  height: 23.13vw;
  object-fit: cover;
  border-radius: 12px;
}

#section-8.section .title-wrapper {
  margin-bottom: 1.53vw;
}

#section-8.section .title-wrapper h4{
  color: #FFF;
  font-size: 22px;
  font-weight: 300;
  line-height: 109.091%;
}

#section-8.section .text-editor p{
  color: #B6B6B6;
  font-size: 18px;
  font-weight: 300;
  line-height: 122.222%;
}

#section-8.section .title-wrapper span {
  display: block;
  min-width: 6px;
  min-height: 6px;
  width: 0.42vw;
  height: 0.42vw;
  background-color: #79D825;
  border-radius: 50%;
  margin-top: 7px;
  position: absolute;
  left: -16px;
}



/* Section 9 Prcie list */



#section-9.section{
  margin-top: 1.81vw;
}

#syn.new-concept.freetrial #section-9.section{
  margin-top: 0;
}

#section-9.section .section-width{
  padding: 0 3.75vw 1.81vw;
}

#syn.new-concept.freetrial #section-9.section .section-width{
  padding: 0 3.75vw 5.56vw;
}

#section-9.section .section-content{
  border-top: 1px solid #2B2B2B;
  padding: 5.56vw 0 0;
}

#syn.new-concept.freetrial #section-9.section .section-content{
  border-top: none;
  padding: 0;
}

#section-9.section .title-wrapper {
  text-align: left;
  margin-bottom: 20px;
}

#section-9.section .section-content {
  display: flex;
  flex-direction: column;
  gap: 40px;
}



#section-9.section .repeater {
  display: grid;
  grid-template-columns: auto calc(30.07vw + 32px) 30.07vw;
  gap: 0;
}

#section-9.section .support-wrapper{
  position: relative;
}

#section-9.section .item {
  border-radius: 12px;
  position: relative;
  background-color: transparent;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  opacity: .7;
  transition: .3s;  
  overflow: hidden;
  height: 100%;
}

#section-9.section .item:hover{
  opacity: 1;
}

#section-9.section .support-wrapper.with-list{
  opacity: 1;
  border-top: none;
}

#section-9.section .item .background{
  width: 100%;
  height: 100%;
  background-color:#2B2B2B;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
  border-radius: 12px;
  transition: .3s; 
}

#section-9.section .support-wrapper:nth-child(2) .item .background{
  width: calc(100% - 32px);
  overflow: hidden;
}


#section-9.section .item .background:after {
  content: '';
  width: 100%;
  height: 5px;
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 12px 12px 0 0;
  transition: .3s;
  z-index: 1;
}

#section-9.section .item:hover .background:after{
  background-color: #79D825;
}

#section-9.section .support-wrapper.with-list .item .background{
  display: none;
} 

#section-9.section .recommended .recommended-badge {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #B6B6B6;
  padding: 8px 11px 7px;
  border-radius: 12px;
  text-align: center;
  z-index: 2;
}

#section-9.section .recommended .recommended-badge p{
  color: #1B1B1B;
  font-size: 12px;
  font-weight: 600;
  line-height: 110%;
  text-transform: uppercase;
}

#section-9.section .top-content {
  position: relative;
  z-index: 1;
  text-align: center;
}

#section-9.section .support-wrapper.with-list .item .product-name{
  text-align: left;  
}

#section-9.section .item .top-content{
  padding-top: 3.89vw;
}

#section-9.section .support-wrapper.with-list .item .top-content{
  padding-top: 0;
}

#section-9.section .item .product-name h4{
  color: #FFFFFF;
  font-size: 26px;
  font-weight: 300;
  line-height: 111.538%;
}

#section-9.section .item .price {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 32px 0;
}

#section-9.section .item .price h2{
  color: #FFF;
  font-size: 50px;
  font-weight: 200;
  line-height: 110%;
  margin-bottom: 0;
}

#section-9.section .item .price p{
  color: #FFF;
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
  display: block;
  margin-top: 2px;
}



#section-9.section .text-editor{
  padding: 1.46vw 0;
}

#section-9.section .text-editor p,
#section-9.section .text-editor p span{
  color: #B6B6B6;
  font-size: 12px;
  font-weight: 300;
  line-height: 125%;
}


#section-9.section .packages {
  text-align: center;
}

#section-9.section .support-wrapper.with-list .item .packages {
  text-align: left;
}

#section-9.section .packages .text {
  position: relative;
  padding: 29px 0;
  border-top: 1px solid #454545;
}

#section-9.section .packages .text p{
  color: #B6B6B6;
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
}

#section-9.section .button-section{
  justify-content: center;
}




/* Section - 10 - video */

#section-10.section .section-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#section-10.section .video{
  opacity: .5;
  transition: .5s;
  margin-bottom: 2.92vw;
}

#section-10.section .video:hover{
  opacity: 1;
}

#section-10.section .image-wrapper,
#section-10.section .image-wrapper img,
#section-10.section video,
#section-10.section iframe{
  width: 61.25vw;
  height: auto;
  border-radius: 12px;
  z-index: 1;
}

#section-10.section iframe{
  height: 31.94vw;
}

/* Video v2 */

#section-10.section.v2 {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/voices-left-shape.svg);
  background-size: contain;
  background-repeat: no-repeat;
}



#section-10.section.v2 .section-width{
  padding: 9.03vw 3.75vw;
  position: relative;
}

#section-10.section.v2 .section-width:before{
  content: '';
  width: 100%;
  height: 9.03vw;
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/voices-top-shape.svg);
  background-repeat: no-repeat;
}

#section-10.section.v2 .section-width:after{
  content: '';
  width: 15.83vw;
  height: 9.4vw;
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translate( -50%, 0);
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/bottom-element3.png);
  background-repeat: no-repeat;
  background-size: cover;
}

#section-10.section.v2 .video{
  opacity: 1;
  margin-bottom: 0;
}

#section-10.section.v2 video, 
#section-10.section.v2 iframe {
  border: 5px solid black;
}



.page-template-page-vocoflex #section-10.section{
  position: relative;
}

.page-template-page-vocoflex #section-10.section .section-width{
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.page-template-page-vocoflex #section-10.section .section-content{
  position: relative;
  border: none !important;
}

.page-template-page-vocoflex #section-10.section .section-content .border{
  background-color: #454545;
  width: calc(85.35vw - 7.5vw);
  height: 1px;
  padding: 0 3.75vw 0;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX( -50% );
}

.page-template-page-vocoflex #section-10.section .section-content .border.bottom{
  top: unset;
  bottom: 0;
}

.page-template-page-vocoflex  #section-10.section .video {
  width: 100%;
  display: flex;
  justify-content: center;
  position: relative;
}

.page-template-page-vocoflex  #section-10.section .video .video-thumbnail{
  position: relative;
  z-index: 1;
}

.page-template-page-vocoflex #section-10.section .element{
  position: absolute;
  transition: 1.7s;
}

.page-template-page-vocoflex #section-10.section .element img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* El 1 */

.page-template-page-vocoflex #section-10.section .element.e-1 {
  top: 11vw;
  left: -2vw;
  width: 8.61vw;
  height: 13.13vw;
  z-index: 1;
}

.page-template-page-vocoflex #section-10.section:hover .element.e-1 {
  transform: rotate(-9deg);
  top: 12vw;
  left: -2vw;
}

/* El 2 */

.page-template-page-vocoflex #section-10.section .element.e-2 {
  top: 7vw;
  left: -2.5vw;
  width: 49.44vw;
  height: 37.57vw;
}

.page-template-page-vocoflex #section-10.section:hover .element.e-2 {
  top: 8vw;
  left: -3.5vw;
  transform: rotate(8deg);
}

/* El 8 */

.page-template-page-vocoflex #section-10.section .element.e-8{
  top: 7.99vw;
  right: -6vw;
  width: 14.94vw;
  height: 13vw;
}

.page-template-page-vocoflex #section-10.section:hover .element.e-8 {
  top: 8vw;
  right: -6vw;
  transform: rotate(25deg);
}

/* El 9 */

.page-template-page-vocoflex #section-10.section .element.e-9{
  top: 37vw;
  left: 92vw;
  width: 1.18vw;
  height: 1.18vw;
  min-width: 17px;
  min-height: 17px;
}

.page-template-page-vocoflex #section-10.section:hover .element.e-9 {
  top: 38.5vw;
  left: 89vw;
}












/* Section - 11 - Voices carouzel price */


#section-11.section{
  margin-top: 1.81vw;
}

#section-11.section .section-width{
  padding: 0 3.75vw;
}

#section-11.section .section-content {
  padding: 5.56vw 0 0;
  display: grid;
  grid-template-columns: auto 61.25vw;
  justify-content: space-between;
  border-top: 1px solid #2B2B2B;
}

#section-11.section .section-content .title-wrapper h2{
  color: #B6B6B6;
}

#section-11.section .boxes {
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  background-color: #2B2B2B;
  opacity: .7;
  transition: .3s;
}

#section-11.section .boxes:hover{
  opacity: 1;
}

#section-11.section .top-content {
  padding: 3.06vw 0 2.67vw;
  text-align: center;
  width: 58.68vw;
  margin: auto;
  /* Remove the default border-bottom from here */
}

/* Add the border ONLY if .carousel-wrapper follows .top-content */
#section-11.section .top-content:has(+ .carousel-wrapper) {
  border-bottom: 1px solid #454545;
}

#section-11.section .product-name h4{
  color: #FFFFFF;
  font-size: 26px;
  font-weight: 300;
  line-height: 111.538%;
}

#section-11.section .price {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 32px 0;
}

#section-11.section .price h2{
  color: #FFF;
  font-size: 50px;
  font-weight: 200;
  line-height: 110%;
  margin-bottom: 0;
}

#section-11.section .price p{
  color: #FFF;
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
  display: block;
  margin-top: 2px;
}

#section-11.section .button-section{
  justify-content: center;
}


#section-11.section .carousel-wrapper{
  padding: 1.67vw 0;
  position: relative;
  overflow: hidden;
  border-radius: 12px;
}

#section-11.section .carousel-wrapper:before, 
#section-11.section .carousel-wrapper:after {
    content: '';
    width: 8.54vw;
    height: 10.21vw;
    display: block;
    position: absolute;
    top: 0;
    left: -1px;

    /* tux: remove the gradient */
    /*background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/shape-partners.svg');
    background-size: cover;
    background-repeat: no-repeat;*/

    z-index: 1;
}

#section-11.section .carousel-wrapper:after{
  right: -1px;
  left: unset;
  transform: rotate(180deg);
}


#section-11.section .carousel-description p{
  color: #B6B6B6;
  text-align: center;
  font-size: 12px;
  font-weight: 300;
  line-height: 125%;
}

#section-11.section .partners-carousel {
  margin-top: 1.88vw;
}

#section-11.section .carousel-item .support-wrapper{
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 6px;
}

#section-11.section .carousel-item .image{
  display: flex;
  justify-content: center;
}

#section-11.section .carousel-item .image img {
  height: 72px;
  object-fit: contain;
  filter: grayscale(1);
}

#section-11.section .carousel-item .name{
  display: none;
}

#section-11.section .carousel-item .name p{
  color: #A3A3A3;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 125% ;
}


#section-11.section .slick-slide>div {
  margin: 0 20px;
}








/* Section 12 - Bundles */

#section-12.section .section-width{
  padding: 14px 3.75vw 0;
}

#syn.new-concept.freetrial #section-12.section .section-width{
  padding-top: 0;
}

#section-12.section .section-content {
  display: grid ;
  grid-template-columns: auto 61.25vw;
  justify-content: space-between;
}

#section-12.section .section-content .title-wrapper h2{
  color: #B6B6B6;
}

#section-12.section .boxes {
    display: grid;
    /* Use calc to account for gaps when determining the 25% base width */
    grid-template-columns: repeat(auto-fit, minmax(calc(25% - 14px), 1fr));
    gap: 14px;
}

#section-12.section .boxes .button-section{
  justify-content: center;
  position: relative;
}

#section-12.section .item {
  position: relative;
  padding: 2.08vw 0;
  background: #2B2B2B;
  border-radius: 12px;
  opacity: .7;
  transition: .3s;
  overflow: hidden;
}


#section-12.section .item .background{
  width: 100%;
  height: 100%;
  background-color:#2B2B2B;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
  border-radius: 12px;
  transition: .3s; 
}

#section-12.section .item .background:after {
  content: '';
  width: 100%;
  height: 5px;
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 12px 12px 0 0;
  transition: .3s;
  z-index: 1;
}

#section-12.section .item:hover .background:after{
  background-color: #79D825;
}

#section-12.section .item:hover{
  opacity: 1;
}

/* Styl dla domyślnego ułożenia – do 3 obrazków */
#section-12.section .images {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 15px;
  position: relative;
}

#section-12.section .image img {
  width: 30px;
  height: 30px;
  object-fit: cover;
  border-radius: 2px;
  box-shadow: -1.536px 0px 7.298px 2.305px rgba(27, 27, 27, 0.40);
}


#section-12.section .images.stacked .image {
  position: relative;
}

#section-12.section .images.stacked .image:nth-child(n+4) {
  margin-left: -30px;
}


#section-12.section .box-title {
  margin: 1.74vw 0;
  position: relative;
}

#section-12.section .box-title h4{
  color: #B6B6B6;
  text-align: center;
  font-size: 16px;
  font-weight: 300;
  line-height: 125%;
}

#section-12.section .price {
  font-size: 16px;
  color: #B6B6B6;
  margin-bottom: 1.74vw;
  text-align: center;
  position: relative;
}

#section-12.section .price h2{
  color: #FFF;
  text-align: center;
  font-size: 40px;
  font-weight: 200;
  line-height: 110%;
  margin-bottom: 0;
}




/* Section 13 Ethical Way */

#section-13.section {
  margin-top: 1.81vw;
}

#section-13.section .section-width{
  padding-bottom: 0;
}

#section-13.section .section-content {
  padding: 5.56vw 0 0;
  border-top: 1px solid #2B2B2B;
}

#section-13.section.video .section-content{
  padding-top: 0;
  padding-bottom: 5.56vw;
  border-bottom: 1px solid #2B2B2B;
  border-top: none;
}

#section-13.section .image-wrapper,
#section-13.section .video {
  margin-bottom: 3.06vw;
  border-radius: 12px;
}

#section-13.section.video .video{
  margin-bottom: 0;
}

#section-13.section .image-wrapper,
#section-13.section .image-wrapper img,
#section-13.section .video video, 
#section-13.section .video iframe {
  width: 100%;
  /* tux: adjust the height of image for desktop */
  /* height: 27.43vw; */
  border-radius: 12px;
  object-fit: cover;
  object-position: top;
}

#section-13.section .box {
  display: grid;
  grid-template-columns: 29.79vw 37.85vw;
  justify-content: space-between;
}

#section-13.section .col-left h2{
  color: #FFF;
  font-size: 50px;
  font-weight: 200;
  line-height: 110%;
}

#section-13.section .image img {
  width: 104px;
  height: 70px;
  object-fit: cover;
}

#section-13.section .col-right .text-editor p{
  color: #B6B6B6;
  font-size: 18px;
  font-weight: 300;
  line-height: 122.222%;
}

#section-13.section.video .video,
#section-13.section.video .video iframe,
#section-13.section.video .video .video-thumbnail,
#section-13.section.video .video .video-thumbnail img.video-thumb{
 height: 39.17vw;
 border-radius: 12px;
}




/* Section 14 Ethical Way */



#section-14.section {
  margin-top: 1.81vw;
}

#section-14.section{
  position: relative;
}

#section-14.section .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 10.53vw; /* dostosuj w zależności od efektu, który chcesz osiągnąć */
  height: 100%;
  background: #1B1B1B; /* kolor tła – dopasuj do tła sekcji */
  z-index: 10;
  pointer-events: none; /* aby maska nie przechwytywała zdarzeń */
}

#section-14.section .section-content {
  padding: 5.56vw 0 0;
  border-top: 1px solid #2B2B2B;
  position: relative;
}

#section-14.section .video-carousel-wrapper{
  position: relative;
}

#section-14.section .item .support-wrapper{
  width: 37.92vw;
}

#section-14.section .video-carousel-wrapper .video,
#section-14.section .video-carousel-wrapper .video .video-thumbnail,
#section-14.section .video-carousel-wrapper .video .video-thumbnail img.video-thumb,
#section-14.section .video-carousel-wrapper .video img.wp-post-image,
#section-14.section .video-carousel-wrapper .video video,
#section-14.section .video-carousel-wrapper .video iframe{
  width: 100%;
  height: 21.32vw;
  max-height: 409px;
  object-fit: cover;
  border-radius: 12px;
}

#section-14.section .video-carousel-wrapper:before, 
#section-14.section .video-carousel-wrapper:after {
  content: '';
  width: 11vw;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: -11.5vw;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-left-gradient-section-14.svg);
  background-size: cover;
  background-repeat: no-repeat;
  z-index: 1;
}

#section-14.section .video-carousel-wrapper:after {
  width: 41.63vw;
  right: -11.6vw;
  left: unset;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-right-gradient-section-14.svg);
  transition: .5s;
}

#section-14.section .video-carousel-wrapper:hover:after{
  right: -24vw !important;
}

#section-14.section .video-carousel-wrapper .carousel-arrow{
  top: 7.92vw;
}

#section-14.section .video-carousel-wrapper .carousel-arrow .arrow{
  transform: none;
}

#section-14.section .carousel-arrow .arrow.arrow-right{
  right: 20px;
}


#section-14.section .video-carousel .slick-list {
  overflow: visible;
}

#section-14.section .video-carousel .slick-slide>div {
  margin: 0 24px 0 0;
}



#section-14.section .item{
  opacity: .7;
  transition: .3s;
  cursor: pointer;
}

#section-14.section .item:hover{
  opacity: 1;
}


#section-14.section .video {
  border-radius: 12px;
  position: relative;
}

#section-14.section .video-name p,
#section-14.section .author-name p{
  color: #FFFFFF;
  font-size: 18px;
  font-weight: 500;
  line-height: 122.222%;
}

#section-14.section .video-name {
  margin: 16px 0;
}

#section-14.section .author-name p{
  font-size: 16px;
  font-weight: 200;
}


#section-14.section .video iframe,
#section-14.section .video video {
  width: 100%;
  border-radius: 12px;
}

#section-14.section .video-name {
  text-align: left;
}

#section-14.section .author-name {
  text-align: left;
}



/* Section 14 - Carousel hero home */

#section-14.section.carousel-hero-home{
  margin-top: 0;
}

#section-14.section.carousel-hero-home .section-width{
  padding-top: 3.06vw;
}

#section-14.section.carousel-hero-home .section-content{
  padding: 0;
  border: none;
}

#section-14.section.carousel-hero-home .slick-dotted.slick-slider{
  margin-bottom: 0;
}

#section-14.section.carousel-hero-home .video-carousel .slick-slide>div {
  margin: 0 16px 0 0;
}

#section-14.section.carousel-hero-home .video-carousel #slick-slide01 .item .support-wrapper {
  background-color: #26262C;
  background-position: left;
}

#section-14.section.carousel-hero-home .video-carousel-wrapper:before{
  display: none;
}

#section-14.section.carousel-hero-home .video-carousel-wrapper:after{
  display: none;
}

#section-14.section.carousel-hero-home .video-carousel.hero .slick-slide {
  transition: opacity 1.4s linear, filter 1.4s linear;
}

#section-14.section.carousel-hero-home .item {
  opacity: 1;
  border-radius: 12px;
}

#section-14.section.carousel-hero-home .item .support-wrapper {
  display: grid;
  grid-template-columns: 36.39vw auto;
  gap: 30px;
  justify-content: space-between;
  width: 77.08vw;
  padding: 4.17vw 0;
  background-color: #201F1F;
  border-radius: 12px;
}

#section-14.section.carousel-hero-home .item .support-wrapper{
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
}

#section-14.section.carousel-hero-home .col-left{
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 4.17vw;
  height: 100%;
}

#section-14.section.carousel-hero-home .col-left h2{
  font-size: 40px;
  margin-bottom: 1.7vw;
}

#section-14.section.carousel-hero-home .col-left p{
  color: #B6B6B6;
  font-size: 16px;
  font-weight: 400;
  line-height: 125%;
  width: 25.76vw;
}

#section-14.section.carousel-hero-home .col-left .support-div{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  width: 100%;
}

#section-14.section.carousel-hero-home .col-left .slider-logo,
#section-14.section.carousel-hero-home .col-left .slider-logo img{
  height: 2.15vw;
  min-height: 31px;
  object-fit: contain;
}

#section-14.section.carousel-hero-home .col-right{
  display: flex;
  justify-content: center;
  align-items: center;
}

#section-14.section.carousel-hero-home .image-wrapper, 
#section-14.section.carousel-hero-home .image-wrapper img,
#section-14.section.carousel-hero-home .video,
#section-14.section.carousel-hero-home .video video,
#section-14.section.carousel-hero-home .video iframe{
  width: 100%;
  height: 28.82vw;
  object-fit: cover;
  border-radius: 12px;
}

#section-14.section.carousel-hero-home .slick-dots {
  bottom: -37px;
  left: 0;
  text-align: left;
}

#section-14.section.carousel-hero-home .slick-dots li,
#section-14.section.carousel-hero-home .slick-dots li button,
#section-14.section.carousel-hero-home .slick-dots li button:before{
  width: 7px;
  height: 7px;
  padding: 0;
}

#section-14.section.carousel-hero-home .slick-dots li {
  margin: 0 16px 0 0;
}

#section-14.section.carousel-hero-home .slick-dots li button:before{
  content: '';
  background-color: #2B2B2B;
  width: 7px;
  height: 7px;
  top: 0;
  left: 0;
  border-radius: 50%;
}

#section-14.section.carousel-hero-home .slick-dots li.slick-active button:before {
  background-color: #A3A3A3;
}



/*
.support-wrapper{
  filter: blur(20px);
}
.slick-active .support-wrapper{
  filter: none;
  transition: .3s;
}
*/


/* News and blog posts */

#section-14.section.blog-and-news{
  margin: 0;
}

#section-14.section.blog-and-news .section-width {
  padding-top: 3vw;
  padding-bottom: 0;
}

#section-14.section.blog-and-news .section-content {
  border: none;
  padding: 0;
}

#section-14.section.blog-and-news .carousel-arrow {
  top: 9.4vw;
}

#section-14.section.blog-and-news .video-carousel-wrapper:after,
#section-14.section.carousel-artist .video-carousel-wrapper:after{
  right: -11.2vw;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-home.png);
}

#section-14.section.blog-and-news .arrow.arrow-right {
  right: 0;
}

#section-14.section.blog-and-news .blog-post-carousel .slick-list {
  overflow: visible;
}

#section-14.section.blog-and-news .slick-slide>div {
  margin: 0 16px 0 0;
}

#section-14.section.blog-and-news .item{
  opacity: 1;
}

#section-14.section.blog-and-news .item .support-wrapper {
  width: 22.29vw;
}

#section-14.section.blog-and-news .title-wrapper h2{
  margin-bottom: 0;
}

#section-14.section.blog-and-news .item .post-thumbnail-wrapper{
  position: relative;
}

#section-14.section.blog-and-news .item .thumbnail-overlay-element{
  position: absolute;
  top: 20px;
  left: 20px;
}

#section-14.section.blog-and-news .item .thumbnail-overlay-element img{
  width: 1.94vw;
  min-width: 28px;
  height: 1.94vw;
  min-height: 28px;
  object-fit: contain;
}

#section-14.section.blog-and-news .item .thumbnail-overlay-element span.post-category{
  border-radius: 12px;
  background: #454545;
  padding: 8px 10px;
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
  color: #FFF;
}

.page-id-3049 #section-14.section.blog-and-news .item .thumbnail-overlay-element span.post-category{
  display: none;
}

#section-14.section.blog-and-news .item .post-thumbnail,
#section-14.section.blog-and-news .item .post-thumbnail img{
  width: 100%;
  height: 22.64vw;
  object-fit: cover;
  border-radius: 12px 12px 0 0;
}



/* posts */

#section-14.section.posts-loop-section .section-width{
  padding-top: 7.22vw;
  padding-bottom: 3.61vw;
}

#section-14.section.posts-loop-section h1{
  margin-bottom: 45px;
}

#section-14.section.posts-loop-section .description p{
  color: #B6B6B6;
  font-size: 26px;
  font-weight: 300;
  line-height: 111.538%;
}

#section-14.section.posts-loop-section .filter-wrapper {
  margin: 50px 0 80px;
}

.page-id-3049 #section-14.section.posts-loop-section .filter-wrapper{
  display: none;
}

#section-14.section.posts-loop-section .posts-loop {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 56px 74px;
  justify-content: space-between;
  padding-bottom: 5.56vw;
}

#section-14.section.posts-loop-section.video-posts .posts-loop {
  grid-template-columns: repeat(2, 1fr);
  gap: 56px 14px;
}

#section-14.section.posts-loop-section .item .support-wrapper {
  width: 100%;
}

#section-14.section.video-posts .item {
  opacity: .7;
}

#section-14.section.video-posts .item:hover{
  opacity: 1;
}


#section-14.section.video-posts .video,
#section-14.section.video-posts .video video,
#section-14.section.video-posts .video iframe,
#section-14.section.video-posts .video .video-thumbnail, 
#section-14.section.video-posts .video .video-thumbnail img.video-thumb, 
#section-14.section.video-posts .video img.wp-post-image{
  width: 100%;
  height: 20.00vw;
  object-fit: cover;
  border-radius: 12px;
}


.meta{
  background-color: #201F1F;
  border-radius: 0 0 12px 12px;
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;

}

.blog-and-news .meta{
  height: 15.64vw;
  max-height: 254px;
}

.category-artist-interviews .blog-and-news .meta{
  height: 14vw;
  min-height: 240px;
}

.page-id-3049  .blog-and-news .meta{
  height: auto;
  min-height: 175px;
}

.blog-and-news .meta h3.post-title{
  line-height: 122%;
}
 
.post-title a,
.post-excerpt p,
.post-date{
  color: #A3A3A3 !important;
  line-height: 125%;
  transition: .5s;
}

.item:hover .post-title a{
  color: #FFFFFF !important;
}

.post-title a{
  font-size: 18px;
  font-weight: 500;
}

.post-excerpt{
  margin-top: 15px;
}

.post-excerpt p{
  font-size: 16px;
  font-weight: 200;
}

.post-date{
  font-size: 12px;
}

.last{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.last .button-section a,
.filter-wrapper .button-section a{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  background-color: #A3A3A3;
  border-radius: 50%;
  position: relative;
  opacity: .6;
}

.last .button-section a img,
.filter-wrapper .button-section a img {
  position: absolute;
  left: 55%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: 13px;
}

.filter-wrapper .button-section a:hover,
.item:hover .button-section a{
  opacity: 1;
}


/* Filter */

.filter-wrapper{
  margin: 3.06vw 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.filter-wrapper .filter {
  display: flex;
  gap: 16px;
}

.filter-wrapper .filter button.filter-btn {
  padding: 6px 22px;
  border-radius: 12px;
  color: #1B1B1B;
  font-size: 16px;
  font-weight: 400;
  line-height: 125%;
  background-color: #454545;
  outline: none;
  border: none;
  transition: .5s;
  cursor: pointer;
  white-space: nowrap;
}

.filter-wrapper .filter button.filter-btn.active{
  background-color: #B6B6B6;
}

.filter-wrapper .filter button:hover{
  background-color: rgb(182, 182, 182, .6);
}

.filter-wrapper .button-section {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.filter-wrapper .button-section p {
  color: #B6B6B6 !important;
  transition: .5s;
  opacity: .6;
}

.filter-wrapper .button-section:hover p{
  opacity: 1;
}

.filter-wrapper .button-section:hover a{
  opacity: 1;
}




/* Artist carousel */

#section-14.section.carousel-artist{
  margin: 1.81vw 0;
}

#section-14.section.carousel-artist .section-content {
  padding: 5.56vw 0;
  border-bottom: 1px solid #2B2B2B;
}

#section-14.section.carousel-artist .video-carousel .slick-slide>div {
  margin: 0 16px 0 0;
}

#section-14.section.carousel-artist .item{
  opacity: 1;
}

#section-14.section.carousel-artist .item .support-wrapper {
  width: 14.24vw;
  background-color: #2B2B2B;
  padding: 18px;
  border-radius: 12px;
}

#section-14.section.carousel-artist .item .image-wrapper,
#section-14.section.carousel-artist .item .image-wrapper img{
  width: 100%;
  height: 11.67vw;
  object-fit: cover;
  border-radius: 12px;
}

#section-14.section.carousel-artist .name p,
#section-14.section.carousel-artist .text-editor p{
  color: #B6B6B6;
  text-align: center;
}

#section-14.section.carousel-artist .name p{
  font-size: 16px;
  font-weight: 500;
  line-height: 125%;
  margin: 20px 0;
}

#section-14.section.carousel-artist .text-editor p{
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
}

#section-14.section.carousel-artist .video-carousel-wrapper .carousel-arrow {
  top: 7.7vw;
}


@media (min-width: 1730px){

  #section-14.section.carousel-artist .text-editor p{
    max-width: 80%;
    margin: auto;
  }
  
}







/* Tutorial/reviews carousel */

#section-14.section.reviews-carousel,
#section-14.section.tutorial-carousel{
  margin: 0;
}

#section-14.section.tutorial-carousel{
  margin: 5.56vw 0 0;
}

#section-14.section.tutorial-carousel .section-width{
  padding-top: 0;
  padding-bottom: 5.56vw;
}

#section-14.section.reviews-carousel .section-width{
  padding-top: 5.56vw;
  padding-bottom: 0;
}

#section-14.section.reviews-carousel .section-content,
#section-14.section.tutorial-carousel .section-content {
  border: none;
  padding: 0;
}

.special-title .title-wrapper h2{
  margin-bottom: 0 !important; 
}

.special-title{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 3.06vw;
}

.special-title .button-section,
.button-section.special {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.special-title .button-section a,
.button-section.special a{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  background-color: #A3A3A3;
  border-radius: 50%;
  position: relative;
  opacity: .6;
}

.special-title .button-section a img,
.button-section.special a img {
  position: absolute;
  left: 55%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: 13px;
}

.special-title .button-section a:hover,
.button-section.special a:hover{
  opacity: 1;
}

.special-title .button-section p,
.button-section.special p {
  font-weight: 400;
  color: #B6B6B6 !important;
  opacity: .6;
  transition: .5s;
}

.item:hover .button-section p,
.special-title .button-section:hover p,
.button-section.special:hover p {
  opacity: 1;
}

.special-title .button-section:hover a,
.button-section.special:hover a{
  opacity: 1;
}



/* About us */


#about-us.section {
  margin: 1.81vw 0 0;
}

#about-us.section .section-width {
  padding: 4.31vw 3.75vw 0;
}

#about-us.section .section-content {
  padding: 5.56vw 0 0;
  border-top: 1px solid #2B2B2B;
 
}

#about-us.section .section-content .support-wrapper{
  padding: 2.78vw 3.47vw;
  background-color: #201F1F;
  display: grid;
  grid-template-columns: 32.01vw auto;
  height: 40.69vw;
  max-height: 586px;
  border-radius: 12px;
  position: relative;
  overflow: hidden;
}

#about-us.section .section-content .support-wrapper:after{
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 41.32vw;
  height: 100%;
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/about-us.png');
  background-position: top right;
  background-size: contain;
  background-repeat: no-repeat;
  transition: 1s;
}

#about-us.section .section-content .support-wrapper:hover:after {
  right: 2vw;
  transform: scale(1.1);
}

#about-us.section .section-content .support-wrapper:hover .button-section.special a{
  opacity: 1;
}

#about-us.section .section-content .support-wrapper:hover .button-section.special p{
  color: white !important;
}

#about-us.section .col-left{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#about-us.section h3{
  color: #FFF;
  font-size: 22px;
  font-weight: 300;
  letter-spacing: 0.22px;
  margin-bottom: 3.13vw;
}

#about-us.section h2{
  color: #FFF;
  font-size: 40px;
  font-weight: 300;
  line-height: 110%;
}



/* Product box */

#product-box.section{
  background-color: #201F1F;
  box-shadow: 0px 4px 25.9px 0px rgba(0, 0, 0, 0.04);
}

#product-box.section .section-width{
  padding: 6.94vw 3.75vw;
}

#product-box.section .box-wrapper{
  display: grid;
  grid-template-columns: 50% 50%;
  gap: 16px;
}

#product-box.section .box-wrapper .item{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-repeat: no-repeat;
  background-position: 0 65%;
  background-size: 100%;
  background-color: #1B1B1B;
  padding: 40px 30px;
  border-radius: 12px;
  transition: .5s;
  cursor: pointer;
}

#product-box.section .box-wrapper .item:hover{
  background-position: 0 35%;
}

#product-box.section .box-wrapper .title-wrapper{
  display: flex;
  gap: 20px;
  align-items: center;
}

.logo-product,
.logo-product img{
  width: 3.33vw;
  height: auto;
  object-fit: contain;
}

#product-box.section .box-wrapper h2{
  color: #B6B6B6;
  font-size: 26px;
  font-weight: 400;
  line-height: 111.538%;
  margin-bottom: 0;
  transition: .5s;
}

#product-box.section .box-wrapper .item:hover h2{
  color: #FFFFFF;
}

#product-box.section .box-wrapper .text-editor{
  width: 24.03vw;
  max-width: 346px;
  margin: 30px 0;
}

#product-box.section .box-wrapper p{
  color: #B6B6B6;
  font-size: 18px;
  font-weight: 400;
  line-height: 122.222%;
}

#product-box.section .box-wrapper .text-editor p{
  font-weight: 300;
}

#product-box.section .top{
  padding-right: 30px;
}

#product-box.section .middle{
  margin: 80px 0 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#product-box.section .middle .image-wrapper, 
#product-box.section .middle .image-wrapper img,
#product-box.section .middle .video,
#product-box.section .middle .video video,
#product-box.section .middle .video iframe{
  width: 100%;
  height: 16.94vw;
  object-fit: contain;
  border-radius: 12px;
}

#product-box.section .bottom{
 display: flex;
 justify-content: center;
 align-items: center;
}

#product-box.section .bottom .logo-bottom{
  width: 8.40vw;
}

#product-box.section .bottom .logo-bottom p{
  text-align: center;
  color: #CCC;
  font-size: 10.491px;
  font-weight: 500;
  line-height: 125%;
  margin-bottom: 0;
}

#product-box.section .bottom .logo-bottom img{
  width: 100%;
  height: 1.94vw;
  object-fit: contain;
  margin: auto;
}


















/* Section 15 static no field Image */

#section-15.section {
  margin-top: 1.81vw;
}

#section-15.section .section-width {
  padding: 5.56vw 0;
}

#section-15.section .section-content{
  display: flex;
  justify-content: center;
  align-items: center;
}

#section-15.section .section-content img{
  width: 54.93vw;
  object-fit: contain;
}







#section-18.section .section-content {
  display: flex;
  flex-direction: column;
}

#section-18.section .item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2.01vw 2.22vw;
  background-color: #201F1F;
  border-radius: 12px;
  margin-bottom: 1.11vw;
}

#section-18.section .text h4 {
  font-size: 26px;
  color: #FFFFFF; 
  font-weight: 300;
  line-height: 1.1;
}

#section-18.section .button-section a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 4.17vw;
  height: 4.17vw;
  background-color: #79D825;
  border-radius: 50%;
  position: relative;
}

#section-18.section .text h4,
#section-18.section .button-section a{
  opacity: .7;
  transition: .3s;
}

#section-18.section .item:hover .text h4,
#section-18.section .item:hover .button-section a{
  opacity: 1;
}


#section-18.section  .button-section.white a{
  background-color: #FFFFFF;
}

#section-18.section  .button-section a img{
  position: absolute;
  left: 55%;
  top: 50%;
  transform: translate(-50%, -50%);
  height: 1.6vw;
}






#section-19.section .section-width{
  padding: 1.81vw 3.75vw 3.75vw;
}

#section-19.section .boxes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.11vw;
}

#section-19.section .item {
  position: relative;
  border-radius: 12px;
}

#section-19.section .video {
  width: 100%;
  border-radius: 12px;
  position: relative;
}

#section-19.section .video:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/video-gradient.svg);
  background-size: cover;
  opacity: 1;
}

#section-19.section .video .video-thumbnail,
#section-19.section .video .video-thumbnail img.video-thumb,
#section-19.section .video iframe, 
#section-19.section .video video {
  width: 100%;
  height: 20vw;
  object-fit: cover;
  border-radius: 12px;
}

#section-19.section .video-name {
  position: absolute;
  top: 1.94vw;
  left: 2.22vw;
  z-index: 1;
}

#section-19.section .video-name h4{
  color: #FFFFFF;
  font-size: 20px;
  font-weight: 300;
  line-height: 110%;
  opacity: .7;
  transition: .3s;
}

#section-19.section .button-section.showmore{
  position: absolute;
  bottom: 1.94vw;
  left: 2.22vw;
  cursor: pointer;
  transition: .3s;
}

#section-19.section .item:hover .button-section.showmore{
  opacity: 1;
}

#section-19.section .item:hover .video-name h4{
  opacity: 1;
}




#section-22.section .section-width{
  padding-top: 3vw;
}

#section-22.section .section-content {
  padding-top: 5.56vw;
  border-top: 1px solid #2B2B2B;
}

#section-22.section .licenses-boxes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

#section-22.section .item {
  position: relative;
  height: 13.89vw;
  max-height: 230px;
  border-radius: 12px;
  padding: 1.94vw 2.22vw;
  background-color: #2B2B2B;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/license-1.svg');
  background-size: contain;
  background-position: 100%;
  background-repeat: no-repeat;
  transition: .7s;
}

#section-22.section .item:hover{
  background-position: 110%;
}

#section-22.section .item:nth-child(2):hover{
  background-position: 110%;
}

#section-22.section .item:nth-child(2){
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/license-2.svg');
}

#section-22.section .box-name{
  width: 18.68vw;
}

#section-22.section .box-name h4{
  color: #B6B6B6;
  font-size: 20px;
  font-weight: 300;
  line-height: 110%;
}

#section-22.section .button-section {
  justify-content: flex-start;
  opacity: .6;
}

#section-22.section .item:hover .button-section{
  opacity: 1;
}


/* Free trial boxes */


#syn.new-concept.freetrial{
  padding-bottom: 0;
}



#section-22.section.free-trial .section-width {
  padding-top: 2vw;
}

#section-22.section.free-trial .section-content{
  padding-top: 0;
  border: none;
}

#section-22.section.free-trial .top-box {
  position: relative;
  height: auto;
  border-radius: 12px;
  padding: 1.94vw 2.22vw;
  background-color: #2B2B2B;
  display: flex;
  gap: 27px;
  flex-direction: column;
  justify-content: space-between;
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/register-bg.png);
  background-size: contain;
  background-position: right 20px;
  background-repeat: no-repeat;
  margin-bottom: 16px;
}

#section-22.section.free-trial .top-box .content {
  display: grid;
  grid-template-columns: 50% 50%;
  gap: 16px;
}

#section-22.section.free-trial .top-box .content .text-editor p{
  color: #B6B6B6;
  font-size: 16px;
  line-height: 125%;
}

#section-22.section.free-trial .top-box .button-section {
  justify-content: center;
  opacity: 1;
}

#section-22.section.free-trial .top-box .button-section.green-v1 a{
  background: #79D825;
}

#section-22.section.free-trial .box-name {
  width: 18.68vw;
  display: flex;
  gap: 16px;
  align-items: center;
  opacity: .6;
  transition: .5s;
}

#section-22.section.free-trial .box-name h4 {
  color: #FFF;
  font-size: 20px;
  font-weight: 300;
  line-height: 110%;
}

#section-22.section.free-trial .item:hover .box-name{
  opacity: 1;
}

#section-22.section.free-trial .box-name img{
  width: 29px;
  height: 29px;
  object-fit: contain;
}

#section-22.section.free-trial .item {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/windows-bg.png);
  background-position: right 30px;
}

#section-22.section.free-trial .item:hover{
  background-position: right 20px;
}

#section-22.section.free-trial .item:nth-child(2) {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/mac-bg.png);
  background-position: right 10px;
}

#section-22.section.free-trial .item:hover:nth-child(2){
  background-position: right 0;
}

#section-22.section.free-trial .bottom-text{
  margin-top: 20px;
}

#section-22.section.free-trial .bottom-text p{
  color: #B6B6B6;
  font-size: 16px;
  font-weight: 300;
  line-height: 125%;
}










#section-23.section .section-width{
  padding-top: 0;
  padding-bottom: 1.81vw;
}

#section-23.section .section-content {
  border-top: 1px solid #2B2B2B;
  padding-top: 3.75vw;
}

#section-23.section .column {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

#section-23.section .column-name {
  margin-bottom: 1.94vw;
}

#section-23.section .column-name h4{
  color: #B6B6B6;
  font-size: 26px;
  font-weight: 300;
  line-height: 111.538%;
}

#section-23.section .list .text-editor {
  display: grid;
  grid-template-columns: 2.08vw auto;
  gap: 32px;
  align-items: center;
  padding: 2.08vw 2.22vw;
  background-color: #2B2B2B;
  margin-bottom: 16px;
  border-radius: 12px;
}

#section-23.section .list .text-editor p{
  color: #B6B6B6;
  font-size: 18px;
  font-weight: 300;
  line-height: 122.222%;
}

#section-23.section .item .image-wrapper{ 
  width: 2.08vw;
  height: 2.08vw;
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/terms-green.svg');
  background-size: contain;
  background-repeat: no-repeat;
}

#section-23.section .item:nth-child(2) .image-wrapper{ 
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/terms-red.svg');
}

#syn.new-concept.freetrial #section-23.section .section-width {
  padding-top: 0;
  padding-bottom: 4.44vw;
}



/* Single post */




.single #barba-wrapper{
  overflow: unset;
}




#syn.new-concept.single{
  padding-top: 83px;
}

#syn.new-concept.single .navigation {
  margin-top: 25px;
  background-color: #2B2B2B;
  border-radius: 12px;
}

#syn.new-concept.single .navigation a {
  display: block;
  padding: 20px 32px;
  border-top: 1px solid #454545;
  color: #B6B6B6 !important;
  font-size: 14px;
  font-weight: 400;
  line-height: 114.286%;
  transition: .5s;
  padding-left: 47px;
  text-indent: -15px;
}

#syn.new-concept.single .navigation a:hover{
  opacity: .5;
}

#syn.new-concept.single .navigation a:first-child{
  border: none;
}


.category-artist-interviews #syn.new-concept.single .navigation{
  display: none;
}








.single #section-14.section.blog-and-news .title-wrapper h2{
  margin-bottom: 3.06vw;
}



.single .col-left {
  position: relative; /* Zapewnia kontekst dla sticky */
}

.single .support-wrapper {
  position: sticky;
  top: 103px; /* lub inna wartość, która odpowiada Twojemu sticky menu */
}



.single-wrapper .col-right p{
  color: #B6B6B6 !important;
  font-size: 16px;
  font-weight: 300;
  line-height: 125%;
  margin-bottom: 20px;
}

.single-wrapper .single-section{
  margin: 36px 0;
}

.single-wrapper .col-right .single-section:nth-child(2){
  margin: 0 0 36px;
}

.single-wrapper .video-wrapper .video,
.single-wrapper .video-wrapper .video video,
.single-wrapper .video-wrapper .video iframe{
  width: 100%;
  height: 28.13vw;
  object-fit: cover;
  border-radius: 12px;
}

.single-wrapper .single-section.title{
  margin-top: 44px;
  padding-top: 44px;
  border-top: 1px solid #454545;
}

#syn.new-concept.single .title-wrapper h2{
  margin-bottom: 0;
  color: #FFF;
  font-size: 22px;
  font-weight: 300;
  line-height: 109.091%;
}

.single-wrapper .image-wrapper,
.single-wrapper .image-wrapper img{
  width: 100%;
  height: 28.13vw;
  object-fit: cover;
  border-radius: 12px;
}

.top-parts{
  margin-bottom: 18px;
}

.top-parts,
.column-repeater {
  display: grid;
  grid-template-columns: 15.49vw auto auto;
}

.column-repeater.columns-2{
  grid-template-columns: 15.49vw auto;
}

.column-repeater.columns-2 .column-item:nth-child(2):before {
  width: 100%;
  left: 0;
}

.top-parts .col-top,
.column-repeater .column-item{
  text-align: center
}

.top-parts .col-top p,
.column-repeater .column-item p{
  color: #B6B6B6;
  font-size: 14px;
  font-weight: 400;
  line-height: 114.286%;
  margin: 0;
}

.column-repeater .column-item{
  position: relative;
}

.column-repeater .column-item .text-item{
  position: relative;
  z-index: 1;
}

.column-repeater .column-item:nth-child(2):before,
.column-repeater .column-item:nth-child(3):before{
  content: '';
  width: 100%;
  height: 100%;
  border-radius: 12px;
  background-color: #2B2B2B;
  position: absolute;
  top: 0;
  left: 0;
}

.column-repeater .column-item:nth-child(2):before {
  width: calc(100% - 12px);
  left: 4px;
}

.column-repeater .column-item:nth-child(3):before {
  width: calc(100% - 8px);
  right: 0;
  left: unset;
}

.column-repeater .column-item p{
  border-top: 1px solid #454545;
  padding: 24px 0;
}

.top-parts .col-top:first-child,
.column-repeater .column-item:first-child{
  text-align: left;
}

.column-repeater .column-item .text-item:first-child p{
  border-top: none;
}


.top-parts .name p,
.top-parts .col-top:first-child p,
.column-repeater .column-item:first-child p{
  font-weight: 500;
}


/* Related post */

.related-post{
  overflow: hidden;
}

.related-post #section-14.section.blog-and-news .section-width{
  padding-top: 0;
}

.related-post #section-14.section.blog-and-news .section-content{
  border-top: 1px solid #454545;
  padding-top: 5.56vw;
}

.category-artist-interviews .related-post #section-14.section.blog-and-news .section-content{
  border: none;
}


/* About us */

#about-us-hero.section {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/romb.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  position: relative;
}

#about-us-hero.section .section-width{
  width: 100%;
  padding: 0;
}

#about-us-hero.section .section-width {
  position: relative;
  z-index: 1;
}

#about-us-hero.section .section-content {
  height: calc(100vh - 82px);
  display: flex;
  justify-content: center;
  align-items: center;
}

#about-us-hero.section .image-wrapper img{
  width: 100%;
  height: 6.11vw;
  min-height: 88px;
  object-fit: contain;
}

#about-us-hero.section .shape {
  position: absolute;
  opacity: 1;
  transition: opacity 2s ease-in-out;
  animation: fadeOut 2s ease-in-out forwards;
}

@keyframes fadeOut {
  from {
      opacity: 1;
  }
  to {
      opacity: 0;
  }
}


#about-us-hero.section .shape.top,
#about-us-hero.section .shape.left,
#about-us-hero.section .shape.right,
#about-us-hero.section .shape.bottom{
  top: 0;
  left: 0;
}

#about-us-hero.section .shape.left,
#about-us-hero.section .shape.right,
#about-us-hero.section .shape.left img,
#about-us-hero.section .shape.right img{
  height: calc(100vh - 82px);
}

#about-us-hero.section .shape.right{
  left: unset;
  right: 0;
}

#about-us-hero.section .shape.bottom{
  top: unset;
  bottom: 0;
  opacity: 1 !important;
}

/* right left */


.page-id-48 #section-8.section .section-width{
  padding: 5.56vw 3.75vw;
}

.page-id-48 #section-8.section.border-top .section-width{
  padding-top: 0;
}

.page-id-48 #section-8.section.border-top .section-content{
  border-top: 1px solid #2B2B2B;
  padding-top: 5.56vw;
}

.page-id-48 #section-8.section .col-right{
  display: flex;
  justify-content: flex-end;
}


.page-id-48 #section-8.section .image-wrapper, 
.page-id-48 #section-8.section .image-wrapper img, 
.page-id-48 #section-8.section .video, 
.page-id-48 #section-8.section .video video, 
.page-id-48 #section-8.section .video iframe {
  width: 37.78vw;
  height: 34.24vw;
  object-fit: cover;
  border-radius: 12px;
}


.page-id-48 #section-8.section .title-wrapper span{
  display: none;
}




/* About Us Three Box */

#about-us-three-box.section{
  background-color: #201F1F;
  padding: 4.72vw 0;
}

#about-us-three-box.section .section-width{
  padding: 0 3.75vw;
}


#about-us-three-box.section .boxes {
  display: grid
;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

#about-us-three-box.section .boxes .box{
  background-color: #1B1B1B;
  padding: 1.67vw;
  border-radius: 12px;
}

#about-us-three-box.section .boxes .box .image-wrapper{
  width: 100%;
  height: 17.36vw;
  min-height: 250px;
  background-color: #201F1F;
  position: relative;
  overflow: hidden;
  border-radius: 12px;
}

#about-us-three-box.section .boxes .box .image-wrapper:after,
#about-us-three-box.section .boxes .box:nth-child(2) .image-wrapper:before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-size: contain;
  background-repeat: no-repeat;
  transition: 1s;
}



/* Box 1 */

#about-us-three-box.section .boxes .box:nth-child(1) .image-wrapper:after {
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/box-1.png');
  transform: scale(1);
}

#about-us-three-box.section .boxes .box:nth-child(1) .image-wrapper:hover:after{
  top: 10%;
  transform: scale(1.1);
}



/* Box 2 */

#about-us-three-box.section .boxes .box:nth-child(2) .image-wrapper:after {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/box-2a.png);
}

#about-us-three-box.section .boxes .box:nth-child(2) .image-wrapper:hover:after {
  left: -6%;
}


#about-us-three-box.section .boxes .box:nth-child(2) .image-wrapper:before {
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/box-2b.png');
  left: unset;
  right: 0;
  background-position: right;
}

#about-us-three-box.section .boxes .box:nth-child(2) .image-wrapper:hover:before {
  right: -6%;
}

/* Box 3 */

#about-us-three-box.section .boxes .box:nth-child(3) .image-wrapper:after {
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/box-3.png');
}

#about-us-three-box.section .boxes .box:nth-child(3) .image-wrapper:hover:after {
  left: -15%;
}

#about-us-three-box.section .boxes .box .text-editor{
  margin-top: 1.67vw;
}

#about-us-three-box.section .boxes .box p{
  color: #B6B6B6;
  font-size: 18px;
  font-weight: 300;
  line-height: 122.222%;
}



/* Section About us */

.page-id-48 #about-us.section{
  margin-top: 0;
}

.page-id-48 #about-us.section .section-content {
  border: 0;
  padding: 0;
}

.page-id-48 #about-us.section .section-content .support-wrapper:after{
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/us-last.png');
  background-size: cover;
  min-width: 700px;
}

.page-id-48 #about-us.section .section-content .support-wrapper:hover:after {
  right: -5%;
  transform: scale(1);
}


/* Contact */

#page-title.section .section-width{
  padding: 7.22vw 3.75vw 5.56vw;
}

#page-title.section .section-width h1{
  margin-bottom: 0;
}

.page-id-54 #section-18.section .section-width{
  padding: 0 3.75vw;
}



#contact-info.section .section-width{
  padding-top: 4.44vw;
  padding-bottom: 0;
}

#contact-info.section .section-content{
  border-top: 1px solid #2B2B2B;
  padding-top: 5.56vw;
}

#contact-info.section .contact-info {
  display: grid;
  grid-template-columns: 42.15vw auto;
  gap: 4.58vw;
}

#contact-info.section .contact-info .item {
  display: grid;
  grid-template-columns: auto 20.14vw;
}

#contact-info.section .contact-info .item .col{
  padding: 24px 0;
  border-bottom: 1px solid #454545;
}

#contact-info.section .contact-info .item .col p{
  color: #B6B6B6;
  font-size: 14px;
  font-weight: 400;
  line-height: 114.286%;
}

#contact-info.section .contact-info .item:last-child .col{
  border: none;
}

#contact-info.section .contact-info .item .col-right{
  text-align: center;
  padding: 24px;
  background-color: #2B2B2B;
}

#contact-info.section .contact-info .item:first-child .col-right{
  border-radius: 12px 12px 0 0;
}

#contact-info.section .contact-info .item:last-child .col-right{
  border-radius: 0 0 12px 12px;
}

#contact-info.section .item a{
  color: #B6B6B6;
  text-decoration: underline;
}

#contact-info.section .contact-info .image-wrapper.map iframe{
  border-radius: 12px;
  height: 46.39vw;
  filter: grayscale(1);
}


/* Privacy policy */

#syn.new-concept.single.pp .section-width {
  padding: 7.22vw 3.75vw 0;
}

#syn.new-concept.single.pp .page-title-wrapper{
  margin-bottom: 5.56vw;
}

#syn.new-concept.single.pp .page-title-wrapper h1{
  margin-bottom: 3.06vw;
}

#syn.new-concept.single.pp .page-title-wrapper h2{
  color: #B6B6B6;
  font-size: 26px;
  font-weight: 300;
  line-height: 111.538%;
}

#syn.new-concept.single.pp .navigation{
  margin-top: 0;
}

#syn.new-concept.single.pp .single-wrapper .single-section {
  margin: 20px 0 36px;
}

#syn.new-concept.single.pp .single-wrapper .single-section.title {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
  margin-bottom: 0;
}

#syn.new-concept.single.pp .single-wrapper .col-right h2 {
  font-size: 18px;
  font-weight: 500;
  line-height: 122%;
  margin-bottom: -18px;
  color: #B6B6B6 !important;
}

#syn.new-concept.single.pp .single-wrapper .col-right p {
  font-size: 18px;
  font-weight: 300;
  line-height: 122%;
  margin-bottom: 20px;
}




/* Vocoflex */


.page-template-page-vocoflex .header-container,
.page-template-page-vocoflex #syn.new-concept,
.page-template-page-vocoflex footer,
.page-template-page-vocoflex-eula .header-container,
.page-template-page-vocoflex-eula #syn.new-concept,
.page-template-page-vocoflex-eula footer{
  background: #26262C;
}

.page-template-page-vocoflex .synthesizer-header,
.page-template-page-vocoflex-eula .synthesizer-header {
  box-shadow: 0px 4px 12px 0px rgba(34, 34, 41, 0.80);
}

.page-template-page-vocoflex .header-container.second .logo, 
.page-template-page-vocoflex .header-container.second .logo img,
.page-template-page-vocoflex-eula .header-container.second .logo, 
.page-template-page-vocoflex-eula .header-container.second .logo img {
  width: 6.04vw;
  min-width: 87px;
}

.page-template-page-vocoflex .header-container.second .buttons .button-section a,
.page-template-page-vocoflex .header-container.second .buttons .button-section a {
  background: #FAA55E;
}

.page-template-page-vocoflex .button-section.green-v1 a {
  background: #FFF;
}

#syn.new-concept.vocoflex {
  padding-top: 140px;
}



/* section 1 */

#syn.new-concept.vocoflex #section-1.section {
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/section-1-voco-bg.png');
  background-size: cover;
  background-position: center;
}

#syn.new-concept.vocoflex #section-1.section .section-width {
  padding-bottom: 8.13vw;
}

#syn.new-concept.vocoflex #section-1.section .image-wrapper img {
  width: 18.19vw;
}

#syn.new-concept.vocoflex #section-1.section .text-editor {
  margin-bottom: 3.06vw;
}



#syn.new-concept.vocoflex #section-1.section video, 
#syn.new-concept.vocoflex #section-1.section iframe {
  width: 61.25vw;
  height: 32.92vw;
  box-shadow: 0 0 10px 20px #26262C;
}



/* section 2 */

#syn.new-concept.vocoflex #section-2.section .section-width{
  padding-bottom: 5.56vw;
  padding-top: 0;
}

#syn.new-concept.vocoflex #section-2.section .testimonials-carousel .item .support-wrapper:before {
  background-color: #33333D;
}

#syn.new-concept.vocoflex #section-2.section .testimonials-wrapper:before, 
#syn.new-concept.vocoflex #section-2.section .testimonials-wrapper:after {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/sahpe-gradient-vocoflex.png);
  width: 18.61vw;
}

#syn.new-concept.vocoflex .carousel-arrow .arrow img:hover {
  background-color: #26262C;
}



/* section 3 */

#syn.new-concept.vocoflex #section-3.section .section-content{
  display: flex;
  justify-content: center;
}

#syn.new-concept.vocoflex #section-3.section .section-width .image-wrapper:before{
  display: none;
}

#syn.new-concept.vocoflex #section-3.section .section-width .image-wrapper,
#syn.new-concept.vocoflex #section-3.section .section-width .image-wrapper img {
  width: 62.08vw;
  height: 39.79vw;
  object-fit: cover;
}



/* section 7 */

#section-7.section .section-width {
  padding-bottom: 1.60vw;
}

#syn.new-concept.vocoflex #section-7.section .section-content {
  padding-top: 1.81vw;
  border-top: none;
}

#syn.new-concept.vocoflex #section-7.section .text-editor h2{
  color: #B6B6B6;
  font-size: 40px;
  font-weight: 300;
  line-height: 110%;
  margin: 0;
}



/* section 8 */

#syn.new-concept.vocoflex #section-8.section .section-width {
  padding: 3.47vw;
}

#syn.new-concept.vocoflex #section-8.section .title-wrapper span {
  background-color: #FAA55E;
}


/* section 10 */

#syn.new-concept.vocoflex #section-10.section .section-width{
  padding-top: 5.56vw;
  padding-bottom: 5.56vw;
}

#syn.new-concept.vocoflex #section-10.section .section-content{
  padding-top: 5.56vw;
  padding-bottom: 5.56vw;
  border-top: 1px solid #454545;
  border-bottom: 1px solid #454545;
}

#syn.new-concept.vocoflex #section-10.section .video {
  padding: 4.17vw 0;
  margin: 0;
  opacity: 1;
}

#syn.new-concept.vocoflex #section-10.section iframe,
#syn.new-concept.vocoflex #section-10.section .video-thumbnail,
#syn.new-concept.vocoflex #section-10.section .video-thumbnail img.video-thumb {
  width: 61.32vw;
  height: 39.31vw;
}


/* Animation text */

#animation-text.section{
  position: relative;
}

#animation-text.section .section-width {
  padding-top: 15.28vw;
  padding-bottom: 17.64vw;
}

#animation-text.section .animation-wrapper {
  position: relative;
}

#animation-text.section .item{
  display: flex;
  justify-content: center;
  text-align: center;
  opacity: 0;
  transition: opacity 1.5s ease;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate( -50%, -50% );
  z-index: 1;
}

#animation-text.section .animation-wrapper .item.active {
  opacity: 1;
}

#animation-text.section .item h2 {
  color: #E5E5E5;
  font-size: 40px;
  font-weight: 300;
  width: 58.40vw;
  line-height: 110%;
  margin: 0;
}

#animation-text.section .item h2 b{
  font-weight: 500;
}



#animation-text .element{
  position: absolute;
  transition: 1.7s;
}

#animation-text .element img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* El 1 */

#animation-text .element.e-1 {
  top: 0;
  left: 0;
  width: 8.61vw;
  height: 13.13vw;
  z-index: 1;
}

#animation-text:hover .element.e-1 {
  transform: rotate(-17deg);
  top: -2vw;
}

/* El 2 */

#animation-text .element.e-2{
  top: 0;
  left: 0;
  width: 49.03vw;
  height: 41.53vw;
} 

#animation-text:hover .element.e-2 {
  top: 1vw;
  transform: rotate(-4deg);
}

/* El 3 */

#animation-text .element.e-3{
  top: 22.36vw;
  left: 12.29vw;
  width: 2.71vw;
  height: 2.71vw;
  min-width: 39px;
  min-height: 39px;
}

#animation-text:hover .element.e-3 {
  top: 25.72vw;
  left: 7.21vw;
}

/* El 4 */

#animation-text .element.e-4{
  top: 8.06vw;
  left: 37.22vw;
  width: 3.40vw;
  height: 3.40vw;
  min-width: 49px;
  min-height: 49px;
}

#animation-text:hover .element.e-4 {
  top: 5.76vw;
  left: 38.33vw;
}

/* El 5 */

#animation-text .element.e-5{
  top: 25.83vw;
  left: 57.71vw;
  width: 1.81vw;
  height: 1.81vw;
  min-width: 26px;
  min-height: 26px;
}

#animation-text:hover .element.e-5 {
  top: 33.82vw;
  left: 60.14vw;
}

/* El 6 */

#animation-text .element.e-6{
  top: 10.90vw;
  left: 81.60vw;
  width: 1.32vw;
  height: 1.32vw;
  min-width: 19px;
  min-height: 19px;
}

#animation-text:hover .element.e-6 {
  top: 9.93vw;
  left: 82.85vw;
}

/* El 7 */

#animation-text .element.e-7 {
  top: 11.2vw;
  right: -1vw;
  width: 18.26vw;
  height: 36.53vw;
}

#animation-text:hover .element.e-7 {
  transform: rotate(5deg);
  top: 10.8vw;
  right: -.6vw;
}


/* El 8 */

#animation-text .element.e-8{
  top: 7.99vw;
  right: 0;
  width: 16.94vw;
  height: 18.54vw;
}

#animation-text:hover .element.e-8 {
  top: 10vw;
  right: -1vw;
  transform: rotate(-15deg);
}

/* El 9 */

#animation-text .element.e-9{
  top: 35.69vw;
  left: 91.11vw;
  width: 1.46vw;
  height: 1.46vw;
  min-width: 21px;
  min-height: 21px;
}

#animation-text:hover .element.e-9 {
  top: 37.15vw;
  left: 91.11vw;
}



/* Price list */

#price-list.section .section-width{
  padding-top: 0;
  padding-bottom: 0;
}

#price-list.section .section-content{
  display: grid;
  grid-template-columns: auto 61.32vw;
  justify-content: space-between;
  gap: 20px;
}

#price-list.section .section-content h2{
  color: #B6B6B6;
}

#price-list.section .top-col{
  border-radius: 12px;
  background: #292930;
  padding: 3.75vw;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

#price-list.section .top-col .support-wrapper {
  width: 34.10vw;
  max-width: 450px;
}

#price-list.section .product-name h4 {
  color: #FFFFFF;
  font-size: 26px;
  font-weight: 300;
  line-height: 111.538%;
}

#price-list.section .price {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 32px 0;
}

#price-list.section .price h2 {
  color: #FFF;
  font-size: 50px;
  font-weight: 200;
  line-height: 110%;
  margin-bottom: 0;
}

#price-list.section .price p {
  color: #FFF;
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
  display: block;
  margin-top: 2px;
}

#price-list.section .button-section {
  justify-content: center;
}

#price-list.section .button-section a{
  background-color: #FAA55E;
}

#price-list.section .text-editor{
  margin-top: 20px;
}

#price-list.section .text-editor p{
  color: #B6B6B6;
  font-size: 12px;
  font-weight: 300;
  line-height: 125%;
}

#price-list.section .two-col {
  display: grid;
  grid-template-columns: auto auto;
  gap: 20px;
  margin-top: 20px;
}

#price-list.section .two-col .title{
  display: flex;
  justify-content: center;
  align-items: center;
}

#price-list.section .two-col .title h5{
  margin: 0;
  color: #FAA55E;
  text-align: center;
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
  margin-bottom: 18px;
}

#price-list.section .two-col .col .list{
  border-radius: 12px;
  background: #292930;
  text-align: center;
}

#price-list.section .two-col .col .list .text {
  padding: 24px;
  border-bottom: 1px solid #454545;
}

#price-list.section .two-col .col.right .list .text:first-child{
  padding: 40px 24px;
}

#price-list.section .two-col .col .list .text:last-child{
  border: none;
}

#price-list.section .two-col .col p{
  color: #F9F9F9;
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
}

#price-list.section .two-col .col p b{
  font-weight: 500;
}




/* Specifications */

#price-list.section.specifications{
  margin-top: 5.56vw;
}

#price-list.section.specifications .section-content{
  border-top: 1px solid #2B2B2B;
  padding-top: 5.56vw;
}

#price-list.section.specifications .two-col{
  grid-template-columns: 100%;
  margin-top: 0;
  gap: 0;
}

#price-list.section.specifications .two-col .col .list {
  background: #2B2B2B;
}

#price-list.section.specifications .two-col .col p {
  color: #B6B6B6;
}








/* Simple content */

#simple-content.section .section-width{
  padding-top: 5.56vw;
}

#simple-content.section .title-wrapper h2{
  font-size: 40px;
  margin-bottom: 4vw;
}

#simple-content.section .section-content{
  padding-top: 5.56vw;
  border-top: 1px solid #454545;
}

#simple-content.section .section-content .support-wrapper {
  display: grid;
  grid-template-columns: auto 37.78vw;
  justify-content: space-between;
  align-items: center;
  gap: 5.97vw;
}

#simple-content.section .text-editor p{
  color: #B6B6B6;
  font-size: 18px;
  line-height: 122.222%;
}

#simple-content.section .image-wrapper,
#simple-content.section .image-wrapper img{
  width: 100%;
  height: 24.03vw;
  object-fit: cover;
  object-position: center;
  border-radius: 12px;
}


/* Faq */

#questions-answers.section{
  margin-top: 1.81vw;
}

#questions-answers.section .section-width{
  padding-top: 0;
  padding-bottom: 0;
}

#questions-answers.section .section-content{
  padding-top: 5.56vw;
  border-top: 1px solid #454545;
}

#questions-answers.section .title-wrapper h2{
  font-size: 40px;
}

.faq{
  display: grid;
  gap: 16px;
}

.faq .item {
  padding: 29px 32px;
  background-color: #292930;
  border-radius: 12px;
  cursor: pointer;
  transition: .5s;
}

.faq .item:hover,
.faq .item.active{
  background-color: #33333D;
}

.faq .item .question {
  display: flex;  
  justify-content: space-between;
  align-items: center;
  &:hover * {
    text-decoration: underline;
  }
}

#syn.new-concept.vocoflex .faq .item p{
  color: #B6B6B6;
}

.faq .item .question p{
  font-size: 20px;
  line-height: 110%;
  font-weight: 300;
  transition: .5s;
}

#syn.new-concept.vocoflex .faq .item.active .question p{
  color: #FFFFFF;
}

.faq .item .question .icon,
.faq .item .question .icon img{
  width: 31px;
  height: 31px;
  object-fit: contain;
}

.faq .item .question .icon img{
  transition: .5s;
}

.faq .item:hover .question .icon img{
  transform: rotate(90deg);
}

.faq .item.active .question .icon img{
  transform: rotate(180deg);
}

.faq .item .answer p{
  padding-top: 28px;
  font-size: 18px;
  font-weight: 300;
  line-height: 122.222%;
}

.faq .item .answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease;
}

.faq .item.active .answer {
  max-height: 1000px;
}

.faq .item.active .question {

}



/* CTA */

#syn.new-concept.vocoflex #section-16.section.cta .section-width {
  background-color: #242429;
}




/* Page title */


#syn.new-concept.vocoflex #page-title.section .section-width{
  padding: 3.75vw 3.75vw 5.56vw;
}

#syn.new-concept.vocoflex #page-title.section .section-width h1{
  margin-bottom: 3.47vw;
}

#syn.new-concept.vocoflex #page-title.section .section-width h2{
  margin-bottom: 0;
  color: #B6B6B6;
}


/* Simple WYSIWYG */

#simple_wysiwyg.section .section-width {
  padding-top: 0;
}

#syn.new-concept.vocoflex #simple_wysiwyg.section .section-width {
  padding-bottom: 0;
}

#simple_wysiwyg.section .section-width .text-editor p{
  color: #B6B6B6;
  font-size: 18px;
  font-weight: 300;
  line-height: 122.222%;
  margin-bottom: 20px;
}

#simple_wysiwyg.section li{
  color: #B6B6B6;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 300;
}

#simple_wysiwyg.section ol{
  padding-left: 20px;
}

#simple_wysiwyg.section ol li {
  list-style: decimal;
}

#simple_wysiwyg.section ol li ol li {
  list-style: lower-alpha;
  margin-bottom: 0;
}





/* Cookie banner */


.cmp.cb.desktop .main-wrapper .sections .sections-body:after, 
.cmp.cb.tablet .main-wrapper .sections .sections-body:after{
  display: none;
}




























@media (max-width: 1440px){

  #syn.new-concept.synthesizer {
    padding-top: 128px;
  }

}



@media (max-width: 991px){

  .hamburger,
  .overlay-section {
    display: flex;
  }

  .mobile {
    display: block;
  }

  .desktop{
    display: none;
  }

  .voice_db_filters.desktop{
    display: none !important;
  }

  .shape-bg{
    display: block;
    position: fixed;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: #201F1F;
    z-index: 1;
    opacity: 0;
    transition: .5s;
    visibility: hidden;
  }

  .shape-bg.active{
    opacity: .5;
    visibility: visible;
  }

  #syn.new-concept {
    padding-top: 66px;
  }

  #syn.new-concept.synthesizer {
    padding-top: 46.51vw;
  }

  #syn.new-concept.voices,
  #syn.new-concept.help-resources,
  #syn.new-concept.terms,
  #syn.new-concept.freetrial{
    padding-top: 39.53vw;
  }

  #syn.new-concept.voices #section-7.section .section-width,
  #syn.new-concept.help-resources #section-7.section .section-width,
  #syn.new-concept.terms #section-7.section .section-width,
  #syn.new-concept.freetrial #section-7.section .section-width{
    padding-top: 11.63vw;
  }

  #syn.new-concept.freetrial #section-7.section.number-4 .section-width{

  }

  .header-container {
    padding: 18px 20px;
    grid-template-columns: 32% 7.28vw 32%;
    box-shadow: none;
  }

  .header-container .shape-bg{
    position: absolute;
    z-index: 1;
  }

  .header-container .logo, 
  .header-container .logo img {
    width: 26.51vw;
    min-width: 114px;
  }

  .last-part{
    order: 3;
    gap: 30px;
  }

  .last-part .store span {
    display: none;
  }

  .language{
    gap: 0;
  }

  .language ul.bogo-language-switcher.list-view{
    width: 90.70vw;
    padding: 0;
    top: 230% !important;
    z-index: 999;
  }

  .language:hover ul.bogo-language-switcher.list-view{
    opacity: 0;
    visibility: hidden;
  }
  
  .language.active ul.bogo-language-switcher.list-view{
    opacity: 1 !important;
    visibility: visible !important;
  }




  .hamburger{
    order: 2;
  }

  .header-spMenu {
    display: block;
    padding-top: 0;
  }




  .synthesizer-header .header-container.first{
    position: relative;
    z-index: 6;
  }

  .synthesizer-header .header-container.second{
    grid-template-columns: 100%;
    padding: 0;
  }

  /*
  .synthesizer-header .header-container.second .header-menu {
    opacity: 0;
    animation: fadeIn 0.5s ease-in-out 1s forwards;
  }
  
  @keyframes fadeIn {
    to { opacity: 1; }
  }

  */

  .header-container.second .logo {
    width: 100% !important;
    padding: 13px 20px;
    display: flex;
    justify-content: center;
    border-bottom: 1px solid #454545;
  }

  .header-container.second .logo img {
    width: 50.47vw;
    min-width: 217px;
  }

  .synth-menu {
    padding: 20px 0 0;
  }

  .synthesizer-header .header-container.second .header-menu{
    justify-content: flex-start;
    overflow: auto;
    gap: 20px;
    padding-left: 36px;
    padding-right: 20px;
  }

  .synthesizer-header .header-container.second .header-menu li,
  .synthesizer-header .header-container.second .header-menu li a{
    padding: 0;
  }

  .synthesizer-header .header-container.second .header-menu li a{
    font-size: 14px;
    white-space: nowrap;
    padding-bottom: 18px;
  }

  .header-container.second .buttons{
    display: none;
  }



  #syn.new-concept .section-width {
    width: 100%;
    padding: 20px;
    margin: 0 auto;
  }

  #syn.new-concept h2 {
    margin-bottom: 7.44vw;
    font-size: 18px;
    line-height: 1.2;
    color: #FFFFFF;
  }



  #section-1.section {
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/hero-1.png);
    margin-bottom: 4vw;
    background-position: bottom;
  }

  #section-1.section .section-width {
    padding-bottom: 18vw !important;
  }

  #section-1.section .text-editor {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

  #section-1.section .image-wrapper img {
    width: 78.14vw;
    margin-bottom: 8.37vw;
  }

  #section-1.section .text-editor h4{
    font-size: 18px;
    margin-bottom: 5.58vw;
    line-height: 1.2;
  }

  #section-1.section .text-editor p {
    font-size: 18px;
  }

  #section-1.section .text-editor {
      margin-bottom: 12.09vw;
  }

  #section-1.section .video {
    margin-top: calc(10vw + 36px);
    width: 100%;
  }

  #section-1.section video, 
  #section-1.section iframe, 
  #section-1.section .video-thumbnail, 
  #section-1.section img.video-thumb {
    height: 46.51vw;
    width: 100% !important;
  }

  #section-1.section .button-container {
    transition: top 0.3s linear;
    padding-bottom: 10vw;
    gap: 0;
    z-index: 999;
  }

  #section-1.section .button-container.fixed-style {
    
  }

  #section-1.section .button-section.green-v1 a{
    opacity: 1;
  }




















  #section-2.section .testimonials-wrapper:before{
    display: none;
  }

  #section-2.section .testimonials-wrapper:after {
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/gradient-mobile-testi.png);
    right: -20px;
    width: 16.51vw;
    transform: rotate(0);
  }

  #syn.new-concept.vocoflex #section-2.section .testimonials-wrapper:after{
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/mobile-gradient-vocoflex.png);
  }


  #section-2.section .testimonials-wrapper .slick-list .slick-slide>div {
    margin: 0 2.78vw 0 0;
  }

  #section-2.section .testimonials-carousel .item .support-wrapper:before {
    width: 100%;
  }

  #section-2.section .slick-slide > div, 
  #section-2.section .slick-slide .item, 
  #section-2.section .slick-slide .item .support-wrapper {
    height: auto;
  }

  #section-2.section .image-wrapper, 
  #section-2.section .image-wrapper img, 
  #section-2.section .video, 
  #section-2.section .video video, 
  #section-2.section .video iframe {
    width: 69.77vw;
    height: 36.74vw;
  }

  #section-2.section .testimonials-carousel .item .support-wrapper {
    grid-template-columns: 100%;
    width: 77.21vw;
    gap: 40px;
    padding: 4.42vw 3.72vw;
  }

  #section-2.section .text-column {
    min-height: 280px;
  }

  #section-2.section .person-info {
    grid-template-columns: 15.35vw auto;
    margin-top: 6.51vw;
    align-items: flex-start;
  }


  #section-2.section .person-image .person img {
    width: 15.35vw;
    height: 15.35vw;
  }

  #section-2.section .testimonials-wrapper .carousel-arrow{
    display: none;
  }










  #section-4.section .support-wrapper {
    grid-template-columns: 100%;
    gap: 7.44vw;
  }


  .tabs-wrapper {
    overflow: hidden;
    position: relative;
    width: 100%;
  }
  
  .tabs {
    display: flex;
    flex-wrap: nowrap;
    transition: margin-left 0.3s ease;
    margin-bottom: 32px;
    overflow: auto;
  }

  .tabs::-webkit-scrollbar,
  .synthesizer-header .header-container.second .header-menu::-webkit-scrollbar {
    display: none;
  }
  
  .tabs .tab {
    flex: 0 0 auto;
    cursor: pointer;
    padding: 6px 22px;
    border-radius: 12px;
    background: #454545;
    margin-right: 16px;
    transition: background 0.3s;
  }
  
  .tabs .tab p {
    font-size: 16px;
    color: #1B1B1B !important;
  }
  
  .tabs .tab.active,
  .tabs .tab:hover {
    background: #B6B6B6;
  }
  
  /* Panele – przykładowe style */
  .tab-content { /* Twój styl kontenera paneli */ 
    padding-right: 20px;
  }
  .tab-panel { display: none; opacity: 0; transition: opacity 0.2s ease; }
  .tab-panel.active { display: block; opacity: 1; }
  
  


  #syn.new-concept #section-4.section .section-width{
    padding-right: 0;
    padding-left: 0;
  }


  #syn.new-concept #section-4.section .section-width .title-wrapper,
  .tabs,
  .tab-content{
    padding-left: 20px;
  }



  #section-4.section .col-left .image-wrapper, 
  #section-4.section .col-left img {
      height: 67.67vw;
  }

  #section-4.section .point:last-child{
    border: none;
    margin-bottom: 0;
  }

  #section-4.section .point p {
    font-size: 18px;
    line-height: 1.2;
  }






  #section-5.section .text-editor {
    margin: 0 0 9.30vw;
  }

  #section-5.section .text-editor p {
    font-size: 32px;
  }

  #section-5.section .support-wrapper {
    grid-template-columns: 100%;
    gap: 20px;
  }

  .recording-item{
    width: 81.40vw;
    margin-bottom: 20px;
    padding: 20px 25px;
  }

  .avatar-wrapper .image-wrapper, .avatar-wrapper img {
    width: 16.51vw;
    height: 16.51vw;
    min-width: 56px;
  }

  #section-5.section .animation-button {
    width: 100%;
    height: 81.63vw;
  }

  #section-5.section .button-section {
    width: 47vw;
    min-width: 197px;
    gap: 22px;
  }

  #section-5.section .button-section .image-wrapper .button,
  #section-5.section .button-section .image-wrapper .button img {
    width: 13.95vw;
    height: 13.95vw;
  }

  #section-5.section .animation-button:hover .element.e1,
  #section-5.section .element.e1 {
    top: 18.14vw;
    left: 6.28vw;
    width: 12.33vw;
    height: 12.33vw;
  }

  #section-5.section .animation-button:hover .element.e2,
  #section-5.section .element.e2 {
    top: 0;
    left: 35.12vw;
    width: 7.44vw;
    height: 7.44vw;
  }

  #section-5.section .animation-button:hover .element.e3,
  #section-5.section .element.e3 {
    top: 11.86vw;
    left: 43.72vw;
    width: 12.33vw;
    height: 12.33vw;
  }

  #section-5.section .animation-button:hover .element.e4,
  #section-5.section .element.e4 {
    top: 6.28vw;
    left: 65.35vw;
    width: 9.77vw;
    height: 9.77vw;
  }

  #section-5.section .animation-button:hover .element.e5,
  #section-5.section .element.e5 {
    top: 27.44vw;
    left: 76.28vw;
    width: 7.67vw;
    height: 7.67vw;
  }

  #section-5.section .animation-button:hover .element.e6,
  #section-5.section .element.e6 {
    top: 52.79vw;
    left: 70.23vw;
    width: 12.33vw;
    height: 12.33vw;
  }

  #section-5.section .animation-button:hover .element.e7,
  #section-5.section .element.e7 {
    top: 67.91vw;
    left: 40.70vw;
    width: 12.33vw;
    height: 12.33vw;
  }

  #section-5.section .animation-button:hover .element.e8,
  #section-5.section .element.e8 {
    top: 63.49vw;
    left: 21.40vw;
    width: 8.60vw;
    height: 8.60vw;
  }


















  #syn.new-concept.freetrial #section-7.section.h2 .text-editor p,
  #section-7.section.h2 .text-editor p{
    font-size: 32px !important;
  }





  #section-8.section .section-width {
    padding: 40px 20px;
  }

  #section-8.section .section-content {
    grid-template-columns: 100%;
    gap: 9.30vw;
  }

  #section-8.section .section-content .col-left .support-wrapper {
    width: 100%;
    padding-left: 16px;
  }

  #section-8.section.text.left .col-left {
      order: 2;
  }

  #section-8.section.text.right .col-left {
      order: 1;
  }

  #section-8.section .image-wrapper, 
  #section-8.section .image-wrapper img,
  #section-8.section .video,
  #section-8.section .video video,
  #section-8.section .video iframe {
    width: 90.70vw;
    height: 55.58vw;
  }

  #section-8.section .title-wrapper span {
    left: 0;
  }

  #section-8.section .title-wrapper {
    margin-bottom: 3.65vw;
  }

  #section-8.section .title-wrapper h4 {
    font-size: 18px;
    line-height: 122%;
  }

  #section-8.section .text-editor p{
    font-size: 16px;
    line-height: 125%;
  }





  #section-9.section {
      margin-top: 0;
  }

  #section-9.section .section-width{
    padding: 40px 20px 20px;
  }

  #section-9.section .section-content {
    gap: 25px;
}

  #section-9.section .title-wrapper,
  #section-9.section .title-wrapper h2 {
    margin-bottom: 0;
    color: #B6B6B6;
  }

  #section-9.section .repeater {
    grid-template-columns: 43.49vw 43.49vw;
    justify-content: space-between;
    position: relative;
  }

  #section-9.section .support-wrapper.with-list .top-content,
  #section-9.section .support-wrapper.with-list .text-editor {
    display: none;
  } 

  #section-9.section .support-wrapper.with-list {
    order: 3;
    position: absolute;
    top: 0;
    padding-top: 69.77vw;
    left: 50%;
    transform: translate(-50%, 0);
  }

  #section-9.section .item .background {
    width: 100%;
    height: auto;
    background-color: transparent;
    z-index: 2;
  }

  #section-9.section .support-wrapper:nth-child(2) .item .background {
    width: 100%;
    overflow: visible !important;
  }

  #section-9.section .item .background:after{
    background-color: #79D825;
  }

  #section-9.section .recommended .recommended-badge{
    z-index: 3;
    top: 15px;
  }

  #section-9.section .support-wrapper.with-list .text{
    border: none;
  }

  #section-9.section .support-wrapper.with-list .text p{
    font-weight: 600;
  }

  #section-9.section .item{
    opacity: 1;
    justify-content: flex-start;
  }

  #section-9.section .item:before{
    display: none;
  }

  #section-9.section .item .support-div{
    position: relative;
    padding-top: 15px;
    z-index: 2;
  }

  #section-9.section .item .top-content {
    padding: 8.84vw 5.58vw 5.35vw;
    background-color: #2B2B2B;
    border-radius: 12px;
    height: 57.21vw;
    min-height: 246px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
  }

  #section-9.section .item .product-name h4{
    font-size: 18px;
    line-height: 122.222%;
  }

  #section-9.section .item .price {
    display: block;
    padding: 6.05vw 0;
    gap: 0;
  }

  #section-9.section .item .price h2 {
    font-size: 36px;
    line-height: 105.556%;
  }

  #section-9.section .item .price p br{
    display: none;
  }

  #section-9.section .button-section.green-v1 a{
    padding: 12px 0;
    width: 100%;
  }

  #section-9.section .text-editor {
    padding: 16px 0;
    height: 25.58vw;
    min-height: 110px;
  }

  #section-9.section .text-editor .support-wrapper{
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
  }

  #section-9.section .packages .text {
    position: relative;
    padding: 7.44vw 20px 3.72vw;
    height: 24.42vw;
    min-height: 105px;
    display: flex;
    justify-content: center;
    align-items: flex-end;
  }

  #section-9.section .packages .text:last-child{
    border-bottom: none;
  }

  #section-9.section .item.with-list .text {
    display: block;
    padding-top: 18px;
    text-align: center;
  }

  #section-9.section .item.with-list .text:last-child{
    border: none;
  }




  .top-content {
    transition: top 0.2s ease-in-out;
  }
  
  /* Opcjonalnie styl placeholdera – np. aby był niewidoczny */
  .top-content-placeholder {
    visibility: hidden;
    margin-top: -15px;
    /* lub background: transparent; */
  }
  




















  #section-10.section .video {
    opacity: 1;
    margin-bottom: 6.28vw;
    width: 100%;
  }

  #section-10.section iframe {
    width: 100%;
    height: 47.91vw;
  }




  #section-11.section .section-width {
    padding: 0 20px 16px;
  }

  #section-11.section .section-content {
    padding: 30px 0 0;
    grid-template-columns: 100%;
  }

  #section-11.section .boxes{
    opacity: 1;
  }

  #section-11.section .top-content {
    padding: 6.51vw;
    width: 100%;
  }

  #section-11.section .product-name h4 {
    font-size: 18px;
    line-height: 122%;
  }

  #section-11.section .price {
    padding: 5.35vw 0;
  }

  #section-11.section .price h2 {
    font-size: 36px;
    line-height: 105%;
  }

  #section-11.section .carousel-wrapper {
    padding: 5.35vw 0;
  }

  #section-11.section .partners-carousel {
    margin-top: 5.35vw;
  }

  #section-11.section .carousel-item .image img {
    width: 7.44vw;
    height: 7.44vw;
    object-fit: cover;
  }






  #section-12.section .section-width {
    padding: 0 0 0 20px;
}

  #section-12.section .section-content {
    grid-template-columns: 100%;
    position: relative;
  }

  #section-12.section .section-content:after{
    content: '';
    right: -20px;
    width: 25vw;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/price-shape-right-1.png');
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 1;
  }

  #section-12.section .boxes {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 10px;
  }











  /* Ukrywanie paska przewijania w przeglądarkach opartych na WebKit (Chrome, Safari) */
  #section-12.section .boxes::-webkit-scrollbar {
      display: none;
  }

  #section-12.section .item {
    opacity: 1;
    flex: 0 0 auto;
    width: 48.84vw;
    padding: 6.98vw 0;
  }

  #section-12.section .item .background{
    height: 5px;
    background-color: #79D825;
  }

  #section-12.section .box-title {
    margin: 3.49vw 0 5.81vw;
  }

  #section-12.section .price {
    margin-bottom: 5.81vw;
  }

  #section-12.section .price h2 {
    font-size: 36px;
    line-height: 105%;
  }








  #section-13.section .box {
    grid-template-columns: 100%;
    gap: 7.44vw;
  }

  #section-13.section .image-wrapper, 
  #section-13.section .video {
    margin-bottom: 7.44vw
  }

  #section-13.section .image-wrapper, 
  #section-13.section .image-wrapper img,
  #section-13.section .video,
  #section-13.section .video video, 
  #section-13.section .video iframe,
  #section-13.section.video .video,
  #section-13.section.video .video iframe,
  #section-13.section.video .video .video-thumbnail,
  #section-13.section.video .video .video-thumbnail img.video-thumb{
    height: 55.58vw;
    border-radius: 12px;
    object-fit: cover;
  }


  #section-13.section .col-left h2 {
    font-size: 36px;
    line-height: 105%;
  }

  #section-13.section .col-right .text-editor p,
  #section-13.section .col-right .text-editor p span {
    font-size: 16px !important;
    line-height: 125%;
  }







  #section-14.section .section-width{
    padding-right: 0;
  }

  #section-14.section .section-content {
    padding: 40px 0 0;
  }

  #section-14.section .video-carousel .slick-slide>div {
    margin: 0 20px 0 0;
  }

  #section-14.section .mask,
  #section-14.section .carousel-arrow{
    display: none;
  }


  #section-14.section .video-carousel .slick-list {
    overflow: visible;
  }

  #section-14.section .item .support-wrapper{
    width: 59.53vw;
  }

  #section-14.section .video-carousel-wrapper .video, 
  #section-14.section .video-carousel-wrapper .video .video-thumbnail,
  #section-14.section .video-carousel-wrapper .video .video-thumbnail img.video-thumb,
  #section-14.section .video-carousel-wrapper .video img.wp-post-image,
  #section-14.section .video-carousel-wrapper .video video, 
  #section-14.section .video-carousel-wrapper .video iframe {
    height: 31.16vw;
  }

  .video-thumbnail img.play-button{
    width: 38px;
    height: 38px;  
  }

  #section-14.section .video-carousel-wrapper .video-container img{
    width: 8.84vw;
    height: 8.84vw;
    border: none !important;
  }

  #section-14.section .video-name {
    margin: 16px 0 8px;
  }

  #section-14.section .video-name p {
    font-size: 16px;
  }

  #section-14.section .author-name p{
    font-size: 14px;
  }

  #section-14.section .video-carousel-wrapper:after {
    width: 31.63vw;
    height: 31.16vw;
    right: -20px;
  }


  /* Home */

  /* Carousel Hero home */

  #section-14.section.carousel-hero-home .section-width {
    padding-top: 0;
  }

  #section-14.section.carousel-hero-home .item .support-wrapper {
      width: 90.70vw;
      grid-template-columns: 100%;
      padding: 32px;
      gap: 15px;
      justify-content: space-between;
      height: calc(var(--vh) * 100 - 79px); /* 100% wysokości okna */
  }

  #section-14.section.carousel-hero-home div:nth-child(1) .item .support-wrapper{
    background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/mobile-shape-s5.png') !important;
    background-position: 0 115%;
  }

  #section-14.section.carousel-hero-home div:nth-child(2) .item .support-wrapper{
    background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/mobile-shape-vf.png') !important;
  }

  #section-14.section.carousel-hero-home .slick-dots{
    display: none !important;
  }


  #section-14.section.carousel-hero-home .col-left .slider-logo, 
  #section-14.section.carousel-hero-home .col-left .slider-logo img {
    height: 5.81vw;
    min-height: 25px;
  }

  #section-14.section.carousel-hero-home .col-left{
    padding: 0;
    align-items: flex-start;
  }

  #section-14.section.carousel-hero-home .col-left h2 {
    font-size: 36px;
    margin-bottom: 0;
  }

  #section-14.section.carousel-hero-home .col-left .support-div {
    gap: 5.81vw;
    width: 100%;
    justify-content: flex-start;
  }

  #section-14.section.carousel-hero-home .col-left .content{
    display: flex    ;
    flex-direction: column;
    gap: 15px;
    justify-content: space-between;
  }

  #section-14.section.carousel-hero-home .col-left p {
    width: 100%;
    font-weight: 300;
  }

  #section-14.section.carousel-hero-home .col-right {
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }

  #section-14.section.carousel-hero-home .image-wrapper, 
  #section-14.section.carousel-hero-home .image-wrapper img, 
  #section-14.section.carousel-hero-home .video, 
  #section-14.section.carousel-hero-home .video video, 
  #section-14.section.carousel-hero-home .video iframe {
    height: 42.33vw;

    object-position: top;
  }

  #section-14.section.carousel-hero-home .buttons.mobile{
    display: flex;
    align-items: flex-end;
  }

  .button-section.white-v1 a{
    border-radius: 16px;
  }




  /* Blog and news */

  #section-14.section.blog-and-news .slick-slide>div {
    margin: 0 20px 0 0;
  }

  #section-14.section.blog-and-news .section-width {
    padding-top: 20px;
    padding-bottom: 0;
  }

  #section-14.section.blog-and-news .item .support-wrapper {
    width: 74.65vw;
  }

  #section-14.section.blog-and-news .video-carousel-wrapper:after {
    display: none;
  }

  #section-14.section .video-carousel-wrapper:before {
    position: absolute;
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-blog-posts-mobile.png);
    background-size: cover;
    background-repeat: no-repeat;
    top: 0;
    left: -20px;
    height: 100%;
    width: 11vw;
    transform: rotate(180deg);
  }

  #section-14.section.blog-and-news .video-carousel-wrapper .blog-post-carousel:after {
    content: '';
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-blog-posts-mobile.png);
    position: absolute;
    background-size: cover;
    background-repeat: no-repeat;
    top: 0;
    height: 100%;
    width: 16.74vw;
    right: 0;
  }

  #section-14.section.blog-and-news .item .post-thumbnail, 
  #section-14.section.blog-and-news .item .post-thumbnail img {
    height: 75.81vw;
  }

  .filter-wrapper .filter {
    overflow: auto;
  }

  .filter-wrapper .filter::-webkit-scrollbar {
    display: none;
  }  

  .filter-wrapper .filter button.filter-btn{
    height: 30px;
  }

  .filter-wrapper.mobile {
    display: block;
  }

  .filter-wrapper.mobile .button-section {
    justify-content: center;
  }

  .filter-wrapper.mobile{
    margin: 32px 0 40px;
  }

  .filter-wrapper {
    margin: 32px 0;
  }

  .blog-and-news .meta {
    height: auto;
    min-height: 239px;
  }

  .post-title a {
    font-size: 16px;
  }

  .post-excerpt p {
    font-size: 14px;
  }


  /* Carousel Artist */

  #section-14.section.carousel-artist {
    margin: 0;
  }

  #section-14.section.carousel-artist .section-width{
    padding-top: 0;
  }

  #section-14.section.carousel-artist .video-carousel-wrapper:after {
    display: none;
  }

  #section-14.section.carousel-artist .video-carousel-wrapper .video-carousel.artist:after {
    content: '';
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-artist-mobile.png);
    position: absolute;
    background-size: cover;
    background-repeat: no-repeat;
    top: 0;
    height: 100%;
    width: 24.42vw;
    right: 0;
  }

  #section-14.section.carousel-artist .section-content {
    padding-top: 40px;
    padding-bottom: 20px;
    border-bottom: none;
  }

  #section-14.section.carousel-artist .item .support-wrapper {
    width: 47.44vw;
    padding: 15px;
  }

  #section-14.section.carousel-artist .item .image-wrapper, #section-14.section.carousel-artist .item .image-wrapper img {
    width: 100%;
    height: 39.07vw;
    max-height: 100%;
  }

  #section-14.section.carousel-artist .button-section{
    display: none;
  }



  /* Tutorials/Reviews Carousel */

  #section-14.section.similiar .section-width {
    padding-top: 0;
    padding-bottom: 40px;
  }

  #section-14.section.reviews-carousel{
    padding-top: 40px;
  }

  #section-14.section.similiar .special-title {
    margin-bottom: 35px;
  }

  #section-14.section.similiar .special-title .button-section{
    display: none;
  }


  /* Product box */



  #product-box.section .section-width{
    padding: 60px 0;
  }

  #product-box.section .section-content{
    position: relative;
  }

  #product-box.section .section-content:after {
    content: '';
    position: absolute;
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/shape-blog-posts-mobile.png);
    background-size: cover;
    background-repeat: no-repeat;
    top: 0;
    right: 0;
    height: 100%;
    width: 15vw;
}

  #product-box.section .box-wrapper .item {
    padding: 40px 0 40px 30px;
    background-position: 7% -5%;
    background-size: 160%;
  }

  #product-box.section .box-wrapper {
    grid-template-columns: 77.91vw 77.91vw;
    overflow: auto;
    padding-left: 20px;
  }

  #product-box.section .box-wrapper::-webkit-scrollbar {
    display: none;
  }  

  #product-box.section .box-wrapper h2 {
    font-size: 18px;
    font-weight: 300;
    line-height: 122%;
  }

  .logo-product, 
  .logo-product img {
    width: 31px;
  }

  #product-box.section .box-wrapper .text-editor {
    width: 100%;
    max-width: 100%;
    margin: 30px 0 40px;
  }

  #product-box.section .box-wrapper p {
    font-size: 16px;
    line-height: 125%;
  }

  product-box.section .middle {
    margin: 80px 0;
  }

  #product-box.section .middle .image-wrapper, 
  #product-box.section .middle .image-wrapper img, 
  #product-box.section .middle .video, 
  #product-box.section .middle .video video, 
  #product-box.section .middle .video iframe {
    height: 56.74vw;
    object-fit: cover;
    object-position: left;
  }

  #product-box.section .bottom .logo-bottom {
    width: 100%;
  }

  #product-box.section .bottom .logo-bottom img {
    height: 6.74vw;
    min-height: 29px;
  }



  /* About us */

  #about-us.section {
    margin: 0;
  }

  #about-us.section .section-width{
    padding-top: 0;
  }

  #about-us.section .section-content{
    padding-top: 40px;
    position: relative;
  }

  #about-us.section .section-content:after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/bottom-shape.png);
    width: 100%;
    height: 35.12vw;
    background-size: cover;
    border-radius: 0 0 12px 12px;
  }


  #about-us.section .section-content .support-wrapper {
    padding: 32px;
    grid-template-columns: 100%;
    height: 97.67vw;
    max-height: 100%;
  }

  #about-us.section .section-content .support-wrapper:after {
    background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/about-us-home.png);
    width: 47.67vw;
    height: 37.44vw;
    background-size: cover;
    background-position: bottom right;
    top: unset;
    bottom: 0;
  }

  #about-us.section .col-left{
    z-index: 1;
  }

  #about-us.section h3 {
    font-size: 18px;
    letter-spacing: 0;
    margin-bottom: 50px;
  }

  #about-us.section h2 {
    font-size: 32px;
    line-height: 109.375%;
    margin-bottom: 0;
  }



  /* Blog */

  #section-14.section.blog-and-news.posts-loop-section .section-width {
    padding-bottom: 40px;
  }

  #section-14.section.posts-loop-section h1 {
    margin-bottom: 25px;
  }

  #section-14.section.posts-loop-section .description{
    padding-right: 20px;
  }

  #section-14.section.posts-loop-section .description p {
    font-size: 18px;
  }

  #section-14.section.posts-loop-section .filter-wrapper {
    margin: 25px 0 40px;
  }

  #section-14.section.posts-loop-section.video-posts .posts-loop,
  #section-14.section.posts-loop-section .posts-loop {
    grid-template-columns: 100%;
    gap: 16px;
    padding-bottom: 40px;
    padding-right: 20px;
  }

  #section-14.section.posts-loop-section.video-posts .posts-loop {
    gap: 32px;
  }

  #section-14.section.posts-loop-section .item .support-wrapper {
    width: 100%;
  }

  #section-14.section.blog-and-news.posts-loop-section .meta {
    height: auto;
    min-height: 100%;
    max-height: 100%;
    padding: 32px;
  }

  #section-14.section.blog-and-news.posts-loop-section .post-title a {
    font-size: 18px;
  } 

  #section-14.section.blog-and-news.posts-loop-section .post-excerpt p {
    font-size: 16px;
  }

  #section-14.section.video-posts .video, 
  #section-14.section.video-posts .video video, 
  #section-14.section.video-posts .video iframe,
  #section-14.section.video-posts .video .video-thumbnail, 
  #section-14.section.video-posts .video .video-thumbnail img.video-thumb, 
  #section-14.section.video-posts .video img.wp-post-image {
    height: 47.67vw;
  }

  #section-14.section.video-posts .item {
    opacity: 1;
  }



  /* Single post */

  #syn.new-concept.single {
    padding-top: 79px;
    padding-bottom: 52px;
  }

  .single-thumbnail {
    margin-bottom: 40px;
  }

  .single-wrapper {
    grid-template-columns: 100%;
    gap: 40px;
  }

  #syn.new-concept .single-title h1 {
    font-size: 36px;
    margin-bottom: 30px;
  }

  .single-time time {
    font-size: 14px;
  }

  #syn.new-concept.single .navigation {
    margin-top: 40px;
  }

  #syn.new-concept.single .navigation a {
    padding: 20px 32px;
  }

  .single-share {
    margin-top: 40px;
  }

  .single-wrapper .image-wrapper, 
  .single-wrapper .image-wrapper img,
  .single-wrapper .video-wrapper .video, 
  .single-wrapper .video-wrapper .video video, 
  .single-wrapper .video-wrapper .video iframe {
    height: 47.67vw;
  }

  .single-wrapper .single-section.title {
    margin-top: 32px;
    padding-top: 32px;
  }

  #syn.new-concept.single .title-wrapper h2 {
    font-size: 18px;
  }


  .top-parts, .column-repeater {
    grid-template-columns: 31.40vw auto auto;
  }

  .column-repeater.columns-2 {
    grid-template-columns: 31.40vw auto;
  }

  .column-repeater .column-item p{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
  }

  .top-parts .name p, 
  .top-parts .col-top:first-child p, 
  .column-repeater .column-item:first-child p {
    display: flex;
    justify-content: flex-start;
  }


  .related-post #section-14.section.blog-and-news .section-width {
    padding-left: 0;
  }

  .related-post #section-14.section.blog-and-news .section-content {
    padding-top: 52px;
  }

  .related-post #section-14.section.blog-and-news .title-wrapper,
  .related-post #section-14.section.blog-and-news .video-carousel-wrapper{
    padding-left: 20px;
  }

  .related-post #section-14.section.blog-and-news .title-wrapper h2 {
    margin-bottom: 32px;
  }



































  #section-15.section {
    margin: 30px 0;
  }

  #section-15.section .section-content img {
    width: 75.58vw;
  }



  #section-16.section.cta {
    margin: 16.28vw auto 0;
  }

  #section-16.section.cta .section-width {
    padding: 0 !important;
    background-color: #2B2B2B;
  }

  #section-16.section.cta .text-editor{
    width: 100%;
  }

  .cta.section .section-content {
    width: 100%;
    padding: 8.37vw 5.58vw;
    display: grid;
    gap: 9.30vw;
  }


  .cta.section .button-section {
    justify-content: flex-start;
  }

  .cta.section .button-section.white a {
    width: 13.95vw;
    height: 13.95vw;
  }

  .cta.section .button-section a img {
    width: 2.79vw;
    min-width: 12.7px;
    height: 5.35vw;
    height: auto;
  }

  .cta.section .title-wrapper h2 {
    margin-bottom: 4.65vw !important;
    font-size: 36px !important;
  }

  .cta.section .text-editor p {
    font-size: 18px;
    line-height: 123%;
    width: 62.56vw;
  }

  #section-16.section.cta .element.e1,
  #section-16.section.cta .element.e2,
  #section-16.section.cta .element.e3{
    display: none;
  }

  #section-16.section.cta .element.e4,
  #section-16.section.cta .section-width:hover .element.e4 {
    top: 10.93vw;
    left: 68.60vw;
  }

  #section-16.section.cta .element.e5,
  #section-16.section.cta .section-width:hover .element.e5 {
    bottom: 16.74vw;
    left: 34.88vw;
  }


  #section-16.section.cta .element.e6,
  #section-16.section.cta .section-width:hover .element.e6 {
    top: unset;
    left: unset;
    bottom: 42.56vw;
    right: 7.21vw;
  }


  #section-16.section.cta .element.e7,
  #section-16.section.cta .section-width:hover .element.e7 {
    top: unset;
    bottom: 10.70vw;
    right: 17.21vw;
  }


  #section-16.section.cta .element.e8,
  #section-16.section.cta .section-width:hover .element.e8 {
    top: unset;
    bottom: 14.42vw;
    right: 37.91vw;
  }


  #syn.new-concept #voice_db .voice_db_grid .voice_db_item, 
  #syn.new-concept #voice_db .voice_db_grid .voice_db_item_spacer {
    max-width: 100%;
    margin-bottom: 20px;
  }

  #section-7.section.h1 .title-wrapper h1 {
    font-size: 36px;
    margin-bottom: 6.44vw;
    max-width: 75%;
  }

  #section-7.section.h1 .text-editor p{
    font-size: 18px;
    line-height: 122.222%;
  }

  #syn.new-concept #voice_db .voice_db_grid .voice_db_item img.voice_db_item_image, 
  #syn.new-concept #voice_db .voice_db_grid .voice_db_item_spacer img.voice_db_item_image {
    width: 16.51vw;
    height: 16.51vw;
  }

  #voice_db .voice_db_grid .voice_db_item div.voice_db_modal, 
  #voice_db .voice_db_grid .voice_db_item_spacer div.voice_db_modal {
    height: auto;
  }

  #syn.new-concept #voice_db .voice_db_grid .voice_db_item button.voice_db_play, 
  #syn.new-concept #voice_db .voice_db_grid .voice_db_item_spacer button.voice_db_play {
    width: 8.84vw;
    height: 8.84vw;
  }

  .dreamtonics.modal .modal__content {
    grid-template-columns: 100%;
    padding-right: 0 !important;
  }

  .dreamtonics.modal .modal__content .col-right {
    padding-top: 0;
    overflow: auto;
    height: 100%;
  }

  #syn.new-concept #voice_db .voice_db_grid {
    margin-top: 9.30vw;
    margin-bottom: 9.30vw;
  }

  .button-section.showmore .support-wrapper img {
    width: 6.98vw;
    height: 6.98vw;
  }

  #section-17.section .section-width{
    padding-bottom: 60px;
  }

  #syn.new-concept #voice_db .voice_db_filters {
    display: grid;
    gap: 44px;
  }



  /* Styl popupu – domyślnie ukryty */

  .filters-open #barba-wrapper{
    position: relative;
    z-index: 9999;
  }

  .filters-popup {
    display: none;            
    position: fixed;         
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #1B1B1B;  
    z-index: 9999;  
    padding: 20px;
    box-sizing: border-box;
  }

  .top-popup{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18.60vw;
  }

  #syn.new-concept .top-popup h2{
    color: #FFF;
    font-size: 32px;
    font-weight: 300;
    line-height: 109.375%;
    margin-bottom: 0;
  }

  .close-filters {
    cursor: pointer;
  }

  .top-popup img{
    width: 38px;
    height: 38px;
  }


  .filters-popup.show {
    display: block;
  }

  .popup-content {
    margin: 0 auto;
    position: relative;
    top: 107px;
  }

  .filters-button.mobile{
      display: flex !important;
      justify-content: center;
      gap: 10px;
  }

  .filters-button img{
    width: 24px;
    height: 12px;
  }
  
  #syn.new-concept .filters-button p{
    color: #B6B6B6;
    font-size: 14px;
    font-weight: 300;
    line-height: 114.286%;
  }

  .confirm-button{
    margin: 10.23vw auto 0;
    display: flex;
    justify-content: center;
  }

  .confirm-button p{
    font-size: 18px;
    font-weight: 500;
    line-height: 110%; /* 19.8px */
    color: #E5E5E5;
    display: flex;
    padding: 11.046px 33.169px 9.046px;
    justify-content: center;
    align-items: center;
    gap: 33px;
    border-radius: 15px;
    border: 1px solid #E5E5E5;
  }



  

  #section-18.section .item {
    padding: 24px;
    background-color: #201F1F;
    border-radius: 12px;
    margin-bottom: 4.65vw;
  }

  #section-18.section .text h4 {
    font-size: 18px;
    padding-right: 20px;
  }

  #section-18.section .button-section a {
    width: 8.84vw;
    min-width: 38px;
    min-height: 38px;
    height: 8.84vw;
  }

  #section-18.section .button-section a img {
    height: 3.26vw;
    min-height: 15px;
  }


  #syn.new-concept.voices{
    padding-bottom: 0;
  }

  #section-10.section.v2 {
    background-size: 140%;
    background-position: -23.26vw;
  }

  #section-10.section.v2 .section-width {
    padding: 18.60vw 20px 13.02vw;
    position: relative;
  }

  #section-10.section.v2 .video,
  #section-10.section.v2 .video-container,
  #section-10.section.v2 video, 
  #section-10.section.v2 iframe {
    width: 78.37vw;
    height: 45.12vw;
    margin: auto;
  }

  #section-10.section.v2 .section-width:before {
    height: 18.60vw;
  }

  #section-10.section.v2 .section-width:after {
    content: '';
    width: 20.00vw;
    height: 13.02vw;
  }

#section-19.section .section-width{
  padding-bottom: 30px;
}

#section-19.section .boxes {
  grid-template-columns: 100%;
  gap: 16px;
}

#section-19.section .video iframe, 
#section-19.section .video video,
#section-19.section .video .video-thumbnail,
#section-19.section .video .video-thumbnail img.video-thumb {
  height: 46.51vw;
  border-radius: 12px;
}

#section-19.section .video-name {
  top: 5.58vw;
  left: 5.58vw;
}

#section-19.section .button-section.showmore {
  bottom: 5.58vw;
  left: 5.58vw;
}

#syn.new-concept #appPhoneme header h1 {
  font-size: 32px;
  margin-bottom: 10px;
}

#syn.new-concept #appPhoneme header h2 {
  font-size: 14px;
  margin-bottom: 9.30vw;
}

#syn.new-concept #appPhoneme .options select{
  min-width: 90.70vw;
}

#syn.new-concept #appPhoneme header {
  margin-bottom: 9.30vw;
}

#syn.new-concept #appPhoneme .tr-big h4 {
  font-size: 18px;
  margin-bottom: 4.65vw;
}

#syn.new-concept #appPhoneme .table-group {
  grid-template-columns: 100%;
  gap: 9.30vw;
}

#syn.new-concept #appPhoneme .tbody {
  padding: 24px 42px;
}

#syn.new-concept #appPhoneme .tr-col {
  padding: 16px 0;
}

#syn.new-concept #appPhoneme .tr-col p {
  font-size: 14px;
}




#syn.new-concept.help-resources #section-7.section {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/help-1.svg);
  background-size: cover;
  background-position: 0 53%;
}


#syn.new-concept.terms #section-7.section {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/terms-1.svg);
  background-size: 50%;
  background-position: 100% 56%;
}

#syn.new-concept.freetrial #section-7.section {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/free-7-top-mobile.png);
  background-size: 100%;
  background-position: 40% 40%;
}

#syn.new-concept.help-resources #section-7.section .section-width {
  padding-bottom: 9vw;
}

#syn.new-concept.terms #section-7.section .section-content,
#syn.new-concept.help-resources #section-7.section .section-content,
#syn.new-concept.freetrial #section-7.section .section-content{
  padding-top: 0;
  border-top: none;
}

#syn.new-concept.help-resources #section-7.section.h1 .text-editor {
  width: 67.67vw;
}


#syn.new-concept.voices #section-7.section {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/voices-1.png);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 0 -48.84vw;
}

#section-7.section .text-editor ul {
  font-size: 16px;
  width: 76.74vw;
  margin-top: 9.30vw;
}

#section-7.section .section-width {
  padding-bottom: 10px;
}




#section-22.section .section-width {
  padding-top: 0;
}

#section-22.section .section-content {
  padding-top: 9.30vw;
}

#syn.new-concept h1 {
  color: #FFF;
  font-size: 36px;
  line-height: 111%;
  margin-bottom: 9.30vw;
}

#section-22.section .licenses-boxes {
  grid-template-columns: 100%;
}

#section-22.section .item {
  padding: 6.51vw 5.58vw;
  height: auto;
  border-radius: 12px;
  background-position: 120%;
}

#section-22.section .box-name {
  width: 53.49vw;
}

#section-22.section .box-name h4 {
  font-size: 18px;
  line-height: 120%;
  margin-bottom: 8.14vw;
}

#section-23.section .column {
  grid-template-columns: 100%;
  gap: 24px;
}

#section-23.section .column-name {
  margin-bottom: 4.65vw;
}

#section-23.section .column-name h4 {
  font-size: 18px;
  line-height: 122%;
}

#section-23.section .list .text-editor {
  grid-template-columns: 6.98vw auto;
  padding: 5.58vw;
}

#section-23.section .item .image-wrapper {
  width: 6.98vw;
  height: 6.98vw;
}


#section-23.section .list .text-editor p {
  font-size: 16px;
  line-height: 125%;
}




/* free trials */

#syn.new-concept.freetrial #section-7.section p br{
  display: none;
}

#section-22.section.free-trial .section-width {
  padding-top: 40px;
  padding-bottom: 40px;
}

#section-23.section .section-content {
  padding-top: 40px;
}

#section-22.section.free-trial .top-box{
  padding: 6.51vw 5.58vw;
  background-size: 55%;
  background-position: bottom right;
}

#section-22.section.free-trial .item {
  background-position: right 10px;
}

#section-22.section.free-trial .item:nth-child(2) {
  background-position: right 0px;
}

#section-22.section.free-trial .top-box .box-name,
#section-22.section.free-trial .box-name h4{
  margin-bottom: 0;
}

#section-22.section.free-trial .box-name{
  margin-bottom: 40px;
}

#section-22.section.free-trial .box-name {
  width: 100%;
}

#section-22.section.free-trial .top-box .content {
  grid-template-columns: 100%;
  gap: 27px;
}

#section-22.section.free-trial .top-box .content .text-editor p br{
  display: none;
}

#section-22.section.free-trial .top-box .button-section.green-v1 a {
  width: 100%;
}

#section-22.section.free-trial .bottom-text {
  margin-top: 24px;
}

#syn.new-concept.freetrial #section-7.section.number-4 .section-width,
#syn.new-concept.freetrial #section-7.section.number-4 .section-content {
  padding-top: 0;
}

#syn.new-concept.freetrial #section-9.section .section-width {
  padding: 20px 20px 40px;
}

#syn.new-concept.freetrial #section-9.section .packages .text:last-child {
  /*border-bottom: 1px solid #454545;*/
}

#syn.new-concept.freetrial #section-12.section .title-wrapper.desktop{
  display: block;
}

#syn.new-concept.freetrial #section-6.cta{
  margin-bottom: 40px;
}

#syn.new-concept.freetrial #section-6.cta.section .section-width{
  padding: 0 !important;
  margin-bottom: -2px;
}

.cta.section .text-editor p {
  width: 100%;
}

#syn.new-concept.freetrial #section-6.cta.section .section-content {
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/cta-free.png);
  background-color: transparent;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 0 -2px;
}

#syn.new-concept.freetrial #section-6.cta.section .section-width:before{
  background-image: url(/wp-content/themes/homepage_theme_240416/assets/img/cta-free-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
}

#syn.new-concept.freetrial #section-6.cta.section .button-section a{
  width: 60px;
  height: 60px;
} 

#syn.new-concept.freetrial  #section-3.section .section-width {
  padding: 40px 20px;
}

#syn.new-concept.freetrial #section-6.cta .element {
  z-index: 1;
}

#syn.new-concept.freetrial #section-6.cta .element.e-1{
  display: none;
}

#syn.new-concept.freetrial #section-6.cta .element.e-2{
  width: 7.44vw;
  height: 7.44vw;
  top: unset;
  bottom: 16.28vw;
  right: 49.07vw;
}

#syn.new-concept.freetrial #section-6.cta .element.e-3{
  width: 8.84vw;
  height: 8.84vw;
  top: unset;
  bottom: 6.74vw;
  right: 30.00vw;
}

#syn.new-concept.freetrial #section-6.cta .element.e-4{
  width: 7.44vw;
  height: 7.44vw;
  top: unset;
  bottom: 12.33vw;
  right: 9.77vw;
} 









/* Vocoflex */

#syn.new-concept.vocoflex{
  padding-top: 39.07vw;
}

#syn.new-concept.vocoflex #section-1.section .section-width {
  padding-top: 13.49vw;
}

#syn.new-concept.vocoflex #section-1.section {
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/filrst-bg.png');
  background-size: cover;
  background-position: center;
  margin-bottom: 9vw;
}

#syn.new-concept.vocoflex #section-1.section .image-wrapper img {
  width: 48.60vw;
}

#syn.new-concept.vocoflex #section-1.section .text-editor p {
  font-size: 32px;
}

#syn.new-concept.vocoflex #section-1.section .text-editor {
  margin-bottom: 12.09vw;
}

#syn.new-concept.vocoflex #section-1.section video, 
#syn.new-concept.vocoflex #section-1.section iframe {
  height: 46.51vw;
}

#syn.new-concept.vocoflex #section-2.section .section-width .title-wrapper h2 {
  margin-bottom: 7.44vw;
}

#syn.new-concept.vocoflex #section-2.section .section-width {
  padding-bottom: 40px;
}

#animation-text.section {
  position: relative;
  margin-top: 10px;
}

#animation-text .element{
  display: none;
}

#animation-text.section .section-width {
  padding-top: 42vw;
  padding-bottom: 35vw;
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/animation-bg.png');
  background-size: cover;
  background-position: center;
}

#animation-text.section .item {
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#animation-text.section .item h2{
  font-size: 32px;
  font-weight: 300;
  width: 100%;
}

#animation-text.section .item h2 br{
  display: none;
}

#syn.new-concept.vocoflex #section-3.section .section-width{
  padding: 20px 40px;
}

#syn.new-concept.vocoflex #section-3.section .section-width .image-wrapper, 
#syn.new-concept.vocoflex #section-3.section .section-width .image-wrapper img {
  width: 100%;
  height: 53.02vw;
  object-fit: contain;
}

#syn.new-concept.vocoflex #section-7.section.number-5 .title-wrapper h2{
  margin-bottom: 4.88vw;
}

#syn.new-concept.vocoflex #section-8.section .section-width {
  padding: 40px 20px;
}

#syn.new-concept.vocoflex #section-10.section .section-width {
  padding-top: 0;
  padding-bottom: 40px;
}

#syn.new-concept.vocoflex #section-10.section .section-content {
  padding-top: 14vw;
  padding-bottom: 14vw;
}

.page-template-page-vocoflex #section-10.section .section-content .border {
  width: 100%;
}

#syn.new-concept.vocoflex #section-10.section .section-content .video{
  padding-top: 14vw;
  padding-bottom: 14vw;
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/video-bg-vocoflex.png');
  background-size: cover;
  background-position: center;
}

#syn.new-concept.vocoflex #section-10.section iframe, 
#syn.new-concept.vocoflex #section-10.section .video-thumbnail, 
#syn.new-concept.vocoflex #section-10.section .video-thumbnail img.video-thumb {
  width: 77.91vw;
  height: 49.77vw;
}

.page-template-page-vocoflex #section-10.section .element{
  display: none;
}

#price-list.section .section-content {
  grid-template-columns: 100%;
  gap: 40px;
}

#price-list.section .section-content h2 {
  margin: 0;
}

#price-list.section .section-content h2 br{
  display: none;
}

#price-list.section .top-col .support-wrapper {
  width: 100%;
}

#price-list.section .top-col {
  padding: 28px;
}

#price-list.section .two-col {
  grid-template-columns: 100%;
}

#simple-content.section .section-content {
  padding-top: 40px;
}

#simple-content.section .title-wrapper h2 {
  font-size: 32px;
  margin-bottom: 40px;
}

#simple-content.section .section-width {
  padding-bottom: 40px !important;
}

#simple-content.section .section-content .support-wrapper {
  grid-template-columns: 100%;
  gap: 40px;
}

#simple-content.section .section-content .support-wrapper .text-editor{
  order: 2;
}

#simple-content.section .image-wrapper, 
#simple-content.section .image-wrapper img {
  height: 55.58vw;
}

#simple-content.section .text-editor p {
  font-size: 16px;
  line-height: 125%;
  font-weight: 300;
}

#questions-answers.section .section-width {
  padding-bottom: 0;
  padding-top: 40px !important;
  border-top: 1px solid #454545;
}

#questions-answers.section .section-content{
  padding-top: 0;
  border-top: none;
}

#questions-answers.section .title-wrapper h2 {
  font-size: 32px;
  margin-bottom: 40px;
}

.faq .item .question {
  gap: 20px;
}

.faq .item .question p {
  font-size: 18px;
}

#syn.new-concept.vocoflex .faq .item p {
  width: 80%;
}

.vocalflex-footer-image{
  height: 27vw; /* approximate to live site proportion */
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/before-cta.png');
  background-size: contain;
  background-position: center top;
  background-repeat: no-repeat;
}

#syn.new-concept.vocoflex #section-16.section.cta {
  margin: 8vw auto 0;
}

/* EULA */

.page-id-1403 #syn.new-concept.vocoflex #page-title.section .section-width{
  padding-top: 13.49vw;
  padding-bottom: 0;
}

.page-id-1403 #syn.new-concept.vocoflex #page-title.section .section-width h1 {
  margin-bottom: 36px;
}

.page-id-1403 #syn.new-concept.vocoflex #page-title.section .section-width h2{
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
  margin-bottom: 40px;
}

#simple_wysiwyg.section ol {
  padding-left: 30px;
}








/* About */


#about-us-hero.section .section-content {
  height: 66.74vw;
}

#about-us-hero.section .image-wrapper img {
  height: 10.93vw;
  min-height: 47px;
}

.page-id-48 #section-8.section .section-width {
  padding: 52px 20px;
}

.page-id-48 #section-8.section.border-top .section-content {
  padding-top: 52px;
}

.page-id-48 #section-8.section .image-wrapper, 
.page-id-48 #section-8.section .image-wrapper img, 
.page-id-48 #section-8.section .video, 
.page-id-48 #section-8.section .video video, 
.page-id-48 #section-8.section .video iframe {
  width: 100%;
  height: 81.63vw;
}

.page-id-48 #section-8.section .section-content {
  gap: 40px;
}

.page-id-48 #section-8.section .section-content .col-left .support-wrapper {
  padding-left: 0;
}

#about-us-three-box.section {
  background-color: #201F1F;
  padding: 0;
}

#about-us-three-box.section .section-width {
  padding: 60px 0px !important;
}

#about-us-three-box.section .section-width{
  padding-left: 20px !important;
}

#about-us-three-box.section .boxes {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 10px;
}

#about-us-three-box.section .boxes::-webkit-scrollbar {
  display: none;
}

#about-us-three-box.section .boxes .box {
  background-color: #1B1B1B;
  padding: 24px;
  width: 82.79vw;
  flex: 0 0 auto;
}

#about-us-three-box.section .boxes .box .text-editor {
  margin-top: 24px;
}

#about-us-three-box.section .boxes .box p {
  font-size: 16px;
  line-height: 125%;
}

.page-id-48 #about-us.section .section-width {
  padding: 52px 20px;
}

.page-id-48 #about-us.section .section-content .support-wrapper:after {
  width: 100%;
  min-width: auto;
  height: 100%;
  background-size: cover;
  background-position: 4%;
  top: unset;
  bottom: 0;
}

.page-id-54 #page-title.section .section-width {
  padding-bottom: 60px;
}

#contact-info.section .section-width {
  padding: 32px 0;
}

#contact-info.section .section-content{
  padding-top: 52px;
}

#contact-info.section .section-content .title-wrapper{
  padding: 0 20px;
}

#contact-info.section .contact-info {
  grid-template-columns: 100%;
  gap: 28px;
  padding: 0 20px;
}

#contact-info.section .contact-info .item {
  grid-template-columns: auto 59.07vw;
}




/* Privacy Policy */

#syn.new-concept.single.pp{
  padding-bottom: 16px;
}

#syn.new-concept.single.pp .section-width.pp {
  padding: 23px 20px 16px;
}

#syn.new-concept.single.pp .page-title-wrapper h1 {
  margin-bottom: 36px;
}

#syn.new-concept.single.pp .page-title-wrapper h2 {
  font-size: 14px;
  font-weight: 300;
  line-height: 114.286%;
  margin-bottom: 40px;
}












#syn.new-concept.voices #section-7.section .section-content{
  border-top: none;
}

#syn.new-concept #voice_db .voice_db_header .voice_db_filters {
  flex-direction: column;
}




.dreamtonics.modal{
  padding: 20px;
  background-color: transparent !important;
}

.dreamtonics.modal__visible {
  z-index: 9999 !important;
  align-items: flex-start !important;
}

.dreamtonics.modal .modal__container{
  padding-top: 5.81vw !important;
  gap: 32px !important;
  justify-content: flex-start !important;
  height: 100% !important;
}

.dreamtonics.modal .modal__close {
  top: 25px !important;
  right: 24px !important;
}

.dreamtonics.modal .modal__info .player__ai img {
  width: 16.51vw;
  height: 16.51vw;
}

.dreamtonics.modal .modal__info_about{
  font-size: 14px !important;
}

.dreamtonics.modal .modal__info_product{
  background-size: 30px 30px;
  padding-left: 38px !important;
  height: 30px
}

.dreamtonics button.player__select.desktop{
  display: none;
}

.player-select, .player__controls, .player__mode {
  width: 100%;
}

.player__mode{
  order: 2 !important;
}

.player__controls{
  order: 3 !important;
  
}

.dreamtonics.bar .player__track, 
.dreamtonics.bar .player__mode {
  display: flex !important;
  width: 100%;
  background-color: transparent;
  justify-content: space-between !important;
  gap: 0 !important;
}

.dreamtonics.modal .modal__info{
  order: 1 !important;
  padding: 0 24px !important;
}

.dreamtonics.modal .modal__content {
  order: 2 !important;
  padding: 0 !important;
  gap: 32px !important;
  overflow: visible !important;
}

.dreamtonics.modal .modal__content .col-left{
  padding: 0 20px;
}

.dreamtonics.modal .modal__info_scroll{
  padding: 0 !important;
}

.dreamtonics.bar .player__mode {
  padding: 0 !important;
  margin: 12px 0 18px !important;
}

.dreamtonics.bar .player-select {
  padding-bottom: 12px;
  border-bottom: 1px solid #2B2B2B;
}

.dreamtonics.bar .player-select .player__track{
  justify-content: space-between !important;
}

.dreamtonics.modal .modal__player{
  order: 3 !important;
}

.dreamtonics.bar .player__content {
  transform: none !important;
  padding: 18px 24px 28px !important;
  gap: 0px;
  background-color: #1B1B1B !important;
  border-radius: 0 !important;
}


.dreamtonics button.player__next, 
.dreamtonics button.player__prev{
  display: block !important;
}

.dreamtonics button.player__play, 
.dreamtonics button.player__pause {
  width: 48px !important;
  height: 48px !important;
}




.player__mode_container.desktop {
  display: none;
}

.player__mode_mobile.mobile {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dreamtonics button.player__mode_next, 
.dreamtonics button.player__mode_prev, 
.dreamtonics button.player__collapse,
.dreamtonics .player__track button.player__prev.mobile,
.dreamtonics .player__track button.player__next.mobile{
  background-image: url('/wp-content/themes/homepage_theme_240416/assets/img/player-mobile.svg') !important;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  opacity: .6 !important;
}

.dreamtonics .player__mode.main-special{
  display: block !important;
}

.player__mode_mobile.mobile .support-wrapper{
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: center;
}

.dreamtonics.bar .player__mode_mobile.mobile .support-wrapper label {
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  font-size: 12px;
  font-weight: 300;
  line-height: 125%;
  letter-spacing: .02em;
  color: #B6B6B6;
}

.dreamtonics.bar .player__mode_mobile.mobile .support-wrapper .player__mode_select {
  display: block !important;
  background-color: transparent !important;
  border-radius: 0 !important;
}

.dreamtonics.bar .player__mode_mobile.mobile .support-wrapper .player__mode_name {
  min-width: auto;
  font-family: 'aktiv-grotesk', 'Noto Sans JP', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 125%;
  letter-spacing: 0em;
  text-align: center;
  color: #B6B6B6;
}

.dreamtonics.bar .player__progress {
  margin-top: 20px;
}

.dreamtonics.bar .player__seek-bar {
  background-color: #191919 !important;
}

.dreamtonics.bar .player__track{
  justify-content: center !important;
  gap: 18px !important;
}





.scroll-carousel {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 0;
}

.scroll-carousel .video-slide {
  flex: 0 0 auto;
  scroll-snap-align: center;
  margin: 0 20px 0 0; 
  width: 80%; 
}


.scroll-carousel::-webkit-scrollbar {
  display: none;
}

.scroll-carousel {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.dreamtonics.modal .modal__info_scroll .iframe-container iframe{
  border-radius: 12px;
}


.privacypolicymain-mv-wrapper {
      padding-top: 220px;
      padding-bottom: 0px;
      margin: 0
  }

  .privacypolicymain-mv-content {
      display: block
  }

  .privacypolicymain-mv-title h2 {
      font-size: 75px;
      line-height: 1;
      margin-bottom: 12px
  }

  .privacypolicymain-mv-text p {
      line-height: 2;
      letter-spacing: .075em
  }

  .vocoflexeulamain-mv-wrapper {
      padding-top: 220px;
      padding-bottom: 0px;
      margin: 0
  }
  
  .vocoflexeulamain-mv-content {
      display: block
  }

  .vocoflexeulamain-mv-title h2 {
      font-size: 75px;
      line-height: 1;
      margin-bottom: 12px
  }

  .vocoflexeulamain-mv-text p {
      line-height: 2;
      letter-spacing: .075em
  }

  .termsmain-mv-wrapper {
      padding-top: 220px;
      padding-bottom: 0px;
      margin: 0
  }

  .termsmain-mv-content {
      display: block
  }

  .termsmain-mv-title h2 {
      font-size: 75px;
      line-height: 1;
      margin-bottom: 12px
  }

  .termsmain-mv-text p {
      line-height: 2;
      letter-spacing: .075em
  }
  
  .termsmain-mv-content {
      display: block;
      margin: -16% auto 120px;
      max-width: calc(100% - 70px)
  }
  .termsmain-mv-body {
      display: block;
      margin: -16% auto 120px;
      max-width: calc(100% - 70px)
  }
  .termsmain-mv-title {
      width: 100%
  }
  .termsmain-mv-title h2 {
      font-size: 74px
  }
  .termsmain-mv-title p {
      font-size: 16px
  }
  .termsmain-mv-text {
      width: 100%
  }
  .termsmain-mv-text p {
      font-size: 16px;
      margin-top: 28px
  }
  .termsmain-glt-wrapper {
      margin: 0 auto 80px;
      max-width: calc(100% - 70px)
  }
  .termsmain-glt-wrapper h2 {
      font-size: 50px;
      line-height: 1;
      margin-bottom: 30px
  }
  .termsmain-glt-wrapper h4 {
      transform: translateY(0px)
  }
  .termsmain-glt-contents {
      display: block;
      position: relative
  }
  .termsmain-glt-img {
      position: absolute;
      width: 24%;
      top: 0;
      left: 0
  }
  .termsmain-glt-text {
      margin-top: 20px;
      width: 100%
  }
  .termsmain-glt-text h3 {
      font-size: 22px;
      padding-top: 5px
  }
  .termsmain-glt-text p:not(:last-child) {
      margin-bottom: 25px
  }
  .termsmain-licenses-wrapper {
      padding-bottom: 130px
  }
  .termsmain-ut-wrapper h2 {
      font-size: 70px;
      line-height: 1;
      margin-bottom: 30px
  }
  .termsmain-ut-text h3 {
      font-size: 24px
  }
  .termsmain-licenses-wrapper>h2 {
      font-size: 70px;
      line-height: 1;
      margin-bottom: 30px
  }

  .header-tab-hidden {
      display: inline-block !important
  }

  .header-tab-visible {
      display: none
  }



  .header-container h1 {
      flex-basis: 57%;
      z-index: 99;
      width: 160px
  }

  .header-container h1 img {
      width: 160px
  }



  .header-menu li {
      float: none;
      text-align: left
  }

  .header-menu li a {
      font-size: 20px;
      padding: 20px 0;
      width: 100%
  }

  .header-list ul {
      position: static;
      background: none;
      opacity: 1;
      flex-direction: row;
      width: 100%;
      margin-bottom: 50px;
      padding-top: 0;
      padding-left: 45px;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between
  }

  .header-list-news,
  .header-list-synthesizer,
  .header-list-vocoflex {
      padding-bottom: 0 !important;
      margin-bottom: 0 !important
  }

  .header-list ul li {
      overflow: visible;
      height: auto;
      width: 50%;
      display: none
  }

  .header-list ul>li:first-child {
      margin-bottom: 0
  }

  .header-list:hover ul li {
      overflow: visible;
      height: auto
  }

  .header-list ul li a {
      background-color: rgba(0, 0, 0, 0);
      padding: 13px 0;
      display: inline-block;
      width: 100%
  }

  .header-list ul li:last-child a {
      margin-bottom: 58px
  }

  .header-list:not(:last-child) {
      margin-right: 0
  }

  .header-langs {
      z-index: 99;
      margin-left: 0
  }

  .header-langs .header-langpc{
    display: none;
  }

  .header-lang {
      font-size: 12px;
      padding: 9px 0
  }

  .header-lang ul li a,
  .header-lang ul li span {
      font-size: 12px;
      opacity: 1;
  }

  .header-spMenu span {
      display: block;
      width: 30px;
      height: 1px;
      background-color: #fff;
      transition: all .3s ease-in
  }
  .header-spMenu span:first-child {
      margin-bottom: 8px
  }
  .sp-header-download {
      display: block;
      position: absolute !important;
      bottom: 10px;
      right: 10px
  }
  .sp-header-download .sp-header-download-link {
      display: block;
      width: 100px;
      height: 100px;
      padding: 19.5px 0;
      text-align: center;
      border: 1px solid #7b9f35;
      z-index: 98;
      margin-bottom: 0;
      line-height: 1.5
  }
  .sp-header-download .sp-header-download-link p:first-child {
      font-size: 10px;
      color: #7b9f35;
      transform: scale(0.9);
      letter-spacing: .9px
  }
  .sp-header-download .sp-header-download-link p:nth-child(2) {
      font-size: 16px;
      color: #7b9f35;
      font-weight: 600;
      margin-bottom: 4px
  }
  .sp-header-download .sp-header-download-link img {
      width: 12px;
      margin: 0 auto
  }

  .footer-wrapper {
    padding: 20px 20px 25px;
    position: relative;
  }

  .footer-wrapper .section-width {
    width: 100%;
    padding: 0;
    margin: 0 auto;
  }

  .footer-menus {
    grid-template-columns: 100%;
    padding-bottom: 32px;
    margin-bottom: 0;
    gap: 32px;
    border: none;
  }

  .footer-menus .col-right {
    gap: 20px;
    display: grid;
    grid-template-columns: 43.02vw 38.14vw;
  }

  .menu-3-wrapper.mobile{
    margin-bottom: 32px;
    padding-bottom: 32px;
    border-bottom: 1px solid #2B2B2B;
  }

  .menu-3-wrapper.mobile ul{
    gap: 20px;
    display: grid;
    grid-template-columns: 43.02vw 38.14vw;
    justify-content: space-between;
  }


  .footer-wrapper .logo-foot, 
  .footer-wrapper .logo-foot img {
    width: 37.44vw;
  }

  .footer-wrapper .logo-foot {
    margin-bottom: 20px;
  }





  .footer-credit {
    text-align: left;
    padding-bottom: 0;
    grid-template-columns: 100%;
    gap: 28px;
  }

  .footer-credit .col-right {
    display: grid;
    gap: 28px;
  }

  .footer-credit .col-left,
  .privacy-policy{
    order: 2;
  }

  .social-media {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

















  .footer-credit small {
      font-size: 12px;
      color: rgba(255, 255, 255, .4)
  }
  .fixed-download {
      width: 100px;
      height: 100px;
      padding: 19.5px 0;
      right: 10px;
      bottom: 10px;
      z-index: 98
  }
  .fixed-download p:first-child {
      font-size: 10px;
      transform: scale(0.9)
  }
  .fixed-download p:nth-child(2) {
      font-size: 16px;
      margin-bottom: 4px
  }
  .fixed-download img {
      width: 12px;
      margin: 0 auto
  }
  .fixed-download-contact {
      width: 100px;
      height: 100px;
      padding: 19.5px 0;
      right: 10px;
      top: -109px;
      z-index: 98
  }
  .fixed-download-contact p:first-child {
      font-size: 10px;
      transform: scale(0.9)
  }
  .fixed-download-contact p:nth-child(2) {
      font-size: 16px;
      margin-bottom: 4px
  }
  .fixed-download-contact img {
      width: 12px;
      margin: 0 auto
  }

  .div-more {
      text-align: left
  }

  .pconly {
      display: none
  }

  .sponly {
      display: block
  }
  
  .mv-lead {
      text-align: center
  }
  .mv-title1 {
      justify-content: center;
      font-size: 18vw;
      margin-left: 5px
  }
  .mv-title2 {
      margin-left: 0;
      font-size: 15.9vw;
      letter-spacing: -0.02em
  }
  .mv-text {
      font-size: 12px;
      line-height: 2;
      white-space: nowrap;
      letter-spacing: .06em
  }
  .mv-scroll {
      font-size: 12.5px
  }
  .mv-scroll:after {
      top: 27px
  }

  .news-wrapper {
      max-width: calc(100% - 50px);
      padding: 85px 0 120px
  }
  .news-contents {
      display: block
  }
  .news-contentLeft p {
      font-size: 11px;
      margin-bottom: 45px;
      margin-top: -15px
  }
  .news-contentRight {
      width: 100%;
      margin-top: 0;
      margin-bottom: 50px
  }
  .news-article {
      padding: 15px 0
  }
  .news-thumbnail {
      flex-basis: 23%
  }
  .news-menu {
      flex-basis: 68%
  }
  .news-menu time {
      font-size: 10px;
      margin-right: 12px
  }
  .news-category {
      display: inline-block;
      margin-bottom: 4px;
      font-size: 10px
  }
  .news-title {
      font-size: 14px
  }
  
  .product-wrapper {
      background: none;
      padding-top: 23%;
      padding-bottom: 160px
  }
  .product-content {
      max-width: 100%
  }
  .product-content h2 {
      margin-bottom: -7.5%;
      margin-left: 20px;
      margin-right: 20px;
      position: relative
  }
  .product-content img {
      width: 100%
  }
  .product-leading {
      padding-left: 0;
      text-align: center;
      max-width: calc(100% - 70px);
      margin: 50px auto 0
  }
  .product-title {
      font-size: 22px;
      line-height: 1.6;
      text-align: left;
      margin-bottom: 10px;
      font-weight: 600
  }
  .product-annotation {
      font-size: 10px;
      text-align: left;
      margin-bottom: 20px
  }
  .product-text {
      font-size: 12px;
      margin-bottom: 40px;
      text-align: left
  }

  .about-wrapper {
      padding-top: 57%;
      padding-left: 0;
      margin-left: 35px;
      background: url("../img/about-bgsp.png") left top/contain no-repeat;
      padding-bottom: 135px
  }
  .about-contents {
      display: block
  }
  .about-content {
      width: 100%;
      padding-right: 35px
  }
  .about-content img {
      width: 120px
  }
  .about-annotation {
      font-size: 10px;
      margin-bottom: 25px
  }
  .about-text {
      font-size: 12px;
      margin-bottom: 40px
  }

  .contact-wrapper {
      padding-bottom: 160px
  }
  .contact-annotation {
      font-size: 10px
  }
  .contact-text {
      font-size: 12px;
      margin-bottom: 40px
  }

  .single-title h1 {
      font-size: 24px
  }
  .single-content h2 {
      font-size: 22px
  }
  .single-content h3 {
      font-size: 20px
  }
  .single-content h4 {
      font-size: 18px
  }
  .single-content h5 {
      font-size: 16px
  }
  .single-content h6 {
      font-size: 14px
  }
  .single-footer-wrapper {
      padding-top: 100px;
      padding-bottom: 40px;
      margin-bottom: 40px
  }
  .single-navi {
      padding-bottom: 150px;
      justify-content: center;
      position: relative
  }
  .single-navi-prev {
      position: absolute;
      top: 0;
      left: 0
  }
  .single-navi-next {
      position: absolute;
      top: 0;
      right: 0
  }
  .single-navi-prev a {
      padding-left: 14px
  }
  .single-navi-next a {
      padding-right: 14px
  }
  .single-navi-prev a:before {
      width: 10px;
      height: 10px;
      top: 4px;
      left: 0
  }
  .single-navi-next a:before {
      width: 10px;
      height: 10px;
      top: 3.5px;
      right: 0
  }
  .single-sns-facebook,
  .single-sns-twitter {
      width: 20px
  }
  .single-sns-share {
      margin-right: 25px;
      font-size: 14px
  }
  .single-sns-facebook {
      margin-right: 17px
  }
  .single-navi span a,
  .single-tags a {
      font-size: 14px
  }
  .single-navi-index a img {
      width: 12px;
      margin-right: 8px
  }
  .related_post_title {
      font-size: 13.8vw !important;
      margin-bottom: 50px !important
  }
  .related_post_title:after {
      font-size: 10px
  }
  ul.related_post {
      text-align: center
  }
  ul.related_post li {
      text-align: left;
      width: 300px
  }
  ul.related_post li:not(:last-child) {
      margin-right: 0;
      margin-bottom: 50px
  }
  .wp_rp_title {
      margin-top: 10px
  }

  .article-wrapper {
      padding-top: 100px
  }
  .article-wrapper h2 {
      margin-bottom: 40px
  }
  .article-wrapper h2 a {
      font-size: 65px
  }
  .article-title {
      margin-bottom: 60px;
      margin-top: 18px
  }
  .article-title h2 {
      font-size: 85px;
      margin-right: 0;
      display: block;
      line-height: 1;
      margin-bottom: 10px
  }
  .tag-title h2 {
      font-size: 60px;
      white-space: normal
  }
  .article-title>div {
      display: block;
      line-height: 2;
      font-size: 12px
  }
  .article-title>div p:first-child {
      margin-bottom: 10px;
      line-height: 1.8
  }
  .article-title>div p:last-child {
      line-height: 1.5
  }
  .article-menus {
      display: block
  }
  .article-menus article {
      width: 100%
  }
  .article-menus article:not(:nth-child(3n)) {
      margin-right: 0
  }
  .article-menu time {
      font-size: 10px;
      margin-right: 15px
  }
  .article-menu ul li a {
      font-size: 10px
  }
  .wp-pagenavi .page {
      font-size: 12px;
      margin-right: 30px
  }
  .wp-pagenavi .current,
  .wp-pagenavi .extend {
      margin-right: 30px;
      font-size: 12px;
      top: 0
  }
  .previouspostslink {
      margin-right: 45px
  }
  .nextpostslink {
      margin-left: 15px
  }

  .contactmain-wrapper {
      padding-top: 120px;
      padding-bottom: 130px
  }
  .contactmain-content {
      display: block
  }
  .contactmain-title h2 {
      font-size: 75px;
      line-height: 1;
      margin-bottom: 12px
  }
  .contactmain-text p {
      line-height: 2;
      letter-spacing: .075em
  }

  .error-wrapper {
      padding-top: 120px;
      padding-bottom: 130px
  }
  .error-content {
      display: block
  }
  .error-title h2 {
      font-size: 17vw
  }
  .error-text p {
      font-size: 12px;
      line-height: 2
  }

  #modal-content-close {
      top: -30%;
      right: -3%
  }

  .syn-heading h2 {
      font-size: 70px;
      margin-bottom: 5px
  }
  .syn-heading p {
      font-size: 11px
  }

  .syn-mv-wrapper {
      padding-top: 113px
  }
  .syn-mv-play div {
      width: 225px
  }
  .syn-mv-play div span {
      font-size: 31px
  }
  .syn-mv-play div img {
      width: 54.5px;
      margin-right: 12.5px;
      display: inline-block;
      vertical-align: middle;
      position: static;
      transform: translate(0)
  }
  .syn-mv-text {
      padding-top: 38px;
      padding-bottom: 151.5px;
      display: block
  }
  .syn-mv-text-left {
      width: 100%
  }
  .syn-mv-text-left h3 {
      font-size: 22px;
      margin-top: 0;
      margin-bottom: 5px
  }
  .syn-mv-text-left p {
      font-size: 11px;
      margin-bottom: 28px
  }
  .syn-mv-text-right {
      width: 100%
  }
  .syn-mv-text-right p {
      font-size: 12px
  }
  .syn-mv-text-right p:first-child {
      margin-bottom: 23px
  }
  .syn-mv-play-pc {
      display: none !important
  }

  .syn-feature-wrapper {
      padding-bottom: 160px
  }
  .syn-feature-heading {
      margin-bottom: 68px
  }
  .syn-feature-content {
      margin-bottom: 88px
  }
  .syn-feature-content-1,
  .syn-feature-content-2,
  .syn-feature-content-3,
  .syn-feature-content-4,
  .syn-feature-content-5 {
      max-width: 91.5%
  }
  .syn-feature-content-5 {
      margin-bottom: 80px
  }
  .syn-feature-title {
      font-size: 55px;
      margin-bottom: 3px
  }
  .syn-feature-title:before {
      font-size: 16px;
      letter-spacing: .06em;
      top: -18px;
      left: 0
  }
  .syn-feature-subtitle {
      font-size: 11px;
      letter-spacing: .06em;
      margin-bottom: 25px
  }
  .syn-feature-spfix {
      display: inline-block
  }
  .syn-feature-detail {
      width: 100%
  }
  .syn-feature-content-2 .syn-feature-detail,
  .syn-feature-content-4 .syn-feature-detail {
      text-align: right
  }
  .syn-feature-content-2 .syn-feature-spfix,
  .syn-feature-content-4 .syn-feature-spfix {
      text-align: left
  }
  .syn-feature-text {
      font-size: 12px;
      letter-spacing: .06em
  }
  .syn-feature-content-1 .syn-feature-text,
  .syn-feature-content-3 .syn-feature-text,
  .syn-feature-content-5 .syn-feature-text {
      margin-right: 9.3%
  }
  .syn-feature-content-2 .syn-feature-text,
  .syn-feature-content-4 .syn-feature-text {
      text-align: left;
      margin-left: 9.3%
  }
  .syn-feature-image {
      width: 100%;
      height: auto;
      margin-bottom: 35px
  }
  .syn-feature-image3 a img:last-child,
  .video-btn {
      width: 70px
  }
  .syn-feature-support {
      display: block;
      padding: 26px 30px 35px
  }
  .syn-feature-support h3 {
      font-size: 34px;
      margin-bottom: 8px
  }

  .syn-lineup-heading {
      margin-bottom: 47.5px
  }
  .syn-lineup-wrapper {
      padding-bottom: 125px
  }
  .syn-lineup-contents {
      width: calc(100% - 70px);
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap
  }
  .syn-lineup-content:not(:nth-child(4n)) {
      margin-right: 0
  }

  .syn-gallery-heading {
      margin-bottom: 60px
  }
  .slick-dotted.slick-slider {
      margin-bottom: 108px
  }
  .slider-item h3 {
      margin-bottom: 0
  }
  .slider-item p {
      font-size: 10px
  }
  .slick-dots {
      bottom: -40px
  }
  .slick-dots li {
      margin: 0 4.5px
  }
  .slick-dots li button:before {
      transform: scale(0.8)
  }
  .slick-dots li:nth-child(n+4) {
      display: inline-block
  }
  .slick-next,
  .slick-prev {
      bottom: -86px
  }
  .slick-prev {
      left: 8%
  }
  .slick-next {
      right: 8%
  }

  .syn-studio-wrapper {
      padding-bottom: 100px;
      padding-top: 90px
  }
  .syn-studio-heading {
      margin-bottom: 20px
  }
  .syn-studio-heading h2 {
      font-size: 60px
  }
  .tab_item {
      font-size: 15px
  }
  .tab_item_basic {
      padding-right: 24.5px
  }
  .tab_item_pro {
      padding-left: 25.5px
  }
  .syn-studio-tabs {
      margin: 0;
      width: 100%;
      max-width: 100%
  }
  .syn-studio-tab {
      width: 100%;
      max-width: 100%;
      margin: 40px 0 0
  }
  .syn-studio-content {
      display: block;
      max-width: calc(100% - 70px);
      padding-top: 37px;
      margin: 0 auto 69px
  }
  .syn-studio-text {
      width: 100%;
      font-size: 12px;
      line-height: 1.6;
      margin-bottom: 75px
  }
  .syn-studio-function {
      margin: 22.5px 0;
      padding: 22.5px 13px 23.7px 18px;
      line-height: 1.8
  }
  .syn-studio-environment {
      width: 100%
  }
  .syn-studio-environment h3 {
      font-size: 22px;
      text-align: center;
      margin-bottom: 25.7px
  }
  .syn-studio-environment tr td:first-child {
      margin-right: 25px
  }
  .syn-studio-environment tr td:last-child {
      font-size: 11px
  }
  .syn-studio-bottom {
      padding-bottom: 20px
  }
  .syn-studio-bottom h3 {
      font-size: 28px;
      margin-bottom: 23.5px
  }
  .syn-studio-bottom div {
      max-width: calc(100% - 70px);
      display: block
  }
  .syn-studio-bottom div a {
      display: block;
      width: 100%;
      height: 88px;
      line-height: 88px;
      margin-bottom: 15px;
      font-size: 16px
  }

  .aboutmain-mv-content {
      display: block;
      margin: -16% auto 120px;
      max-width: calc(100% - 70px)
  }
  .aboutmain-mv-title {
      width: 100%
  }
  .aboutmain-mv-title h2 {
      font-size: 74px
  }
  .aboutmain-mv-title p {
      font-size: 11px
  }
  .aboutmain-mv-text {
      width: 100%
  }
  .aboutmain-mv-text p {
      font-size: 12px;
      margin-top: 28px
  }
  .aboutmain-message-wrapper {
      margin: 0 auto 130px;
      max-width: calc(100% - 70px)
  }
  .aboutmain-message-wrapper h2 {
      font-size: 70px;
      line-height: 1;
      margin-bottom: 30px
  }
  .aboutmain-message-contents {
      display: block;
      position: relative
  }
  .aboutmain-message-img {
      position: absolute;
      width: 24%;
      top: 0;
      left: 0
  }
  .aboutmain-message-text {
      margin-top: 20px;
      width: 100%
  }
  .aboutmain-message-text h3 {
      font-size: 18px;
      padding-left: 32%;
      padding-top: 5px
  }
  .aboutmain-message-text p:not(:last-child) {
      margin-bottom: 25px
  }
  .aboutmain-company-wrapper {
      max-width: 100%;
      flex-direction: column;
      padding-bottom: 130px
  }
  .aboutmain-company-content h2 {
      font-size: 70px;
      text-align: center;
      line-height: 1;
      margin-bottom: 30px
  }
  .aboutmain-company-content {
      margin-left: 0;
      margin-top: 0;
      width: 100%;
      margin-bottom: 30px
  }
  .aboutmain-company-content div {
      position: relative;
      padding-top: 54.4%;
      overflow: hidden
  }
  .aboutmain-company-content iframe {
      position: absolute;
      width: 100%;
      top: 0;
      left: 0;
      transform: translateY(-35%)
  }
  .aboutmain-company-content table {
      max-width: calc(100% - 70px);
      margin: 44px auto 0
  }
  .aboutmain-company-content tr td {
      font-size: 12px
  }
  .aboutmain-company-content tr td:first-child {
      width: 100px;
      padding-right: 40px
  }



  
  @media (max-width: 430px){

    #section-9.section .support-wrapper.with-list{
      padding-top: 300px;
    }

    #section-9.section .packages .text {
      padding: 7.44vw 10px 3.72vw;
    }

    .recording-item {
      width: 100%;
      margin-bottom: 20px;
      padding: 15px;
      gap: 10px;
    }

    .recording-info .type p {
      font-size: 14px;
    }

    .recording-item .col-left {
      width: 70%;
    }

    .recording-item .col-right {
      width: 40%;
    }

    #section-2.section .text-column {
      min-height: 280px;
    }

    .progress-bar{
      max-width: 130px;
    }

  }


  @media (max-width: 400px){

    #section-2.section .text-column {
      min-height: 330px;
    }

    .dreamtonics.modal .modal__info_title {
      font-size: 20px !important;
    }

  }








}

@media (max-width: 1366px){

  #syn.new-concept .section-width {
    width: 100%;
  }

  .mask{
    display: none;
  }

}



.dreamtonics.bar{
  display: none !important;
}

.dreamtonics.modal .dreamtonics.bar{
  display: flex !important;
}