/* Tokens i drobne utility */
:root {
  --amber-500:#f59e0b; --amber-400:#fbbf24; --purple-500:#a855f7; --cyan-400:#22d3ee;
  --white-05:rgba(255,255,255,.05); --white-08:rgba(255,255,255,.08); --white-10:rgba(255,255,255,.10);
  --white-12:rgba(255,255,255,.12); --white-15:rgba(255,255,255,.15); --white-30:rgba(255,255,255,.30);
  --white-60:rgba(255,255,255,.60); --white-70:rgba(255,255,255,.70); --white-80:rgba(255,255,255,.80);
}

html{scroll-behavior:smooth;}
/* Linki i sekcje */
.nav-link{color:rgba(255,255,255,.8);transition:color .2s;}
.nav-link:hover{color:#fff;}
.link{color:var(--amber-400);text-underline-offset:2px;}
.link:hover{color:var(--amber-500);text-decoration:underline;}
.section{padding:4rem 0;}
@media(min-width:768px){.section{padding:6rem 0;}}
.section-head{text-align:center;max-width:42rem;margin:0 auto 2.5rem;}
.section-head h2{font-size:1.875rem;font-weight:800;line-height:1.2;}
@media(min-width:768px){.section-head h2{font-size:3rem;}}
.section-head p{margin-top:.5rem;color:var(--white-70);}
/* Buttony */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.625rem 1.25rem;border-radius:1rem;
  font-weight:600;border:1px solid transparent;transition:all .2s;box-shadow:0 1px 2px rgba(0,0,0,.2);}
