/* 
Theme Name: SkyTower
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: 3W Studio
Template: hello-elementor
Version: 2.0.20
Text Domain: skytower
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

.code {color:#0000;}

.elementor:not(.elementor-location-header):not(.elementor-location-footer) .elementor-widget-text-editor :where(p, ul, ol, blockquote) a:not(.elementor-button),
.elementor:not(.elementor-location-header):not(.elementor-location-footer) .elementor-widget-theme-post-content :where(p:not(.elementor-heading-title), ul, ol, blockquote) a:not(.elementor-button),
.entry-content > :where(p, ul, ol, blockquote) a:not(.elementor-button) {color: var( --e-global-color-e55df7a );}

.elementor-widget-heading .elementor-heading-title a {color: inherit;}

.elementor-widget-theme-post-content ul {margin-bottom:15px;}

.url-section { /*scroll-margin-top: 96px; */}

/*Global*/
.no-padding {padding: 0; margin: 0;}

.boksy-home .elementor-cta__title {line-height:100% !important;}

b, strong, .elementor-widget-text-editor strong,
.elementor-widget-text-editor b {font-weight: 500 !important;}

.elementor-accordion-item {border-left: none !important;border-right: none !important;}

/* Header nad wszystkim i płynne przejście tła */

/* Header nad wszystkim i płynne przejście tła */
.header-sticky {
  /*position: relative;  */     /* domyślna w Elementorze */
  /*z-index: 999;*/
  background: transparent !important;
  transition: background-color .25s ease, box-shadow .25s ease;
}

.header-sticky .logo-wrapper .elementor-icon svg {padding-top:15px;}

/* Po scrollu (Elementor doda elementor-sticky--effects) */
.header-sticky.elementor-sticky--effects {
  background: #fff !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
}
.header-sticky.elementor-sticky--effects .elementor-nav-menu .menu-item a:not(.elementor-sub-item),
.header-sticky.elementor-sticky--effects .sticky-color h2,
.header-sticky.elementor-sticky--effects .sticky-color h5,
.header-sticky.elementor-sticky--effects .elementor-view-default .elementor-icon {
  color: #070606 !important;
}

.header-sticky.elementor-sticky--effects .sticky-color svg,
.header-sticky.elementor-sticky--effects .elementor-icon svg {
  fill: #070606 !important;
}

.header-sticky .logo-wrapper .elementor-icon svg #g10.text path {fill:#fff !important;}
.header-sticky.elementor-sticky--effects .logo-wrapper .elementor-icon svg #g10.text path {fill:#111 !important;}

.trp-language-item-name {font-size: 1rem;}

/* Hero wsunięty pod header */
.hero-under-header {
  /* Wysokość headera z CSS variable (ustawimy ją JS-em) */
  margin-top: calc(-1 * var(--header-h, 120px));
  padding-top: var(--header-h, 120px);  /* żeby treść hero nie chowała się pod headerem */
  position: relative;
  z-index: 1; /* niżej niż header */
}

/* HERO / SCOPE */
.st-hero{
  position: relative;
  --reveal: 0%;
  min-height: clamp(220px, 32vh, 420px);  

  /* kontrola rozmiarów + pozycjonowania */
  --big-size: clamp(64px, 11vw, 150px);
  --small-size: clamp(28px, 4vw, 56px);

  /* jak mocno mały tytuł ma zejść w dół względem środka (0.30–0.45 zwykle) */
  --small-shift: 0.36;
  --shiftX: 0px;

  /* opcjonalnie: daj hero trochę "oddechu", żeby efekt był widoczny dłużej */
  padding-block: clamp(80px, 14vh, 160px);

  /*
   * Tytuły są absolutnie pozycjonowane, więc nie budują wysokości kontenera.
   * Wysokość hero liczymy ręcznie z rozmiarów i przesunięcia nagłówków.
   */
  --hero-title-stack-h: calc(var(--big-size) * (1 + var(--small-shift)) + (var(--small-size) * 1.1));
  --hero-min-h-from-title: calc(var(--hero-title-stack-h) + (2 * clamp(80px, 14vh, 160px)));
  min-height: max(clamp(220px, 32vh, 420px), var(--hero-min-h-from-title));
}

/* DUŻY: outline + fill reveal */
.st-hero .st-title-outline{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -40%);
  margin: 0;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width:100%;
  font-size: var(--big-size);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1;

  /* outline */
  color: transparent;
  -webkit-text-stroke: 1px rgba(17,17,17,0.08);

  /* fill: od białego do #f5f5f5 sterowane --reveal */
  background-image: linear-gradient(#ddd, #ddd), linear-gradient(#fff, #fff);
  background-size: 100% var(--reveal), 100% 100%;  background-repeat: no-repeat, no-repeat;
  background-position: left top, left top;
  /*text-shadow: 6px 8px 12px rgba(0,0,0,0.10);*/

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  will-change: background-size;
}

