/*
 Theme Name:   Studio45° Zygmunt Miętus
 Author:       Gosia Góźdź myspot.ON
 Template:     Divi
 Version:      2.11
*/


/* ============== GLOBAL STYLES ============== */

/* Fix a horizontal scroll bug on mobile browsers */
#page-container {
overflow:hidden;
width:100%;
max-width:100%; }


/* === LOKALNE FONTY: SUSE === */
@font-face {
font-family: 'SUSE';
src: url('/wp-content/themes/dsa-child/fonts/SUSE-ExtraBold.ttf') format('truetype');
font-weight: 800;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: 'SUSE';
src: url('/wp-content/themes/dsa-child/fonts/SUSE-Bold.ttf') format('truetype');
font-weight: 700;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: 'SUSE';
src: url('/wp-content/themes/dsa-child/fonts/SUSE-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: 'SUSE';
src: url('/wp-content/themes/dsa-child/fonts/SUSE-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: 'SUSE';
src: url('/wp-content/themes/dsa-child/fonts/SUSE-Regular.ttf') format('truetype');
font-weight: 400;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: 'SUSE';
src: url('/wp-content/themes/dsa-child/fonts/SUSE-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
font-display: swap;
}


/* === PRZYPISANIE FONTU GLOBALNIE === */
body, .zm-button {
font-family: 'SUSE', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
font-weight: 500;
}

p, ul, ol, li, blockquote,
table, th, td, tr, span, div {
font-weight: 400;
}

strong {
font-weight: 700;
}

/* Text Module */
.zm-text h1,
.zm-text h2,
.zm-text h3,
.zm-text h4,
.zm-text h5,
.zm-text h6 {
padding-bottom: .25em;
}

.zm-text h1:not(:first-child),
.zm-text h2:not(:first-child),
.zm-text h3:not(:first-child),
.zm-text h4:not(:first-child),
.zm-text h5:not(:first-child),
.zm-text h6:not(:first-child) {
padding-top:.25em;
}

.zm-text ul li,
.zm-text ol li {
padding-bottom: .25em;
line-height: 1.2em;
}

.zm-text p:last-of-type {
padding-bottom: .5em;
}
.zm-text p:last-child {
padding-bottom: 0;}


.zm-text ul,
.zm-text ol {
padding-left: 1.3em;
margin-left: 0;
}

.zm-text ul li,
.zm-text ol li {
line-height: 1.2em;
list-style-position: outside;
text-indent: 0;
}

.zm-text ol li {
counter-increment: section;
list-style: none;
position: relative;
}


/* ============== LAYOUT ============== */

/*SELECTION*/
::selection {
background-color: #FE6E42;
color: #ffffff;}

/* Centered Section */
@media (min-width:980px){
.zm-center {
display:flex;
flex-direction:row;
align-items:center;}
}

/**REVERSE COLUMNS ON MOBILE**/
@media screen and (max-width: 980px) {
.zm-reverse {
display: flex;
flex-direction: column-reverse;}
}


/* ============== LINKOWANIE W MENU ============== */
#zm-header .et-menu li a {
  color: #FFFFFF !important;
}

#zm-header .et-menu li a:hover {
  color: #FE6E42 !important;
}

#zm-header .et-menu li.myspoton-active a {
  color: #FE6E42 !important;
}

#zm-header .et-menu li.current-menu-item a {
  color: #FE6E42 !important;
}

#zm-header .et-menu li a::before {
  content: "";
  display: block;
  width: 12px;
  height: 35px;
  background-image: url("http://studio45.myspoton.pl/wp-content/uploads/2025/06/stopien.svg");
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  right: -15px !important;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0;
  transition: opacity 0.3s ease-in-out, right 0.3s ease-in-out;
}

#zm-header .et-menu li a:hover::before {
  opacity: 1;
  right: -18px;
}

#zm-header .et-menu li.myspoton-active a::before{
  opacity: 1;
  right: -18px;
}

#zm-header .et-menu li.current-menu-item a::before {
  opacity: 1;
  right: -18px;
}

#zm-header .et-menu li {
  position: relative;
  margin: 0 5px;
}


/* ============== HEADER ============== */
#zm-header .et_pb_row>.et_pb_column {
display: flex;
align-items: center;
flex-wrap: wrap;
}

