/* Ten plik ładowany wyłącznie na index.html – pełna izolacja homepage */

/* Sekcyjne gradienty (bez fal) */
.section::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.95; transition:opacity .6s ease;
}
.bg-a::before{
  background:
    radial-gradient(1100px 520px at 60% -10%, rgba(110,88,245,.35), transparent 70%),
    radial-gradient(900px 420px at 0% 0%, rgba(76,195,255,.24), transparent 60%);
}
.bg-b::before{
  background:
    radial-gradient(1100px 520px at 100% 0%, rgba(110,88,245,.26), transparent 70%),
    radial-gradient(900px 420px at 0% 100%, rgba(76,195,255,.22), transparent 65%);
}
.bg-c::before{
  background:
    radial-gradient(1000px 520px at 0% 0%, rgba(76,195,255,.24), transparent 70%),
    radial-gradient(1000px 480px at 100% 100%, rgba(244,113,181,.22), transparent 65%);
}
.bg-d::before{
  background:
    radial-gradient(1200px 520px at 30% -10%, rgba(76,195,255,.25), transparent 70%),
    radial-gradient(900px 380px at 100% 100%, rgba(110,88,245,.22), transparent 65%);
}

/* HERO */
.hero{padding:64px 0 32px}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:32px; align-items:center}
.eyebrow{letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:#c9d8ff; opacity:.9; margin:0 0 6px}
.hero h1{font-size:clamp(1.9rem, 4vw, 3.2rem); line-height:1.12; margin:0 0 12px; font-weight:800}
.lead{color:#a9bdd8; font-size:clamp(1rem, 1.2vw, 1.1rem); margin:0 0 18px; max-width:760px}
.hero-actions{display:flex; gap:12px; flex-wrap:wrap}
.btn{display:inline-block; border-radius:14px; padding:12px 18px; text-decoration:none; transition:.2s; border:1px solid rgba(255,255,255,.12); color:#ecf2ff; font-weight:600}
.btn.primary{border:0; background:linear-gradient(90deg,#6E58F5,#4CC3FF)}
.btn.ghost{background:transparent; border:1px dashed rgba(255,255,255,.28)}
.btn.outline{background:transparent}
.btn.outline:hover{background:rgba(255,255,255,.07)}
.hero-bullets{list-style:none; padding:0; margin:18px 0 0; color:#cfe1ff; display:grid; gap:8px}
.hero-bullets li{opacity:.95}

/* slider w karcie */
.hero-media .media-card{
  position:relative; background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.1); border-radius:22px; overflow:hidden; box-shadow:0 16px 40px rgba(0,0,0,.35)
}
.slides{display:flex; width:300%; transition:transform .6s ease}
.slides img{width:100%; height:100%; object-fit:cover}
.slide-nav{position:absolute; top:50%; transform:translateY(-50%); border:0; background:rgba(0,0,0,.35); color:white; width:40px; height:40px; border-radius:999px; cursor:pointer}
.slide-nav.prev{left:10px}.slide-nav.next{right:10px}
.dots{position:absolute; bottom:10px; left:0; right:0; display:flex; gap:8px; justify-content:center}
.dots button{width:8px; height:8px; border-radius:999px; border:0; background:rgba(255,255,255,.5)}
.dots button.active{background:white}

/* WHY */
.why{padding:30px 0 16px}
.section-head{text-align:center; margin-bottom:12px}
.section-head .sub{color:#a9bdd8; margin-top:6px}
.accent{color:#6E58F5}
.cards-3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:18px}
.card{
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.1); border-radius:18px; padding:22px;
  box-shadow:0 16px 40px rgba(0,0,0,.35); transition:.25s transform, .25s box-shadow;
}
.card:hover{transform:translateY(-3px); box-shadow:0 18px 40px rgba(0,0,0,.45)}
.card .emoj{font-size:28px; margin-bottom:6px}

/* USŁUGI + ASIDE */
.slider-and-services{padding:30px 0 60px}
.split{display:grid; grid-template-columns:1.2fr .8fr; gap:22px}
.service-tiles{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.1); border-radius:18px; padding:18px; box-shadow:0 16px 40px rgba(0,0,0,.35)}
.service-tiles h3{margin:0 0 10px}
.tile-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:10px}
.tile{padding:12px; border-radius:12px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); text-align:center; transition:.2s}
.tile:hover{transform:translateY(-2px)}
.tile.link{background:linear-gradient(90deg,#6E58F5,#4CC3FF); color:#07101d; font-weight:700; text-decoration:none}
.tile.subtle{opacity:.85}
.info-card{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.1); border-radius:18px; padding:18px; box-shadow:0 16px 40px rgba(0,0,0,.35)}
.info-card h4{margin:0 0 8px}
.info-card ul{margin:0; padding-left:18px; color:#a9bdd8}
.mt{margin-top:12px}

/* FAQ (akordeon) */
.faq{padding:10px 0 80px}
.acc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.acc-item{background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.12); border-radius:16px; box-shadow:0 16px 40px rgba(0,0,0,.35); overflow:hidden}
.acc-head{width:100%; background:transparent; color:#ecf2ff; border:0; cursor:pointer; padding:16px 18px; font-weight:700; display:flex; align-items:center; gap:10px; text-align:left}
.acc-head .ico{width:28px; height:28px; border-radius:999px; display:grid; place-items:center; background:linear-gradient(135deg,#6E58F5,#4CC3FF); color:#05121a; font-weight:800; flex:0 0 auto}
.acc-head .chev{margin-left:auto; transition:.25s transform}
.acc-item.open .acc-head .ico{background:linear-gradient(135deg,#F471B5,#4CC3FF)}
.acc-item.open .chev{transform:rotate(180deg)}
.acc-panel{height:0; overflow:hidden; transition:height .38s cubic-bezier(.2,.8,.2,1)}
.acc-body{padding:0 18px 16px; color:#a9bdd8; border-top:1px solid rgba(255,255,255,.12); line-height:1.6}

/* Reveal on scroll */
.reveal{opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease}
.reveal.show{opacity:1; transform:none}

/* FLOAT EMOJIS – tylko na home */
.float-emojis{position:fixed; inset:0; z-index:0; pointer-events:none}
.float-emojis span{position:absolute; font-size:clamp(18px, 2.2vw, 32px); opacity:.15; animation:drift 18s linear infinite}
@keyframes drift{ from{transform:translateY(20vh) rotate(0deg)} to{transform:translateY(-120vh) rotate(360deg)} }

/* COOKIE BANNER – tylko na home */
.cookie-banner{
  position:fixed; left:50%; bottom:5%; transform:translate(-50%, 40px) scale(.98);
  width:min(920px, 92%); z-index:1000; padding:16px 18px; border-radius:16px;
  background:rgba(15,23,42,.94); border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px) saturate(1.1); box-shadow:0 20px 50px rgba(0,0,0,.5);
  display:flex; gap:12px; align-items:center; transition:transform .5s cubic-bezier(.2,.8,.2,1), opacity .5s;
  opacity:0; visibility:hidden;
}
.cookie-banner.show{transform:translate(-50%, 0) scale(1); opacity:1; visibility:visible}
.cookie-text{flex:1 1 auto; color:#a9bdd8; font-size:.95rem}
.cookie-actions{display:flex; gap:10px; flex-wrap:wrap}
.cookie-actions .btn{padding:10px 14px; border-radius:12px}
.cookie-actions .accept{background:linear-gradient(90deg, #6E58F5, #4CC3FF); border:0; color:#04121c}
.cookie-actions .decline{border:1px dashed rgba(255,255,255,.25); background:transparent; color:#ecf2ff}
.cookie-close{
  position:absolute; top:8px; right:8px; width:36px; height:36px;
  border:0; border-radius:10px; cursor:pointer; color:#fff;
  background:rgba(255,255,255,.1);
}
.cookie-close:hover{background:rgba(255,255,255,.18)}

/* Responsive – home only */
@media (max-width: 980px){
  .hero{padding-top:60px}
  .hero-grid{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .cards-3{grid-template-columns:1fr}
  .tile-grid{grid-template-columns:1fr}
  .acc-grid{grid-template-columns:1fr}

  .main-nav.open{display:flex; flex-direction:column; align-items:center}
}