.btn--primary{background:var(--amber-500);color:#000;}
.btn--primary:hover{background:var(--amber-400);}
.btn--secondary{background:#fff;color:#000;}
.btn--secondary:hover{background:rgba(255,255,255,.9);}
.btn--ghost{background:transparent;border-color:rgba(255,255,255,.15);color:#fff;}
.btn--ghost:hover{border-color:rgba(255,255,255,.30);}
/* Formularze */
.input{width:100%;height:2.75rem;border-radius:.75rem;background:var(--white-05);border:1px solid var(--white-10);
  padding:0 .75rem;outline:0;color:#fff;transition:border .2s, box-shadow .2s;}
.input:focus{border-color:rgba(245,158,11,.5);box-shadow:0 0 0 4px rgba(245,158,11,.2);}
.label{font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;color:var(--white-60);}
/* Szkło i gradienty */
.glass{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  background:linear-gradient(180deg,var(--white-08),rgba(255,255,255,.04));border:1px solid var(--white-12);
  box-shadow:0 0 40px rgba(255, 230, 3, 0.075);}
.gradient-text {
  background: linear-gradient(
    90deg,
    #dc2626,  /* ciemna czerwień */
    #ef4444,  /* jasna czerwień */
    #f91616,  /* pomarańcz */
    #fa1515   /* złoto */
  );
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-gradient{position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 40%,rgba(255,255,255,.12),rgba(0,0,0,0));pointer-events:none;}
.dot{width:10px;height:10px;border-radius:9999px;background:radial-gradient(circle at 30% 30%,#34d399,#10b981);display:inline-block;}
/* USP */
.usp-card{padding:1.25rem;border-radius:1rem;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  background:linear-gradient(180deg,var(--white-08),rgba(255,255,255,.04));border:1px solid var(--white-12);
  box-shadow:0 0 40px rgba(255, 230, 3, 0.075);}
.usp-title{font-weight:700;font-size:1.125rem;}
.usp-desc{color:var(--white-70);font-size:.875rem;}
/* Karty aut */
.car-card{overflow:hidden;border-radius:1.5rem;border:1px solid var(--white-10);background:var(--white-05);
  backdrop-filter:blur(6px);box-shadow:0 10px 25px rgba(0,0,0,.3);transform:translateY(0);transition:transform .2s, box-shadow .2s;}
.car-card:hover{transform:translateY(-2px);box-shadow:0 20px 40px rgba(0,0,0,.35);}
.car-img{width:100%;height:auto;object-fit:cover;display:block;background:transparent;padding:0;box-sizing:border-box;}
.car-body{padding:1.25rem;}
.car-title{font-size:1.25rem;font-weight:800;}
.car-spec{color:rgba(255,255,255,.6);font-size:.875rem;margin-top:.25rem;}
.car-price{margin-top:1rem;font-size:1.5rem;font-weight:900;}
.car-price span{font-size:.875rem;font-weight:500;color:rgba(255,255,255,.6);}
.car-cta{margin-top:1rem;display:flex;align-items:center;gap:.75rem;}
/* Kroki */
.step-card{position:relative;padding:1.5rem;border-radius:1rem;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  background:linear-gradient(180deg,var(--white-08),rgba(255,255,255,.04));border:1px solid var(--white-12);
  box-shadow:0 0 40px rgba(255, 230, 3, 0.075);}
.step-num{position:absolute;top:-1rem;left:-1rem;width:2.5rem;height:2.5rem;border-radius:1rem;background:var(--amber-500);
  color:#000;font-weight:900;display:grid;place-items:center;box-shadow:0 10px 20px rgba(0,0,0,.25);}
/* Cennik */
.price-card{padding:1.5rem;border-radius:1.5rem;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  background:linear-gradient(180deg,var(--white-08),rgba(255,255,255,.04));border:1px solid var(--white-12);}
.price-card--featured{box-shadow:0 0 0 2px rgba(245,158,11,.3),0 0 40px rgba(168,85,247,.25);}
.price{font-size:1.875rem;font-weight:900;margin-top:.5rem;}
.price-list{margin-top:.75rem;color:var(--white-80);}
/* Opinie */
.review-card{padding:1.5rem;border-radius:1rem;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  background:linear-gradient(180deg,var(--white-08),rgba(255,255,255,.04));border:1px solid var(--white-12);}
.review-card blockquote{color:rgba(255,255,255,.9);}
.review-card figcaption{margin-top:.75rem;color:rgba(255,255,255,.6);font-size:.875rem;}
/* Stopka */
.footer-title{font-weight:700;margin-bottom:.5rem;color:#fff;}
.footer-list{list-style:none;padding:0;margin:0;}
/* CTA pływające */
.floating-cta{padding:.5rem 1rem;border-radius:9999px;font-weight:700;background:var(--amber-500);color:#000;
  box-shadow:0 10px 25px rgba(0,0,0,.3);transition:transform .2s;}
.floating-cta:hover{transform:translateY(-2px);}
.floating-cta--ghost{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.15);}

.car-float{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:-28px;             /* trochę mocniej nachodzi */
  height: 280px;            /* powiększone auto na mobile */
  filter:
    drop-shadow(0 14px 24px rgba(0, 0, 0, 0))
    drop-shadow(0 2px 6px rgba(0, 0, 0, 0));
}
@media (min-width:768px){
  .car-float{ height: 480px; bottom:-64px; }
}
@media (min-width:1024px){
  .car-float{ height: 600px; bottom:-80px; }
}


/* === CUSTOM SCROLLBAR === */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.05);   /* lekko prześwitujące tło toru */
  border-radius: 9999px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #f59e0b, #a855f7, #22d3ee);
  border-radius: 9999px;
  border: 2px solid rgba(0,0,0,0.4);    /* mała obwódka, żeby się odcinał */
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #fbbf24, #c084fc, #38e4ff);
}

/* Firefox */
* {
  scrollbar-width: thin;                       /* cienki pasek */
  scrollbar-color: #f59e0b rgba(255,255,255,0.05);
}


/* === CAR ANIMATIONS === */
.car-anim{
  opacity: 0;
  transform: translateX(-50%) translateY(24px) scale(.98); /* stan startowy */
}

/* po wejściu w viewport uruchamiamy animacje */
.car-anim.in-view{
  /* 2 animacje jednocześnie: wejście + łagodne „unoszenie” */
  animation:
    car-enter 700ms cubic-bezier(.2,.8,.2,1) forwards,
    car-float 6s ease-in-out 700ms infinite;
}

/* keyframes */
@keyframes car-enter{
  from{ opacity:0; transform: translateX(-50%) translateY(24px) scale(.98); filter: drop-shadow(0 0 0 rgba(0,0,0,0)); }
  to  { opacity:1; transform: translateX(-50%) translateY(0)    scale(1);    }
}
@keyframes car-float{
  0%,100%{ transform: translateX(-50%) translateY(0)    scale(1); }
  50%    { transform: translateX(-50%) translateY(-8px) scale(1.005); }
}
@keyframes shadow-breathe{
  0%,100%{ transform: translateX(-50%) scale(1);   opacity:.85; filter: blur(7px); }
  50%    { transform: translateX(-50%) scale(1.06); opacity:.70; filter: blur(9px); }
}

/* redukcja ruchu – pełen szacunek dla dostępności */
@media (prefers-reduced-motion: reduce){
  .car-anim{ animation: none !important; opacity:1; transform: translateX(-50%) translateY(0) scale(1); }
}



/* ===== Scroll reveal ===== */
@media (prefers-reduced-motion: no-preference) {
  [data-reveal] {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .6s ease, transform .6s ease;
    will-change: opacity, transform;
  }
  [data-reveal].is-visible {
    opacity: 1;
    transform: none;
  }

  /* warianty (opcjonalnie używaj data-reveal="left|right|zoom|up|in") */
  [data-reveal="left"]    { transform: translateX(-24px); }
  [data-reveal="right"]   { transform: translateX(24px); }
  [data-reveal="zoom"]    { transform: scale(.96); }
  [data-reveal="in"]      { transform: none; } /* tylko fade */

  /* ładne „stagger” dla dzieci */
  [data-reveal-children] > * {
    opacity: 0; transform: translateY(12px);
    transition: opacity .5s ease, transform .5s ease;
  }
  [data-reveal-children].is-visible > * {
    opacity: 1; transform: none;
  }
  /* opóźnienia 1..6 */
  [data-reveal-children].is-visible > *:nth-child(1) { transition-delay: .05s; }
  [data-reveal-children].is-visible > *:nth-child(2) { transition-delay: .10s; }
  [data-reveal-children].is-visible > *:nth-child(3) { transition-delay: .15s; }
  [data-reveal-children].is-visible > *:nth-child(4) { transition-delay: .20s; }
  [data-reveal-children].is-visible > *:nth-child(5) { transition-delay: .25s; }
  [data-reveal-children].is-visible > *:nth-child(6) { transition-delay: .30s; }
}

#fleet-grid .car-card:hover .car-img { transform: scale(1.02); }
#fleet-grid .car-img { transition: transform .5s ease; }

/* Strona startowo ukryta */
body {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

/* Po załadowaniu dodamy klasę i strona się pokaże */
body.page-loaded {
  opacity: 1;
  transform: translateY(0);
}

/* Blokada zaznaczania i kontekstów na mobile */
html, body {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;   /* blokuje „Zachowaj obrazek” itp. */
  touch-action: pan-x pan-y;     /* pozwól przewijać, bez gestów pinch */
}

/* Wyjątki — żeby działały formularze / kopiowanie w polach */
input, textarea, select, button, [contenteditable="true"] {
  -webkit-user-select: text;
  -ms-user-select: text;
  user-select: text;
  -webkit-touch-callout: default;
}