/*
	Theme Name: Notio Child Theme
	Theme URI: https://themeforest.net/item/notio-deluxe-portfolio-theme/10049784
	Description: <strong>A Premium theme for magazine, editor, community and more! WordPress Theme by <a href="http://www.themeforest.net/user/fuelthemes">fuelthemes</a></strong> – Update notifications available on Twitter and Themeforest <a href="http://twitter.com/anteksiler">Follow us on twitter</a> – <a href="http://themeforest.net/user/fuelthemes">Follow us on Themeforest</a>
	Version: 1.0.0
	Author: fuelthemes
	Author URI: http://themeforest.net/user/fuelthemes
	Template: notio-wp
*/



/*
Source - https://stackoverflow.com/a
Posted by Steve K, modified by community. See post 'Timeline' for change history
Retrieved 2025-12-11, License - CC BY-SA 4.0
*/

@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Questrial&display=swap');


/* NORMAL */

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-300-normal.woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-400-normal.woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-400-italic.woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-500-normal.woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-500-italic.woff2');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-600-normal.woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-700-normal.woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-800-normal.woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Metropolis';
  src: url('/wp-content/fonts/metropolis/metropolis-latin-900-normal.woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}









/*----------------------------------------------------------------------------------------------- text */
body, p, h1, h2, h3, h4, h5, h6, blockquote p, .thb-portfolio-filter .filters, .thb-portfolio .type-portfolio.hover-style5 .thb-categories {
    font-family: 'Metropolis', 'DM Sans', system-ui, -apple-system, sans-serif;
	  font-family: "Instrument Sans", sans-serif;
	font-family: "Questrial", sans-serif;
font-optical-sizing: auto;
    font-family: "Hanken Grotesk", sans-serif;
}
body p {
    font-size: 22px;
    line-height: 1.5;
	    margin-bottom: 24px;
    /* letter-spacing: 0.02em; */
}
b, strong {
    font-weight: 800;
}
h1, h2, h3, h4, h5, h6 {
    color: #151515;
    /* text-transform: uppercase;
    letter-spacing: 0.01em; */
}
h1 {
    font-size: 60px;
	line-height: 1.2;
	font-weight: 500;
	font-size: 4.5vw;
font-weight: 300;
line-height: 120%;
}
h2 {
    font-size: 56px;
    line-height: 1.42;
    font-weight: 400;
}
h3 {	
font-size: 32px;
line-height: 1.31;
font-weight: 600;
	margin-bottom: 15px;
}
h6 {
    font-size: 13px;
	line-height: 1.4;
} 
.maintitle {
	
}

/*----------------------------------------------------------------------------------------------- colors */
#full-menu .sf-menu > li.current-menu-item > a, #full-menu .sf-menu > li.sfHover > a, #full-menu .sf-menu > li > a:hover, .header_full_menu_submenu_color_style2 #full-menu .sub-menu a:hover, #full-menu .sub-menu li a:hover, .footer.style1 .social-links a.email:hover, .post .post-title a:hover, .widget.widget_recent_entries ul li .url, .widget.widget_recent_comments ul li .url, .widget.woocommerce.widget_layered_nav ul li .count, .widget.widget_price_filter .price_slider_amount .button, .widget.widget_price_filter .price_slider_amount .button:hover, .pagination .page-numbers.current, .btn.style3:before, .button.style3:before, input[type=submit].style3:before, .btn.style5:hover, .button.style5:hover, input[type=submit].style5:hover, .mobile-menu > li.current-menu-item > a, .mobile-menu > li.sfHover > a, .mobile-menu > li > a:hover, .mobile-menu > li > a.active, .mobile-menu .sub-menu li a:hover, .authorpage .author-content .square-icon:hover, .authorpage .author-content .square-icon.email:hover, #comments .commentlist .comment .reply, #comments .commentlist .comment .reply a, .thb-portfolio-filter.style1 .filters li a:hover, .thb-portfolio-filter.style1 .filters li a.active, .products .product .product_after_title .button, .product-page .product-information .price, .product-page .product-information .reset_variations, .product-page .product-information .product_meta > span a, .woocommerce-tabs .tabs li a:hover, .woocommerce-tabs .tabs li.active a, .woocommerce-info a:not(.button), .email:hover, .thb-iconbox.type3 > span, .thb_twitter_container.style1 .thb_tweet a {

}

:root {
	--text-color: #222;
	--link-hover: #4ac5ab;
	--yellow-color: #fecc03;
	--footer-text-color: #fff;
	--footer-title-color: #fff;
	--big-line-height: 2;
	
}
p {
	color: var(--text-color);
}
a:hover {
	color: var(--link-hover);
}
.text-grey, .text-grey p, .text-grey h2, .text-grey h6 {
    color: #b4b4b4;
}






