.elementor-kit-7{--e-global-color-primary:#FDFDFD;--e-global-color-secondary:#F31515;--e-global-color-text:#000000;--e-global-color-accent:#D72638;--e-global-color-7054e86:#F0EDEE;--e-global-color-e698dc1:#111111;--e-global-color-03c4e01:#777777;--e-global-color-1e3e98d:#C11226;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;--e-global-typography-8e9b937-font-family:"sato";background-color:#FFFFFF;}.elementor-kit-7 button,.elementor-kit-7 input[type="button"],.elementor-kit-7 input[type="submit"],.elementor-kit-7 .elementor-button{background-color:var( --e-global-color-secondary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-text );}.elementor-kit-7 button:hover,.elementor-kit-7 button:focus,.elementor-kit-7 input[type="button"]:hover,.elementor-kit-7 input[type="button"]:focus,.elementor-kit-7 input[type="submit"]:hover,.elementor-kit-7 input[type="submit"]:focus,.elementor-kit-7 .elementor-button:hover,.elementor-kit-7 .elementor-button:focus{background-color:var( --e-global-color-1e3e98d );}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */root{ --accent:#F31515; --accent2:#D72638; --ink:#000; --paper:#fff; }

/* HERO */
.ec-hero{
  position:relative; min-height:90vh;
  display:flex; align-items:center; justify-content:center;
  padding:56px 16px 72px; background:var(--paper);
}

/* KOMPAS */
.ec-hero .hero-compass{
  width:min(38vw,460px); max-width:460px; cursor:pointer;
  transition: transform .6s cubic-bezier(.2,.7,.2,1), filter .3s;
  filter: drop-shadow(0 8px 24px rgba(0,0,0,.08));
}
.ec-hero .hero-compass:hover{ transform: scale(1.02); }

/* PANELE */
.ec-panel{
  position:absolute; width:min(520px,42vw); max-width:520px;
  background:#fff; border-radius:18px; padding:22px 24px;
  box-shadow:0 14px 40px rgba(0,0,0,.12);
  opacity:0; pointer-events:none; transform: translateY(0) scale(.98);
  transition: opacity .45s ease, transform .55s ease; z-index:2;
}
.ec-panel :is(h1,h2,h3,h4,h5,h6){
  margin:0 0 .4rem; font-weight:800; line-height:1.15;
  font-size: clamp(20px,2.6vw,28px);
}
.ec-panel p{ margin:.25rem 0 .75rem; line-height:1.5; opacity:.9; }

/* BUTTON (gdy klasa e-btn na widżecie przycisku) */
.e-btn .elementor-button{
  --r:18px; padding:12px 20px; border-radius:var(--r);
  background:var(--accent); color:#fff; font-weight:700; text-decoration:none;
  box-shadow:0 8px 24px rgba(211,38,56,.28);
  transition: transform .2s, box-shadow .2s;
}
.e-btn .elementor-button:hover{ transform: translateY(-2px); box-shadow:0 12px 32px rgba(211,38,56,.36); }

/* ROZMIESZCZENIE PANELI (DESKTOP) */
.ec-panel.north{ top:6%;  left:50%; transform: translate(-50%,-12px) scale(.98); }
.ec-panel.east { top:50%; right:6%; transform: translate(12px,-50%)  scale(.98); }
.ec-panel.west { top:50%; left:6%;  transform: translate(-12px,-50%) scale(.98); }
.ec-panel.south{ bottom:6%; left:50%; transform: translate(-50%,12px)  scale(.98); }

/* START: widoczny tylko North */
.ec-panel.north{ opacity:1; pointer-events:auto; }
.ec-panel.east, .ec-panel.west, .ec-panel.south{ opacity:0; pointer-events:none; }

/* PO KLIKNIĘCIU: odkryj wszystko */
.ec-hero.is-open .ec-panel{ opacity:1; pointer-events:auto; transform: translate(0,0) scale(1); }
.ec-hero.is-open .ec-panel.north{ transform: translate(-50%,0)  scale(1); }
.ec-hero.is-open .ec-panel.east { transform: translate(0,-50%)  scale(1); }
.ec-hero.is-open .ec-panel.west { transform: translate(0,-50%)  scale(1); }
.ec-hero.is-open .ec-panel.south{ transform: translate(-50%,0)  scale(1); }

/* Efekt wjazdu z kierunków (opcjonalny) */
.ec-hero.is-open .ec-panel.east { animation: ec-in-right .5s ease both; }
.ec-hero.is-open .ec-panel.west { animation: ec-in-left  .5s ease both; }
.ec-hero.is-open .ec-panel.south{ animation: ec-in-up    .55s ease .05s both; }
@keyframes ec-in-right{from{opacity:0;transform:translate(24px,-50%) scale(.98)}to{opacity:1;transform:translate(0,-50%) scale(1)}}
@keyframes ec-in-left {from{opacity:0;transform:translate(-24px,-50%) scale(.98)}to{opacity:1;transform:translate(0,-50%)  scale(1)}}
@keyframes ec-in-up   {from{opacity:0;transform:translate(-50%,24px)  scale(.98)}to{opacity:1;transform:translate(-50%,0)   scale(1)}}

/* MOBILE */
@media (max-width: 768px){
  .ec-hero{ display:block; text-align:center; }
  .ec-hero .compass-btn{ width:64vw; max-width:360px; margin: 16px auto 12px; }
  .ec-panel{ position:static; width:auto; margin:18px auto; transform:none; display:none; opacity:1; pointer-events:auto; }
  .ec-panel.north{ display:block; }
  .ec-hero.is-open .ec-panel{ display:block; }
}

/* Gładki obrót kompasu po kliknięciu */
.ec-hero .hero-compass.spin{ animation: ec-spin 1s cubic-bezier(.2,.7,.2,1); }
@keyframes ec-spin{ to{ transform: rotate(360deg) scale(1.02);} }

/* Prefer-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .ec-hero .compass-btn, .ec-panel{ transition:none !important; animation:none !important; }
}
@media (max-width: 768px){
  .ec-panel{
    position: static !important;
    width: auto !important;
    max-width: 640px;
    margin: 18px 16px !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    display: none;
    box-sizing: border-box;
  }
  .ec-panel.north{ display:block; }
  .ec-hero.is-open .ec-panel{ display:block; }
  .ec-hero.is-open .ec-panel.east,
  .ec-hero.is-open .ec-panel.west,
  .ec-hero.is-open .ec-panel.south{ animation:none !important; }
}/* CENTROWANIE KOMPASU NA TABLETACH i WIĘKSZYCH MOBILKACH */
@media (max-width: 1368px){ /* iPad Pro landscape ma 1366 */
  .ec-hero{
    display:block;           /* prosty layout w kolumnie na mniejszych szerokościach */
    text-align:center;
  }
  /* wrapper widgetu */
  .ec-hero .hero-compass{
    display:block;
    margin:16px auto 12px;   /* auto = środek */
    float:none;
    width:auto;              /* nie trzymaj szerokości wrappera */
  }
  /* faktyczne zdjęcie/SVG wewnątrz widgetu */
  .ec-hero .hero-compass img{
    display:block;
    margin:16px auto 12px;   /* centrowanie samego obrazka */
    width: clamp(220px, 64vw, 360px); /* skaluje się zdrowo na tabletach */
    height: auto;
  }
}
html { scroll-behavior: smooth; }

/* Offset kotwic, żeby sticky header nie zasłaniał nagłówków sekcji */
:root{ --sticky: 80px; }            /* dostosuj do wysokości Twojego headera */
[id]{ scroll-margin-top: var(--sticky); }

/* Jeśli header jest wyższy na mobile, ustaw inny offset */
@media (max-width: 768px){
  :root{ --sticky: 72px; }
}
/* Sekcja */
.ec-sec{ padding-block: clamp(56px,8vw,96px); padding-inline:16px; }

/* Karta treści (spójna z panelami z hero) */
.ec-card{
  max-width: 980px; margin:0 auto;
  background:#fff; border-radius:22px;
  box-shadow:0 18px 50px rgba(0,0,0,.12);
  padding: clamp(20px,3.2vw,36px);
}
.ec-card h2{
  margin:0 0 .5rem; font-weight:800; line-height:1.15;
  font-size: clamp(28px,3.4vw,44px);
}
.ec-card p:first-of-type{
  margin:.25rem 0 1rem; font-size:clamp(16px,2vw,18px); line-height:1.6; opacity:.95;
}
.ec-card ul{ margin:.75rem 0 0; padding-left:1.25rem; }
.ec-card li{ margin:.45rem 0; }
/* Akcent pod każdym H2 w .ec-card */
.ec-card h2{
  position: relative;
  margin: 0 0 .5rem;
  font-weight: 800;
  line-height: 1.15;
}
.ec-card h2::after{
  content:"";
  display:block;
  width:64px;               /* długość akcentu */
  height:4px;               /* grubość */
  background:#F31515;       /* kolor akcentu */
  border-radius:4px;
  margin:.4rem 0 1rem;      /* odstępy nad/po */
}

/* Mobile – delikatniej */
@media (max-width:768px){
  .ec-card h2::after{ width:56px; height:3px; margin:.35rem 0 .85rem; }
}
.ec-modal .dialog-widget-overlay{
  background: rgba(0,0,0,.62);
  backdrop-filter: blur(2px);
}
/* Elementor czasem pozycjonuje treść popupu „pikselowo”. Wymuśmy centrowanie na mobile. */
@media (max-width: 767px){
  .elementor-popup-modal.ec-modal .dialog-widget-content{
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
  }
  .elementor-popup-modal.ec-modal .dialog-message{
    width: min(720px, 100vw - 32px) !important;
  }

  /* safe-area dla notcha (iPhone itp.) */
  @supports (padding: max(0px)){
    .elementor-popup-modal.ec-modal .dialog-message{
      padding-left:  max(16px, env(safe-area-inset-left));
      padding-right: max(16px, env(safe-area-inset-right));
    }
  }
}
/* — Destinations Reached — */
.ec-proof{ padding-block:clamp(56px,8vw,96px); padding-inline:16px; }
.ec-proof h2{ font-weight:800; line-height:1.15; margin:0 0 .5rem; font-size:clamp(28px,3.4vw,44px); position:relative; }
.ec-proof h2::after{ content:""; display:block; width:64px; height:4px; background:#F31515; border-radius:4px; margin:.4rem 0 1rem; }

/* karta */
.ec-proof-card{
  position:relative; background:#fff; border-radius:18px; border:1px solid rgba(0,0,0,.06);
  box-shadow:0 18px 50px rgba(0,0,0,.12); padding:18px; overflow:hidden; min-height:240px;
  display:flex; flex-direction:column; gap:12px; justify-content:space-between;
}
.ec-proof-card::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(900px 220px at -10% -10%, rgba(243,21,21,.08), transparent 60%);
  pointer-events:none;
}

/* badge */
.ec-proof-card .badge{
  position:absolute; top:12px; left:12px;
  font-size:12px; padding:4px 8px; border-radius:999px;
  background:#FFF5F5; border:1px solid #FFD6D6; color:#B42318;
}

/* typografia */
.ec-proof-card .kpi{ font-weight:800; font-size:clamp(22px,2.6vw,28px); line-height:1.2; margin:0 .5rem .25rem 0; }
.ec-proof-card .kpi::before{ content:"Δ"; margin-right:6px; color:#F31515; font-weight:800; }
.ec-proof-card .desc{ margin:0 0 .6rem; opacity:.9; }
.ec-proof-card .meta{ font-size:13px; opacity:.85; margin:0 0 .8rem; }

/* CTA */
.ec-proof-card .elementor-button{
  border-radius:999px; font-weight:700; background:#F31515; color:#fff; border:0;
  padding:10px 14px; box-shadow:0 10px 24px rgba(243,21,21,.28);
}
.ec-proof-card .elementor-button:hover{ transform: translateY(-1px); }
.ec-proof-card .elementor-button:focus-visible{ outline:3px solid #D72638; outline-offset:2px; }

/* hover (desktop) */
@media (hover:hover){
  .ec-proof-card{ transition: transform .2s cubic-bezier(.2,.7,.2,1), box-shadow .2s; }
  .ec-proof-card:hover{ transform: translateY(-2px); box-shadow:0 24px 64px rgba(0,0,0,.14); }
}

/* pełna szerokość CTA tylko na bardzo małych ekranach */
@media (max-width:480px){
  .ec-proof-card .elementor-button{ width:100%; }
}/* 1) Zrób miejsce na badge nad tytułem */
.ec-proof-card{ padding-top:48px; }    /* było 18px – dodajemy górę */

/* 2) Przenieś Δ do badge i wyrównaj */
.ec-proof-card .kpi::before{ content:none; }  /* wyłącz Δ przy KPI */
.ec-proof-card .badge{
  position:absolute; top:12px; left:12px;
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; padding:4px 8px; border-radius:999px;
  background:#FFF5F5; border:1px solid #FFD6D6; color:#B42318;
  z-index:2;
}
.ec-proof-card .badge::before{
  content:"Δ";
  font-weight:800;
  color:#F31515;
}
/* Tablet (<=1024px): 2 kolumny, ciaśniejsze odstępy */
@media (max-width:1024px){
  .ec-proof{ padding-inline:16px; }
  .ec-proof-grid{ gap:16px !important; }
  .ec-proof-card{
    flex: 1 1 calc(50% - 16px);
    min-height: 220px;
    padding:16px;
    padding-top:44px;               /* miejsce na badge */
    border-radius:16px;
  }
  .ec-proof-card .kpi{ font-size:22px; }
  .ec-proof-card .desc{ margin-bottom:8px; }
  .ec-proof-card .meta{ font-size:13px; }
  .ec-proof-card .badge{ font-size:11px; padding:4px 8px; }
}

/* Mobile (<=640px): 1 kolumna, pełna szerokość CTA, mniejsze badge */
@media (max-width:640px){
  .ec-proof{ padding-inline:16px; }
  .ec-proof-grid{ gap:14px !important; }
  .ec-proof-card{
    flex: 1 1 100%;
    min-height: 200px;
    padding:14px;
    padding-top:40px;
    border-radius:14px;
  }
  .ec-proof-card .badge{
    top:10px; left:10px;
    font-size:10px; padding:3px 8px;
  }
  .ec-proof-card .kpi{ font-size:20px; margin-bottom:6px; }
  .ec-proof-card .meta{ font-size:12px; }
  .ec-proof-card .elementor-button{
    width:100%;                      /* łatwiej kliknąć kciukiem */
    padding:12px 16px;
  }
  /* delikatniej z tłem, żeby nie „puchło” na małych ekranach */
  .ec-proof-card::before{
    background: radial-gradient(700px 180px at -10% -10%, rgba(243,21,21,.08), transparent 60%);
  }
}

/* iPhone notch – bezpieczne krawędzie */
@supports(padding: max(0px)){
  .ec-proof{ padding-left:max(16px, env(safe-area-inset-left));
             padding-right:max(16px, env(safe-area-inset-right)); }
}
/* ===== Journey v2 — snap rail (bez JS) ===== */
#journeyv2{ position:relative; background:#fff; }

/* TRACK: poziomy scroll ze snapem */
#journeyv2 .jr-track{
  display:flex; flex-wrap:nowrap; align-items:center; justify-content:flex-start;
  gap:12vw; padding:0 10vw 28px;
  overflow-x:auto; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
#journeyv2 .jr-track::-webkit-scrollbar{ display:none; }

/* STEP: karta */
#journeyv2 .jr-step{
  flex:0 0 60vw;            /* desktop: ~jedna karta na ekran */
  scroll-snap-align:center;
  background:#fff; border-radius:20px; padding:24px; text-align:center;
  display:grid; place-items:center;
  box-shadow:0 10px 36px rgba(0,0,0,.06);
}
#journeyv2 .jr-step img, #journeyv2 .jr-step svg{ width:72px; height:72px; margin-bottom:12px; }
#journeyv2 .jr-step h3{ font-weight:800; margin:8px 0 6px; font-size:clamp(20px,2.2vw,28px); line-height:1.15; }
#journeyv2 .jr-step p{ margin:0; opacity:.9; line-height:1.5; max-width:52ch; }

/* „fade” po bokach – hint, że przewija się w bok */
#journeyv2 .jr-edge::before, 
#journeyv2 .jr-edge::after{
  content:""; position:absolute; top:0; bottom:44px; width:56px; pointer-events:none;
}
#journeyv2 .jr-edge::before{ left:0;  background:linear-gradient(90deg,#fff 40%,transparent); }
#journeyv2 .jr-edge::after { right:0; background:linear-gradient(270deg,#fff 40%,transparent); }

/* Tablet */
@media (max-width:1024px){
  #journeyv2 .jr-track{ gap:10vw; padding:0 8vw 24px; }
  #journeyv2 .jr-step{ flex:0 0 72vw; padding:20px; }
  #journeyv2 .jr-step img, #journeyv2 .jr-step svg{ width:64px; height:64px; }
}

/* Mobile */
@media (max-width:767px){
  #journeyv2 .jr-track{ gap:6vw; padding:0 6vw 20px; }
  #journeyv2 .jr-step{ flex:0 0 82vw; padding:18px; border-radius:18px; }
  #journeyv2 .jr-step img, #journeyv2 .jr-step svg{ width:56px; height:56px; }
}
/* snap-rail – wymuszenie przewijania poziomego */
#journeyv2 .jr-track{
  display:flex; flex-wrap:nowrap; justify-content:flex-start; align-items:center;
  gap:12vw; padding:0 10vw 28px;
  overflow-x:auto !important; scroll-snap-type:x mandatory;
  touch-action: pan-x !important; overscroll-behavior-x: contain !important;
  -webkit-overflow-scrolling: touch; scrollbar-width:none;
}
#journeyv2 .jr-track::-webkit-scrollbar{ display:none; }

#journeyv2 .jr-step{
  flex:0 0 60vw;           /* desktop: jedna „duża” karta */
  scroll-snap-align:center;
  background:#fff; border-radius:20px; padding:24px; text-align:center;
  display:grid; place-items:center; box-shadow:0 10px 36px rgba(0,0,0,.06);
}

/* tablet / mobile */
@media (max-width:1024px){ #journeyv2 .jr-step{ flex:0 0 72vw; } }
@media (max-width:767px){  #journeyv2 .jr-step{ flex:0 0 82vw; border-radius:18px; padding:18px; } }/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'sato';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://ecliptone.com/wp-content/uploads/2025/08/Satoshi-Variable.ttf') format('truetype');
}
/* End Custom Fonts CSS */