/* MAŁY: dosunięty na "dolną linię" dużego */
.st-hero .st-title-reveal{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(calc(-50% + var(--shiftX)), calc(-50% + (var(--big-size) * var(--small-shift))));  margin: 0;
  z-index: 11;
  text-align: center;
  font-size: var(--small-size);
  font-weight: 700;
  line-height: 1.05;
  /* normalny kolor (bez reveal) */
  color: #111;
  display: inline-block;  
padding: 0.06em 0.18em;  
isolation: isolate;
}

/* DODAJ nowy blok */  
.st-hero .st-title-reveal::before{  
  content: "";  
  position: absolute;  
  z-index: -1;  
  top: 50%;  
  bottom: 0;  
  left: 0em;  
  right: -0.10em;  
  transform: translateX(0px) skewX(-10deg);  
  background: #ededed;  
  border-radius: 3px;  
}

/* Szacunek dla ograniczenia animacji */
@media (prefers-reduced-motion: reduce){
  .st-hero{ --reveal: 100%; }
}

.hero-bg {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: transparent;
}

/* Gradient musi byc nad filmem, a nie w tle kontenera pod filmem. */
.hero-bg .elementor-background-video-container::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    var(--e-global-color-a067aa4, rgba(0, 0, 0, 0.65)) 0%,
    rgba(0, 0, 0, 0) 40%
  );
}

/* Elementor pozycjonuje warstwe wideo absolutnie. */
.hero-bg .elementor-background-video-container {
  z-index: 0;
}

.hero-bg > .e-con-inner {
  position: relative;
  z-index: 1;
}

.hero-bg > .e-con-inner > .elementor-widget {
  position: relative;
  z-index: 2;
}


/* 1) Wybierz właściwy selektor tytułu (przykłady poniżej) */
.single-sklepy h1,
.single-sklepy .entry-title,
.single-sklepy .page-title {
  font-size: clamp(28px, 3.2vw, 56px);
  line-height: 1.05;
  max-width: 22ch;              /* kontroluje łamanie linii */
  margin-left: auto;
  margin-right: auto;
  text-wrap: balance;           /* ładniejsze łamanie (tam gdzie wspierane) */
  overflow-wrap: anywhere;      /* nie rozwala layoutu długimi słowami */
  hyphens: auto;                /* lepsze łamanie w PL (wymaga lang="pl") */

  /* clamp do 2 linii */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* Na małych ekranach pozwól na 3 linie (często czytelniej) */
@media (max-width: 768px) {
  .single-sklepy h1,
  .single-sklepy .entry-title,
  .single-sklepy .page-title {
    -webkit-line-clamp: 3;
    max-width: 26ch;
  }
}
/* lepsze łamanie i mniejszy rozmiar dla długich tytułów posta */
.single-post .st-hero .st-title-reveal{
  max-width: min(92vw, 980px);
  padding-inline: 1rem;

  font-size: clamp(22px, 3.2vw, 44px);
  line-height: 1.08;

  text-wrap: balance;
  overflow-wrap: anywhere;
  hyphens: auto;
}

/* TYLKO single post: wyższy hero pod zdjęcie */
.single-sklepy .st-hero{
  min-height: clamp(520px, 78vh, 920px);
  padding-block: clamp(70px, 12vh, 160px);
}

.marked .elementor-heading-title::before {
  content: "";
  position: absolute;
  left: -0.4em;
  right: -0.4em;
  bottom: 0.1em;
  height: 35%;
  background: #F2F4F7;
  z-index: -1;
  border-radius: 4px;
}

.marked.elementor-widget-heading {
  width: fit-content !important;
  max-width: fit-content !important;
  --container-widget-width: auto;
  --container-widget-flex-grow: 0;
}

.marked .elementor-heading-title {
  position: relative;
  display: inline-block;
  width: fit-content;
}


.marked-soft-bg .elementor-heading-title {
  position: relative;
  display: inline-block;
  z-index: 1;
}

.marked-soft-bg .elementor-heading-title::before {
  content: "";
  position: absolute;
  left: -0.4em;
  right: -0.4em;
  bottom: 0.1em;
  height: 35%;
  background: #F2F4F7;
  z-index: -1;
  border-radius: 4px;
}


/*Numbers*/

.elementor-counter .elementor-counter-number-wrapper {align-items: baseline;}
.elementor-counter .elementor-counter-number-prefix, .elementor-counter .elementor-counter-number-suffix {color:#333;}
.elementor-counter .elementor-counter-number-prefix {font-size: 20%;}
.elementor-counter .elementor-counter-number-suffix {font-size: 20%;}



/* Top faces (oryginalne lokale) */
mapplic-map#mapplic-1732 #extrusion-sides { pointer-events: none; }
mapplic-map#mapplic-1732 #extrusion-sides polygon { fill: #d7d7d7; }

mapplic-map#mapplic-1732 #MLOC-lokale > path[id]{
  fill: #f3f3f3;
  stroke: rgba(0,0,0,.10);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

/* Atomic icon box */
/*
.ud-icon-list {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 24px 34px;
}

.ud-icon-list > .e-con-inner {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 24px 34px;
}

.ud-icon-list > .elementor-element,
.ud-icon-list > .e-con-inner > .elementor-element,
.ud-icon-list .ud-icon-box {
  width: auto;
  max-width: 100%;
  flex: 0 1 auto;
  --container-widget-width: auto;
  --container-widget-flex-grow: 0;
}
*/

.ud-icon-box {
  display: flex;
  align-items: center;
  gap: 18px;
  width: auto;
  max-width: 100%;
  flex: 0 1 auto;
}

.ud-icon-box > :first-child,
.ud-icon-box .ud-icon {
  --ud-icon-bg: #1464a6;
  /*--ud-icon-outline: color-mix(in srgb, var(--ud-icon-bg) 35%, #fff);*/
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: transparent;
  position: relative;
  color: #fff;
}

.ud-icon-box > :first-child {
  margin: 0;
}

.ud-icon-box > :first-child > * {
  position: relative;
  z-index: 2;
}

.ud-icon-box > :first-child svg,
.ud-icon-box .ud-icon svg,
.ud-icon-box svg.ud-icon {
  width: 24px !important;
  height: 24px !important;
  color: #fff;
  fill: none;
  stroke: currentColor;
  position: relative;
  z-index: 2;
}

.ud-icon-box svg.ud-icon {
  padding: 6px;
  box-sizing: border-box;
  background: var(--ud-icon-bg);
  mask: url("assets/icons/tile-beacon.svg") center / contain no-repeat;
  -webkit-mask: url("assets/icons/tile-beacon.svg") center / contain no-repeat;
}

.ud-icon-box > :first-child svg *,
.ud-icon-box .ud-icon svg *,
.ud-icon-box svg.ud-icon * {
  stroke: currentColor;
}

.ud-icon-box > :first-child::before,
.ud-icon-box .ud-icon::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--ud-icon-bg);
  mask: url("assets/icons/tile-beacon.svg") center / contain no-repeat;
  -webkit-mask: url("assets/icons/tile-beacon.svg") center / contain no-repeat;
}