#zm-header .canvas-menu {
flex-grow: 1;
}

@media (min-width:1300px){
#zm-header li {
padding:0px 15px;
}}

@media (max-width:1088px) {
#zm-header li {
padding:0px 8px;
}
#zm-header li a {
font-size:15px;}}

#zm-header li.menu-item a{
border: none!important;
}


/* ============== STICKY HEADER ============== */
.sticky-header {
opacity: 0;
transform: translateY(-10px);
visibility: hidden;
pointer-events: none;
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px); /* Safari */
transition: none;
}

/* Ukrycie miejsca w layoucie */
.sticky-header:not(.et_pb_sticky--top) {
height: 0 !important;
overflow: hidden !important;
padding: 0 !important;
margin: 0 !important;
visibility: hidden !important;
pointer-events: none !important;
opacity: 0 !important;
}

/* Widoczny po scrollu */
.et_pb_sticky--top.sticky-header {
animation: fadeInSticky 0.5s ease-out 0.3s forwards;
visibility: visible !important;
pointer-events: auto !important;
opacity: 1 !important;
padding-top: 10px !important;
padding-bottom: 10px !important;
}

/* Padding w wierszu – jeśli Divi go nadpisuje */
.sticky-header .et_pb_row {
padding-top: 0 !important;
padding-bottom: 0 !important;
transition: padding 0.4s ease;
}

.et_pb_sticky--top.sticky-header .et_pb_row {
padding-top: 10px !important;
padding-bottom: 10px !important;
}

/* Animacja pojawiania się */
@keyframes fadeInSticky {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

/* Reset transform dla sticky */
#zm-header.et_pb_sticky * {
transform: none !important;
}


/* ============== MOBILE MENU ============== */
ul#mobile_menu1 a,
ul#mobile_menu2 a{
    font-size:24px;
    margin-bottom:15px;
}

@media (max-width:980px) {
#zm-header .et_pb_row {
    display: flex;
    align-items:center;}
	
#zm-header .et_pb_column {
    margin-bottom:0;}

 #zm-header .mobile_menu_bar:before {
    font-size: 40px;  }

 #zm-header .et_mobile_menu {
    position: fixed;
    display: block!important;
    margin: 0!important;
    height: 100%!important;
    min-height: 100vh;
    padding: 150px 0 0!important;
    max-width: 300px;
    left: auto;
    right: -300px;
    top: 0;
    z-index: 99;
    transition: all .3s ease-in-out;}

#zm-header .opened .et_mobile_menu {
right: 0;}

#zm-header .opened .mobile_menu_bar:before {
    content:'\4d';
	color:#231F20;}

 #zm-header ul#mobile_menu1 a,
#zm-header ul#mobile_menu2 a {
 margin-left:20px!important;}

 #zm-header .mobile_menu_bar {
    z-index: 109; }

 #zm-header.et_pb_sticky * {
    transform:none!important;}

#zm-header .sub-menu {
    width:auto;
    padding:0;}

#zm-header .sub-menu li a,
 #zm-header .sub-menu li a:hover,
 #zm-header.sub-menu li:last-child a {
    padding:10px 25px 10px 35px;
}}


/* ============== FOOTER ============== */
#zm-footer .et_pb_menu__menu,
#zm-footer .et_pb_menu .et_pb_menu__menu>nav>ul {
display: flex;
flex-direction:column!important;
flex-wrap:nowrap!important;
align-items:flex-end!important;
}

#zm-footer .et_pb_menu__wrap {
justify-content:flex-end!important;
}

@media (max-width:980px) {
#zm-footer .et_mobile_nav_menu {
display: none!important;
}

#zm-footer .et_pb_menu--style-left_aligned .et_pb_menu__wrap {
justify-content:flex-start;}

#zm-footer .et_pb_menu__menu,
#zm-footer .et_pb_menu .et_pb_menu__menu>nav>ul {
align-items:flex-start!important;
}
#zm-footer .et_pb_menu__wrap {
justify-content:flex-start!important;
}}