#full-menu .sf-menu>li>a:hover {
	    color: #fecd37;
    color: #d9fe8a;
	color: #9dff20;
	color: #e2ff2e;
	color: #e3ed49;
}

/*----------------------------------------------------------------------------------------------- menu */
.header {
	
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    background-color: rgb(177 161 139 / 20%);
    background-color: rgb(230 225 218 / 20%);
    border-bottom: 1px solid rgb(255 255 255 / 20%);
}
.header>.row {
    max-width: 93%;
}
.header .logolink .logoimg {
    max-height: 64px;
}



/*fixed*/
/* STATIC – widoczny na starcie */

.header--static {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: transparent !important;
  z-index: 20;
	min-height: 130px !important;
}



/* FIXED – NIEWIDOCZNY na starcie */
.header--fixed {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  transform: translateY(-100%);
  transition: transform .3s ease;
	min-height: 74px;
}




/* PO SCROLLU */
body.header-scrolled .header--fixed {
  transform: translateY(0);
}

/* PO SCROLLU chowamy static */
body.header-scrolled .header--static {
  opacity: 0;
  pointer-events: none;
}






/* FIXED HEADER – wymuś desktop menu */
.header--fixed .menu-holder {
  display: flex;
  align-items: center;
  justify-content: center;
}

.header--fixed .sf-menu {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
	    margin-bottom: 0;
}

/* usuń mobile list-style */
.header--fixed .sf-menu li {
  list-style: none;
  float: none;
}



#full-menu .sf-menu>li>a, .header .sf-menu>li>a {
    display: block;
    letter-spacing: 1.5px;
    font-weight: 400 !important;
    font-size: 16px;
    line-height: 1;
    color: #151515;
    text-transform: uppercase;
    padding: 10px 0;
}
#full-menu .sf-menu>li+li, .header--fixed .sf-menu>li>a {
    margin-left: 20px;
}





.mobile-toggle+.logolink {
    margin-left: 0;
    margin-bottom: 8px;
}
#mobile-menu {
	background: rgba(0,0,0,0.8);
}
@media only screen and (min-width: 64.063em) {
.header {
	min-height: 74px;
}
.site_bars_off .header {
	padding: 0;
}
}



/*----------------------------------------------------------------------------------------------- buttons */
.btn.accent {
	color: #333;
}
.btn {
    font-size: 20px;
    line-height: 2;
    letter-spacing: 0.07em;
    padding: 8px 26px;
}
.btn-text {
    font-size: 26px !important;
line-height: 1.53;
font-weight: 500;
margin: 0px;
}
.btn-text.style4 .arrow>div {
    width: 45px;
}
.btn-text.style4 .arrow, .btn-text.style4 .arrow svg {
    width: 28px;
}
.btn-text.style4 .arrow svg:first-child {
    fill: #FFFF5B;
}

/*----------------------------------------------------------------------------------------------- contact form */
span.wpcf7-list-item {
    margin: 0 !important;
}
label {
    line-height: 1.4;
    max-width: 350px;
}



/*----------------------------------------------------------------------------------------------- home */
.home-hero {
    background-color: #fff27b;
    background-color: #ffff5b;
    /* background-color: #1d1d1d; */
	    background-color: #ffea51;
}
.home-hero .btn.style3:first-of-type::before {
    background: #f9ef91;
}
.home-hero h2 {
    font-size: 4.5vw;
    font-weight: 300;
    line-height: 120%;
    /* letter-spacing: 0.05vw; */
    font-size: 56px;
    /* line-height: 1.42; */
    font-weight: 400;
}


.home-services {
	    /* background: #eeeeee; */
}
.home-services .medium-4 .vc_column-inner {
    border: 1.5px solid #000;
padding: 48px;
}
.home-services .thb-icon {
    padding: 30px 0 50px;
    font-size: 16px;
}
.home-services .thb-icon svg {
    width: 60px;
    height: 60px;
}
.home-services .thb-icon g {
    stroke: #000;
}



.home-clients {
	background-color: #fae857;
	background-color: #eeeeee;
}
.home-clients .medium-3 {
        border: 1px solid;
}



.slick .slick-dots li.slick-active button {
	    background: #ffd300;
}
.thb-testimonials blockquote p {
	font-weight: 500;
    letter-spacing: 0.01em;
	font-style: italic;
	color: #000;
	font-size: 16px;
	line-height: 31px !important;
}
.thb-testimonials cite, .thb-testimonials span {
	color: #000;
	font-weight: 600;
    letter-spacing: 0.04em;
	font-size: 15px;
}