.ud-icon-box > :first-child::after,
.ud-icon-box .ud-icon::after {
  content: "";
  position: absolute;
  inset: -2px;
  z-index: 0;
  background: var(--ud-icon-outline);
  opacity: .75;
  mask: url("assets/icons/tile-beacon.svg") center / contain no-repeat;
  -webkit-mask: url("assets/icons/tile-beacon.svg") center / contain no-repeat;
}

.ud-icon-box > :not(:first-child),
.ud-icon-box > :not(:first-child) .elementor-heading-title,
.ud-icon-box .ud-icon-title {
  margin: 0;
  color: #202020;
  font-size: clamp(16px, 1.15vw, 16px);
  font-weight: 400;
  line-height: 1.25;
  font-family:'Clash Display', Arial, serif;
}

.single-sklepy .elementor-icon-box-description p,
.single-sklepy .elementor-icon-box-description + p {
  font-family: 'Clash Display', Arial, serif !important;
}

.single-sklepy .elementor-widget-loop-carousel .swiper-slide {
  width: clamp(180px, calc((100% - 100px) / 6), 220px) !important;
  max-width: 220px;
}

.single-sklepy .elementor-widget-loop-carousel .swiper-wrapper {
  justify-content: flex-start;
}


.elementor-button-link {letter-spacing: 2px;}


/* CSS Only solution, Same DIV needs !important */

/*Cookies Banner*/
.cmplz-cookiebanner .cmplz-close svg {outline: none !important;}

@media (max-width: 1024px) {
#cmplz-manage-consent .cmplz-manage-consent {height:40px !important;padding:5px 10px !important;font-size:15px !important;}
}


#cmplz-manage-consent .cmplz-manage-consent {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    background-color: white !important; /* change color */
 	background-image: url("/wp-content/uploads/2026/09/cookie.svg") !important; /*  use your .svg path*/
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 50% !important;
    bottom: 10px !important;
    right: 15px !important;
    display: block !important;
    padding: 0 !important;
    min-width: unset !important;
    color: transparent !important; /* hiding . text */
    border: 1px solid #ededed !important;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px !important; 
}


/* Hide the dot (text inside the button) */
.cmplz-manage-consent::before {
    content: "" !important;
}