/* ============== PRZYCISKI ============== */
.zm-button:after {
content: '';
display: inline-block;
width: 1em;
height: 1.1em;
margin-left:0.4em;
background-image: none;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
vertical-align: middle;
position: relative;
opacity: 0;
top:-0.1em;
transform: translateX(-0.25em);
transition: opacity 0.3s ease, transform 0.3s ease, background-image 0.3s ease;
}

.zm-button:hover:after {
background-image: url('http://studio45.myspoton.pl/wp-content/uploads/2025/06/stopien.svg');
opacity: 1;
transform: translateX(0);
}

.zm-buttons .et_pb_button_module_wrapper {
display: inline-block;
}

@media (min-width: 768px) and (max-width: 980px) {
.zm-buttons {
text-align: left;
display: block;
}}

@media (hover: none) and (pointer: coarse) {
.zm-button:hover:after,
.zm-button:after{
all: unset!important;
cursor: default;
}
}


/* ============== BACK TO TOP ============== */
.et_pb_scroll_top {
padding:10px!important;}

.et_pb_scroll_top.et-visible {
opacity: 1;
-webkit-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
-moz-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
-o-animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
animation: fadeInBottom 1s 1 cubic-bezier(.77,0,.175,1);
}

.et_pb_scroll_top.et-pb-icon {
right: 15px;
bottom: 20px;
border-radius: 50px;
border: 2px solid #FE6E42;
background: #E4E2DC;
padding: 4px;
transition: all .2s ease-in;
}