/*----------------------------------------------------------------------------------------------- realizacje */
.realizacje-portfolio {
    padding: 110px 0 90px;
}






.thb-portfolio .thb-placeholder {
    height: 330px;
    overflow: hidden;
    position: relative;
    border-radius: 9px;
	box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 45px 0px;
}
.thb-portfolio .portfolio-inner {
    padding-bottom: 0 !important;
    height: 330px; /* MUSI BYĆ TAKA SAMA JAK PLACEHOLDER */
}



.thb-portfolio .thb-placeholder img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;

    transform: translateY(0);
    transition-property: transform;
    transition-timing-function: cubic-bezier(.25,.1,.25,1); /* naturalny ease */
    transition-duration: 3s; /* nadpisywane w JS */
    transition-delay: 0.4s; /* krótkie opóźnienie */
    will-change: transform;
}
/* .thb-portfolio .type-portfolio.portfolio-style2 .thb-placeholder {
    transition: none !important;
} */
.thb-portfolio .type-portfolio.portfolio-style2:hover .thb-placeholder {
	opacity: 1 !important;
}

a[target="_blank"] .portfolio-link h2::after {
    content: "↗";
    font-size: 17px;
    margin-left: 6px;
    color: #555;
    opacity: 0.7;
}

a[target="_blank"] .portfolio-link h2::after:hover {
    color: #000;
    opacity: 1;
}




/*----------------------------------------------------------------------------------------------- portfolio single */


g {
    stroke: #4ac5ab;
}
.thb-iconbox>span svg {
    width: 45px;
}
.thb-iconbox>span {
	margin-bottom: 20px;
}

.thb-iconbox.type1.left-aligned .content h6, .thb-awards-parent, .portfolio_nav .center_link, .portfolio_nav .post_nav_link {
    font-size: 13px;
	line-height: 1.4;
	text-transform: uppercase;
    font-weight: 400;
	letter-spacing: 0.2em;
}
.thb-iconbox.type1.left-aligned .content h6, .portfolio_nav .post_nav_link, .thb-awards-parent {
	font-weight: 600;
}
.thb-award-description, .portfolio-attributes.style2 .attribute {
	font-family: 'Open Sans', 'BlinkMacSystemFont', -apple-system, 'Roboto', 'Lucida Sans';
	font-size: 13px;
	letter-spacing: 0.02em;
	color: #626262;
	text-transform: none;
	font-weight: 400;
}
.klient-link {
	color:#3aa58e; 
	font-weight: 500;
}



.share_container {
	background: rgba(0,0,0,0.8);
}
.thb-portfolio .type-portfolio.light-title h2 {
		color: #ffffff !important;
}

/*----------------------------------------------------------------------------------------------- footer */
.footer p, .footer ul li, .subfooter p {
	color: #b4b4b4;
	    color: #f0c405;
	color: var(--footer-text-color);
}
.footer h1, .footer h6 {
	    color: #f0c405;
	color: var(--footer-title-color);
}
.footer .columns:nth-child(3) p, .footer .columns:nth-child(4) p, .footer .columns:nth-child(5) p {
line-height: 1.6;	
}
.footer .columns p {
		    font-size: 26px;
}
.footer h6 {
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 10px;
    letter-spacing: .25em;
    font-weight: 600 !important;
    text-transform: uppercase;
}
.footer .columns:nth-child(1) {
    width: 100%;
    max-width: 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
	    padding-bottom: 110px;
}
.footer .columns:nth-child(1) h1 {
    font-size: 80px;
	font-weight: 900;
}
.footer .columns:nth-child(1) p {
	font-size: 37.5px;
}
.footer .columns:nth-child(2) {
    width: 50%;
    max-width: 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
}

.footer .columns:nth-child(2) p {
	font-size: 45px;
}
.footer .columns:nth-child(3), .footer .columns:nth-child(4), .footer .columns:nth-child(5) {
    width: 16.66667%;
    max-width: 16.66667%;
        -ms-flex: 0 0 16.66667%;
        flex: 0 0 16.66667%;
}




.footer.dark+.subfooter.dark {
    border-top: none;
	    padding: 0 45px;
}
.subfooter.full-width-subfooter>.row {
    /* border-top: 1px solid rgba(255, 255, 255, 0.1); */
    padding-top: 20px;
    padding-bottom: 50px;
}






/*----------------------------------------------------------------------------------------------- content */
:root::selection {
  background: #fff27b;
}
#scroll_totop {
	background: #fff27b;
}



.row {
    max-width: 94%;
}
.row > .wpb_column .vc_inner {
	max-width: 1400px;
	margin: 0 auto;
}