/* = Variables = */
:root{
  --color-primary:#eb6530;
  --color-dark:#49616e;
  --color-sticky:#49616e;
  --color-features-bg:#a9b58a;
  --color-text-heading:#435662;
  --color-light:#f7fafc;
  --color-white:#ffffff;
  --color-text:#4a5568;

  --font-family-main:'Satoshi','Manrope',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --w-reg:300; --w-med:400; --w-semi:500; --w-bold:600;

  --t-fast:.6s ease-in-out; --t-norm:1.2s ease-in-out; --t-slow:1.8s ease-in-out;
}

/* Material Symbols */
.material-symbols-outlined{
  font-family:'Material Symbols Outlined';
  font-weight:normal; font-style:normal; font-size:1em; line-height:1;
  display:inline-block; white-space:nowrap; word-wrap:normal; direction:ltr;
  -webkit-font-feature-settings:'liga'; -webkit-font-smoothing:antialiased;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
}

/* Base */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-family-main);color:var(--color-text);line-height:1.6;background:#fff;-webkit-font-smoothing:antialiased;font-weight:var(--w-reg);overflow-y:scroll}
body.loading{overflow:hidden}
#main-content{opacity:0;transition:opacity .5s ease-in}
body:not(.loading) #main-content{opacity:1}

/* Headings */
h1,h2,h3,h4,h5,h6,.section-title,.hero__title,.solutions__title,.trust__title{
  text-transform:uppercase;
  letter-spacing:.04em;
  font-weight:var(--w-reg);
  line-height:1.15;
}