.et_pb_scroll_top.et-pb-icon:hover {
background: #ffffff;}

.et_pb_scroll_top:before {
content: "\21";
	color:#FE6E42;}




/* ============== COOKIES BANNER ============== */
.cky-consent-bar {
border-radius:0px!important;}

.cky-consent-bar p {
line-height:1.3em;}

@media(max-width:980px){
.cky-consent-bar p {
font-size:13px;
line-height:1.0;
}
.cky-consent-bar {
padding:10px!important;
}

p.cky-title, .cky-notice-des, .cky-notice-btn-wrapper {
padding:0px 15px!important;
}

.cky-notice-btn-wrapper {
display:inline-block!important;
}

button.cky-btn {
width:100px;
padding:.25em;
}}

	
/* ============== MARQUEE ============== */
.scroll-container {
  position: relative;
  width: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.scroll-track {
  display: flex;
  flex-wrap: nowrap;
  animation: scroll-animation 10s linear infinite;
  will-change: transform;
}

.scroll-track > div {
  flex: 0 0 auto;
  padding: 0 20px;
}

@keyframes scroll-animation {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}


/* ============== FORMULARZ ============== */
.forminator-field {
display: flex;
flex-direction: column;
text-align: left;
align-items: flex-start;
justify-content: flex-start;
height: 100%;}

.forminator-field input,
.forminator-field textarea{
padding:15px 30px!important;
border-radius:25px!important;
background:#E4E2DC!important;
border: 2px solid #ffffff!important;
    font-size:16px!important;
}

button.forminator-button.forminator-button-submit {
padding: .5em 2.5em!important;
font-size:18px!important;
border-radius:25px!important;
border: 2px solid #FF6E42!important;
color: #ffffff!important;
background:#FF6E42!important;
display: block!important;
margin-left: auto!important;
margin-top:20px!important;
box-shadow:none!important;
}

button.forminator-button.forminator-button-submit:hover{
background:#ffffff!important;
color: #FF6E42!important;
}

span.forminator-checkbox-label {
font-size:12px!important;
line-height:1.1em!important;
color:#000000!important;
}

span.forminator-checkbox-label a {
color:#FF6E42!important;
}

.forminator-checkbox {
align-items:flex-start!important;
}


span.forminator-checkbox-box {
border-radius:25px!important;
border: 2px solid #ffffff!important;
}


/* ============== WERTYKALNE NAPISY - SEKCJA ============== */
.vertical-title {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  height:auto;
}

.zm-3-kolumny > .kolumna:nth-child(1) {
  width: 12%;
}

.zm-3-kolumny > .kolumna:nth-child(2) {
  width: 37%;
}

.zm-3-kolumny > .kolumna:nth-child(3) {
  width: 37%;
}



/* ============== TIMELINE ============== */
.et_pb_module.diti_timeline_item {
    background:transparent;
    margin-top:25px;
}

span.et-pb-icon.timeline-icon.et-pb-icon-circle.et-pb-icon-circle-border {
    border: 2px solid #231F20;
}

.swiper-slide-active span.et-pb-icon.timeline-icon.et-pb-icon-circle.et-pb-icon-circle-border{
    border: 2px solid #FF6E42;
}

.timeline-panel.timeline-box.et-waypoint.et_pb_animation_top.et-animated {
    border: 2px solid #FF6E42;
    border-radius:20px;
}

.timeline-panel.timeline-box.et-waypoint.et_pb_animation_top.et-animated {
    margin:20px;
}

.swiper-pagination-progressbar {
  height: 2px !important;
}

.swiper-pagination-progressbar-fill {
  height: 2px !important;
}

.timeline-swiper-button {
  width: 30px !important;
  height: 40px !important;
}

.timeline-swiper-button::after {
  border-width: 2px !important;
  font-size: 30px !important;
}

/* ============== HERO ============== */
.hero-section {
  position: relative;
  z-index: 1;
  min-height: 572px;
  overflow: hidden;
  background-image: url('http://studio45.myspoton.pl/wp-content/uploads/2025/07/Hero-studio-45-stopni.png'); /* Ustaw swoje tło tutaj */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Efekt Ken Burns */
.hero-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background-image: inherit;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transform: scale(1.2);
  animation: kenBurns 3.5s ease-out forwards;
  will-change: transform;
}

/* Sekcja po hero */
.kolejna-sekcja {
  position: relative;
  z-index: 3;
}

/* Wiersz z warstwą */
.hero-overlay-row {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100%;
  height: 572px;
  z-index: 2;
  pointer-events: none;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #FE6E42;
  visibility: hidden;
  animation:
    showOverlayRow 0s ease-in 0.005s forwards,
    removeBlackBg 0s linear .5s forwards;
}

/* Brązowa warstwa */
.hero-overlay {
  width: 100%;
  height: 572px;
  background-color: #231F20;
  transform: translateY(572px);
  animation:
    overlaySlideIn 0.6s ease-out forwards,
    overlaySlideOut 0.6s ease-in 0.8s forwards,
    fadeOutOverlay 0s linear 1.5s forwards;
}

/* Animacje */
@keyframes overlaySlideIn {
  from { transform: translateY(572px); }
  to   { transform: translateY(0); }
}

@keyframes overlaySlideOut {
  from { transform: translateY(0); }
  to   { transform: translateY(572px); }
}

@keyframes fadeOutOverlay {
  to { visibility: hidden; }
}

@keyframes removeBlackBg {
  to { background-color: transparent; }
}

@keyframes showOverlayRow {
  to { visibility: visible; }
}

@keyframes kenBurns {
  from { transform: scale(1.2); }
  to   { transform: scale(1); }
}

/* ============== MOBILE FIX ============== */
@media (max-width: 767px) {
  .hero-section {
    min-height: 100vh;
  }

  .hero-overlay-row,
  .hero-overlay {
    height: 100vh;
  }

  .hero-section::before {
    animation: kenBurns 3.5s ease-out forwards;
    transform: scale(1.2);
  }
}

.hero-overlay-row.et_pb_row {
  width: 100vw !important;
  max-width: 100vw !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  box-sizing: border-box;
}

.hero-overlay {
  width: 100vw !important;
  max-width: 100vw !important;
}




/* ============== KURSOR ============== */

/* === Kursor SVG === */
#custom-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  background-image: url('http://studio45.myspoton.pl/wp-content/uploads/2025/07/pointer.svg');
  background-size: contain;
  background-repeat: no-repeat;
  pointer-events: none;
  z-index: 9999;
  display: none;
  transform: translate(-50%, -50%);
  transition: opacity 0.15s ease;
}

/* === Ukrycie systemowego kursora === */
/* Wszystkie <img>, które nie są wewnątrz Modula */
img:not(.modula img):not(#zm-header img),
.et_pb_slide:not(#zm-header .et_pb_slide),
.et_pb_slide *:not(#zm-header .et_pb_slide *) {
  cursor: none !important;
}


.custom-cursor-target {
  cursor: none !important;
}