.container{max-width:1200px;margin:0 auto;padding:0 1rem}
.section-padding{padding:6rem 0}
.section-title{font-size:2.2rem;color:var(--color-text-heading);text-align:center;margin-bottom:2rem}
.section-title--light{color:#fff}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  padding:.5rem 5px .5rem 1rem;
  border:2px solid transparent;
  border-radius:50px;
  text-decoration:none;
  font-weight:var(--w-semi);
  transition:transform var(--t-fast),background-color var(--t-fast),color var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast);
  justify-content:flex-start;
}
.btn::after{
  content:"";
  width:36px;
  height:36px;
  display:inline-block;
  background:url('../img/sygnet.svg') no-repeat center/contain;
  margin-left:auto;
  margin-right:5px;
}
.btn:hover{transform:translateY(-3px);box-shadow:0 10px 20px rgba(0,0,0,.1)}
.btn--primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}
.btn--primary:hover{background:#d55b29;border-color:#d55b29}
.btn--secondary{background:transparent;color:#fff;border-color:currentColor}
.btn--secondary:hover{background:rgba(255,255,255,.08);color:#fff}
.btn--large{padding:1rem 5px 1rem 2.5rem;font-size:1.05rem}

.btn--white{background:#fff;color:var(--color-primary);border-color:var(--color-primary)}
.btn--white::after{background-image:url('../img/sygnet_orange.svg')}
.btn--white:hover{filter:brightness(.96);transform:translateY(-3px)}

/* Ghost w features */
.features .features__ghost{background:#fff;color:var(--color-primary);border-color:transparent}
.features .features__ghost::after{background-image:url('../img/sygnet_orange.svg')}
.features .features__ghost:hover{filter:brightness(.96);transform:translateY(-2px)}

/* Preloader */
#preloader{
  position:fixed;
  inset:0;
  background:var(--color-dark);
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:9999;
  transition:opacity .3s ease-out,visibility .3s ease-out
}
#preloader.hidden{opacity:0;visibility:hidden}
#preloader-svg{width:100px;height:100px}
.preloader-path{
  fill:var(--color-primary);
  opacity:0;
  animation:fadeIn .5s ease-out forwards
}
.preloader-path:nth-child(1){animation-delay:0s}
.preloader-path:nth-child(2){animation-delay:.12s}
.preloader-path:nth-child(3){animation-delay:.24s}
.preloader-path:nth-child(4){animation-delay:.36s}
.preloader-path:nth-child(5){animation-delay:.48s}
.preloader-path:nth-child(6){animation-delay:.6s}

/* Keyframes */
@keyframes fadeIn{to{opacity:1}}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes bounce{0%,20%,50%,80%,100%{transform:translateY(0) translateX(-50%)}40%{transform:translateY(-10px) translateX(-50%)}60%{transform:translateY(-5px) translateX(-50%)}}
@keyframes footerBar{0%{transform:translateX(-30%)}100%{transform:translateX(0)}}

/* Slide swap (wspólne) */
@keyframes slideInLeft{from{opacity:0;transform:translateX(-32px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideOutRight{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(24px)}}
.slide-in-left{animation:slideInLeft 2.55s cubic-bezier(.2,.8,.2,1) forwards}
.slide-out-right{animation:slideOutRight 1.5s ease forwards}

/* Pulse dla ikon wyróżników */
@keyframes softPulse{
  0%{transform:scale(1)}
  50%{transform:scale(1.06)}
  100%{transform:scale(1)}
}

/* Topline */
.topline{position:fixed;top:0;left:0;right:0;height:4px;background:transparent;z-index:2000}
.topline__bar{height:100%;width:0;background:var(--color-primary)}

/* Header */
.header{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  z-index:1000;
  padding:1.2rem 0;
  transition:background-color var(--t-fast),padding var(--t-fast),box-shadow var(--t-fast);
  isolation:isolate
}
.header::after{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:96px;
  pointer-events:none;
  z-index:-1;
  background:linear-gradient(to bottom, rgba(73,97,110,.92), rgba(73,97,110,0))
}
.header__container{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center}
.header__brand{display:flex;align-items:center;gap:20px}
.header__logo{height:36px;display:flex;align-items:center}
.header__logo img{height:100%}
.header__logo .logo-dark{display:none}
.header__logo .logo-white{display:block}
.header__tagline{display:flex;align-items:center;gap:20px}
.header__tagline-sep{width:1px;height:24px;background:rgba(255,255,255,.6)}
.header__tagline-text{display:flex;flex-direction:column;gap:2px}
.tagline-line{display:block;white-space:nowrap;color:#fff;font-weight:var(--w-semi);font-size:.8rem;letter-spacing:.02em;text-transform:uppercase;line-height:1}

/* Nav */
.header__nav{position:static;left:auto;top:auto;transform:none;justify-self:center}
.header__nav-list{display:flex;list-style:none;gap:1.4rem;justify-content:center;align-items:center}
.header__nav-list a{text-decoration:none;font-weight:var(--w-med);position:relative;padding-bottom:4px;color:#fff;transition:color var(--t-norm)}
.header__nav-list a.active-link{text-decoration:underline;text-underline-offset:8px}
.header__nav-list a:not(.active-link)::after{content:'';position:absolute;width:0;height:2px;bottom:0;left:50%;transform:translateX(-50%);background:var(--color-primary);transition:width var(--t-fast)}
.header__nav-list a:not(.active-link):hover::after{width:100%}

/* Right */
.header__right{display:flex;align-items:center;gap:16px;margin-left:auto}
.header__lang-switcher a{text-decoration:none;font-weight:var(--w-semi);margin-left:.5rem;color:#fff;transition:color var(--t-norm)}
.header__lang-switcher a.active{color:var(--color-primary)}
.header__mobile-toggle{display:none;margin-left:4px;z-index:1001;cursor:pointer;background:transparent;border:none;padding:.25rem .25rem}
.header__mobile-toggle .bar{display:block;width:26px;height:3px;margin:5px auto;background:#fff;transition:all .3s ease-in-out}

/* sticky */
.header.scrolled{background:var(--color-sticky);box-shadow:0 8px 24px rgba(0,0,0,.18);padding:.9rem 0}
.header.scrolled .header__logo{height:36px}

/* Mobile nav */
.mobile-nav{position:fixed;inset:0;background:rgba(0,0,0,.2);backdrop-filter:saturate(120%) blur(2px);z-index:999;display:flex;justify-content:flex-end;align-items:stretch;transform:translateX(100%);transition:transform .5s cubic-bezier(.77,0,.175,1)}
.mobile-nav.is-active{transform:translateX(0)}
.mobile-nav nav{background:#2f3f49;width:min(86vw,400px);padding:2rem;display:flex;flex-direction:column;justify-content:center;height:100%}
.mobile-nav nav a{color:#fff;text-decoration:none;font-size:1.2rem;font-weight:var(--w-med);padding:.75rem 0;text-align:center}
.mobile-nav nav a + a{border-top:1px solid rgba(255,255,255,.9)}

/* Hero */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;color:#fff}
.hero__video-wrapper{position:absolute;inset:0;overflow:hidden}
.hero__video-wrapper::after{content:'';position:absolute;inset:0;background:var(--color-dark);opacity:.15}
.hero__video-wrapper video{width:100%;height:100%;object-fit:cover}
.hero__content{position:relative;z-index:2;width:100%}
.hero__content--left .container{max-width:960px;margin:0 auto;text-align:left}
.hero__title{font-size:3rem;line-height:1.15;margin-bottom:1rem;color:#fff}
.hero__subtitle{font-size:1.1rem;max-width:760px;margin:0 0 2rem 0;color:#eef5f9;font-weight:300}
.hero__cta-group{display:flex;gap:1rem;justify-content:flex-start}
.hero__scroll-down{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);color:#fff;width:48px;height:48px;animation:bounce 2.5s infinite;z-index:5}

/* Solutions */
.solutions{background:#fff;padding-top:4rem}
.solutions__container{display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center}
.solutions__media img{width:100%;display:block;transition:opacity .4s ease}
.solutions__tabs{display:grid;gap:0;margin-top:1rem;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}
.solutions__tab{position:relative;width:100%;text-align:left;background:transparent;border:none;border-top:1px solid #e2e8f0;padding:.9rem 1.1rem .9rem 2.8rem;font-weight:var(--w-med);letter-spacing:.02em;cursor:pointer;transition:color .2s ease,font-weight .2s ease}
.solutions__tab:first-child{border-top:none}
.solutions__tab::before{content:"";position:absolute;left:1rem;top:50%;transform:translateY(-50%);width:14px;height:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234a5568'%3E%3Cpath d='M8 5l8 7-8 7V5z'/%3E%3C/svg%3E") no-repeat center/contain;opacity:.9}
.solutions__tab.is-active{color:var(--color-primary);font-weight:var(--w-bold)}
.solutions__tab.is-active::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23eb6530'%3E%3Cpath d='M8 5l8 7-8 7V5z'/%3E%3C/svg%3E") no-repeat center/contain}

/* Accordion (nieużywany – ukryty) */
.solutions__accordion{display:none}

/* Swapppery do animacji tytułu/opisu w SOLUTIONS */
.solutions__titlewrap{position:relative;min-height:3rem;margin:0 0 .6rem 0}
.solutions__descwrap{position:relative;min-height:5rem;margin:0 0 1.4rem 0}
.solutions__titlewrap .anim,
.solutions__descwrap .anim{position:absolute;left:0;top:0;width:100%}

.solutions__title{font-size:2rem;color:var(--color-text-heading)}
.solutions__desc{font-size:1.02rem;max-width:52ch;font-weight:300}

/* Solutions reveal */
.solutions__right{transform:translateX(-24px);opacity:0;transition:transform 1.8s var(--t-fast),opacity 1.8s var(--t-fast)}
.solutions__right.is-visible{transform:translateX(0);opacity:1}
.roller{height:2px;width:140px;margin:0 0 .75rem 0;border-radius:6px;overflow:hidden;background:linear-gradient(90deg, rgba(235,101,48,.3) 25%, rgba(235,101,48,.95) 50%, rgba(235,101,48,.3) 75%) 0 0/200% 100%;animation:rollerMove 6.6s linear infinite}
@keyframes rollerMove{to{background-position:200% 0}}

/* Accordion (mobile) – struktura */
.acc__item{width:100%;text-align:left;background:#fff;color:var(--color-text-heading);border:none;border-bottom:1px solid #e2e8f0;padding:1rem 2.25rem 1rem 1rem;font-weight:var(--w-med);cursor:pointer;position:relative}
.acc__item::after{content:"+";position:absolute;right:1rem;top:50%;transform:translateY(-50%);font-weight:var(--w-semi);color:var(--color-primary)}
.acc__item.is-open::after{content:"–"}
.acc__panel{display:none;padding:.75rem 1rem 1rem;color:var(--color-text)}

/* Features */
.features{position:relative;background:var(--color-features-bg)}
.features__container{display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;align-items:center}
.features .section-title{position:relative;text-align:left;margin-bottom:.65rem}
.features .section-title::after{content:"";display:block;width:88px;height:2px;background:#fff;opacity:.85;margin-top:.45rem;border-radius:2px}
.features__actions{text-align:left}

/* Wrapper + animacje opisu + tytułu */
.features__titlewrap{position:relative;min-height:3rem;margin-bottom:.65rem;max-width:56ch}
.features__titlewrap h2.anim{position:absolute;left:0;top:0;width:100%}
.features__descwrap{position:relative;min-height:5rem;margin-bottom:1.25rem;max-width:56ch}
.features__descwrap p{color:#fff;opacity:1;font-weight:300}
.features__descwrap p.anim{position:absolute;left:0;top:0;width:100%}

/* Karty */
.features__right{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.feature-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;background:transparent;color:#fff;border:2px solid transparent;padding:1.1rem;text-align:center;cursor:pointer;transition:transform .6s ease,box-shadow .6s ease,background-color .6s ease,border-color .6s ease;aspect-ratio:1/1}
.feature-card span{font-size:1.08rem;font-weight:var(--w-med)}
.feature-card:hover{background:transparent;border-color:var(--color-primary);box-shadow:none;transform:translateY(-3px)}
.feature-card.is-active{background:var(--color-primary);border-color:var(--color-primary);box-shadow:none}
.features__right .feature-icon{font-size:clamp(64px,7vw,112px);line-height:1;display:block;font-variation-settings:'FILL' 0,'wght' 150,'GRAD' -25,'opsz' 96}
.features__right .feature-icon.is-pulsing{animation:softPulse 1.4s ease-in-out 2}

/* Trust */
.trust{background:#fff;padding-top:7.2rem;padding-bottom:6rem}
.trust__container{text-align:center}
.trust__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:3rem;align-items:center}
.trust__left{text-align:left}
.trust__title-left{text-align:left;margin:0 0 .8rem 0}
.trust__cta-left{display:inline-flex}
.trust__right{text-align:center}
.trust__slider{position:relative;min-height:190px}
.trust__slide{position:absolute;inset:0;opacity:0;transform:scale(.96);transition:opacity 1.05s ease,transform 1.05s ease}
.trust__slide.is-active{opacity:1;transform:scale(1);position:relative}
.trust__title{font-size:1.25rem;font-weight:var(--w-reg);color:var(--color-text-heading);margin-bottom:.25rem}
.trust__text{font-size:1.02rem;color:var(--color-text);max-width:70ch;margin:.05rem auto 0 auto}
.trust__dots{display:flex;gap:.45rem;justify-content:center;margin-top:.45rem}
.trust__dot{width:10px;height:10px;border-radius:50%;background:#d9e1e6;border:none;cursor:pointer;transition:transform .6s ease,background .6s ease}
.trust__dot:hover{transform:scale(1.1)}
.trust__dot.is-active{background:var(--color-primary)}
.trust__left,.trust__right,.trust__title,.trust__text,.trust__dots{opacity:0;transform:translateY(8px);transition:opacity 1.2s ease,transform 1.2s ease}
.trust.is-animated .trust__left,.trust.is-animated .trust__right{opacity:1;transform:none}
.trust.is-animated .trust__title{transition-delay:.06s;opacity:1;transform:none}
.trust.is-animated .trust__text{transition-delay:.12s;opacity:1;transform:none}
.trust.is-animated .trust__dots{transition-delay:.18s;opacity:1;transform:none}

/* CTA GREEN */
.cta-green{background:var(--color-features-bg);color:#fff;position:relative;padding:4.5rem 0}
.cta-green__container{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.cta-green .section-title,.cta-green p{color:#fff;text-align:left}
.cta-green__right img{width:100%;height:auto;display:block;border-radius:12px;box-shadow:none}

/* CTA SEPARATOR (kolor stopki) */
.cta-separator{
  background:var(--color-dark);
  color:#fff;
  padding:4rem 0;
}
.cta-separator__container{
  max-width:720px;
  margin:0 auto;
  text-align:center;
}
.cta-separator .section-title{
  margin-bottom:1rem;
}
.cta-separator p{
  color:#e2e8f0;
  font-size:1.02rem;
}
.cta-separator .section-cta{
  margin-top:1rem;
  text-align:center;
}

/* Footer */
.footer{
  background:var(--color-dark);
  color:#a0aec0;
  padding-top:4rem;
  border-top:2px solid var(--color-primary);
}
.footer__topline{display:none}
.footer__container{display:grid;grid-template-columns:2fr 1.5fr 1fr 1.5fr;gap:2rem;padding:2rem 1rem 4rem}
.footer__logo{height:40px;margin-bottom:1rem}
.footer__col-title{color:#fff;font-size:1.1rem;margin-bottom:1rem;font-weight:var(--w-semi)}
.footer__list{list-style:none}
.footer__list a{color:#a0aec0;text-decoration:none;display:inline-block;padding:.25rem 0;transition:color var(--t-fast);font-weight:var(--w-med)}
.footer__list a:hover{color:#fff}
.footer__tdj-info{font-size:.9rem;margin-top:1rem;font-style:italic}
.footer__bottom-bar{border-top:1px solid var(--color-text-heading);padding:1.5rem 0}
.footer__bottom-bar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer__crafted-by{font-size:.9rem}
.footer__crafted-by a{color:#a0aec0;text-decoration:none;font-weight:var(--w-semi);transition:color var(--t-fast)}
.footer__crafted-by a:hover{color:#fff}
.heart{color:#eb6530;font-size:1.2em;vertical-align:middle}

/* Reveal utilities */
.reveal-up{opacity:0;transform:translateY(18px);transition:opacity 1.65s ease,transform 1.65s ease}
.reveal-left{opacity:0;transform:translateX(-18px);transition:opacity 1.95s ease,transform 1.95s ease}
.reveal-right{opacity:0;transform:translateX(18px);transition:opacity 1.95s ease,transform 1.95s ease}
.reveal-fade{opacity:0;transition:opacity 1.8s ease}
.is-visible.reveal-up,.is-visible.reveal-left,.is-visible.reveal-right,.is-visible.reveal-fade{opacity:1;transform:none}

/* Animacja dla animate-on-scroll (CTA separator) */
.animate-on-scroll{
  opacity:0;
  transform:translateY(18px);
  transition:opacity 1.65s ease,transform 1.65s ease;
}
.animate-on-scroll.is-visible{
  opacity:1;
  transform:none;
}

/* Responsive */
@media (max-width:1200px){.header__tagline{display:none}}
@media (max-width:992px){
  .header__mobile-toggle{display:block}
  .hero__title{font-size:2.4rem}
  .solutions__container,.features__container,.cta-green__container{grid-template-columns:1fr}
  .footer__container{grid-template-columns:1fr 1fr}
  .header__nav{display:none}
  .cta-green__right{order:-1}
  .trust__slider{min-height:220px}
}
@media (max-width:576px){
  .section-padding{padding:4rem 0}
  .section-title{font-size:1.8rem}
  .hero__title{font-size:1.9rem}
  .hero__subtitle{font-size:1rem}
  .hero__cta-group{flex-direction:column;align-items:stretch}
  .hero__cta-group .btn{width:100%}
  .footer__container{grid-template-columns:1fr}
  .footer__bottom-bar .container{flex-direction:column;gap:1rem}
  .solutions__titlewrap{min-height:3.5rem}
  .solutions__descwrap{min-height:6rem}
  .features__titlewrap{min-height:3.5rem}
  .features__descwrap{min-height:6.2rem}
}
/* ==============================================
   FIX DLA PRZYCISKÓW (ZAKŁADKI) NA IPHONE
   ============================================== */

/* 1. Reset stylów systemowych iOS dla przycisków */
.solutions__tab,
.acc__item {
  /* Ważne: usuwa "delikatny niebieski" i nadaje Twój kolor nagłówków */
  color: var(--color-text-heading) !important; 
  
  /* Usuwa domyślne style przycisków Apple (zaokrąglenia, gradienty) */
  -webkit-appearance: none;
  appearance: none;
  
  /* Upewnia się, że tło jest przezroczyste/białe */
  background-color: transparent;
  
  /* Fix na "nieaktywność" - iOS lepiej reaguje na dotyk, gdy jest pointer */
  cursor: pointer;
}

/* 2. Obsługa stanu aktywnego (gdy kliknięte) */
.solutions__tab.is-active,
.acc__item.is-active {
  color: var(--color-primary) !important; /* Twój pomarańczowy */
}

/* 3. Usunięcie szarego mignięcia przy tapnięciu */
.solutions__tab,
.acc__item {
  -webkit-tap-highlight-color: transparent;
}
/* Crafted with ❤️ by PixelShark.eu // */