/* =========================================================================
   Redesign 2026-08 — nawigacja + sekcja hero (strona główna)
   pulawski.eu · ładowany po seo-cls-fixes.css (wygrywa specyficznością/kolejnością)
   ========================================================================= */
:root{
  --pp-navy:#0f2a4a;
  --pp-navy-2:#004f9e;
  --pp-orange:#f2591f;
  --pp-orange-2:#d9490f;
  --pp-ink:#243447;
  --pp-muted:#5b6b7e;
  --pp-line:#e6ebf1;
}

/* =========================================================================
   NAWIGACJA — globalny, czysty pasek poziomy (desktop ≥992px).
   Poniżej 992px zostawiamy istniejące zachowanie mobilne (hamburger .more).
   ========================================================================= */
@media (min-width:992px){
  /* boki i szerokość paska = jak w sekcji hero → logo w jednej linii z hero */
  .nav{
    padding:.55rem clamp(16px,4vw,56px) !important;
    border-bottom:1px solid var(--pp-line);
    box-shadow:0 4px 20px rgba(15,42,74,.06) !important;
  }
  .nav .container-fluid{ max-width:1760px !important; margin:0 auto; padding-left:0 !important; padding-right:0 !important; }
  .nav .row{
    flex-wrap:nowrap !important;
    justify-content:space-between !important;
    align-items:center !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .nav .nav-logo{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    padding-left:0 !important;
  }
  .nav .nav-logo a svg{ height:46px !important; }
  .nav .nav-menu{
    flex:1 1 auto !important;
    width:auto !important;
    max-width:none !important;
    padding-right:0 !important;
  }
  .nav .nav-menu > ul{
    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    gap:clamp(12px,1.6vw,30px);
    margin:0;
    padding:0;
    list-style:none;
  }
  .nav .nav-menu > ul > li{
    display:inline-flex !important;
    align-items:center;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
    position:relative;
  }
  .nav .nav-menu > ul > li > a{
    color:var(--pp-navy);
    font-weight:600;
    font-size:15px;
    letter-spacing:.005em;
    text-decoration:none;
    padding:8px 2px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    transition:color .16s ease;
  }
  .nav .nav-menu > ul > li > a:hover{ color:var(--pp-orange); }
  /* BEZ wskaźnika rozwijania obok pozycji menu (zgodnie z projektem).
     Kasujemy motywowy, rozciągnięty ▼ (.nav-menu-mega:before) i nie dodajemy własnego. */
  .nav .nav-menu-mega::before,
  .nav .nav-menu > ul > li.nav-menu-mega::before{ content:none !important; display:none !important; }

  /* telefon — dyskretny link (widoczny od 1200px) */
  .nav .nav-menu-phone{
    color:var(--pp-navy) !important;
    font-weight:700;
    gap:7px !important;
    white-space:nowrap;
  }
  .nav .nav-menu-phone svg{ width:19px;height:19px;flex:0 0 auto; }
  .nav .nav-menu-phone span{ font-size:15px; }
  @media (max-width:1199px){ .nav .nav-menu li:has(> .nav-menu-phone){ display:none !important; } }

  /* CTA „Umów konsultację" usunięty z paska menu (na życzenie).
     Konwersję w nawigacji niesie telefon; główne CTA jest w sekcji hero. */
  .nav .nav-menu > ul > li.nav-menu-cta{ display:none !important; }

  /* schowaj wyzwalacz mega-menu (kropki) na desktopie — pozycje są widoczne wprost */
  .nav .nav-menu > ul > li.more{ display:none !important; }
}

/* =========================================================================
   HERO — sekcja główna (.hero-2026)
   ========================================================================= */
.hero-2026{
  position:relative;
  background:#fff;
  overflow:hidden;
  padding:70px clamp(16px,4vw,56px) 52px;
}
.hero-2026-wrap{
  max-width:1760px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:clamp(24px,4vw,64px);
  align-items:center;
}

/* --- kolumna z treścią --- */
.hero-2026-copy{ min-width:0; }
.hero-2026-eyebrow{
  display:flex;align-items:center;gap:14px;
  margin:0 0 22px;
  color:var(--pp-orange);
  font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
}
.hero-2026-eyebrow-line{ width:34px;height:3px;background:var(--pp-orange);border-radius:2px;flex:0 0 auto; }

.hero-2026-title{
  margin:0 0 18px;
  color:var(--pp-navy);
  font-weight:800;
  font-size:clamp(2.05rem,4.6vw,3.85rem);
  line-height:1.06;
  letter-spacing:-.02em;
}
.hero-2026-sub{
  margin:0 0 26px;
  color:var(--pp-muted);
  font-size:clamp(1.02rem,1.25vw,1.2rem);
  line-height:1.6;font-weight:400;
  max-width:34em;
}

/* --- przyciski --- */
.hero-2026-cta{ display:flex;flex-wrap:wrap;gap:14px;margin:0 0 30px; }
.hero-btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 26px;border-radius:12px;
  font-weight:700;font-size:1.02rem;line-height:1;
  text-decoration:none;cursor:pointer;
  transition:background .18s ease,box-shadow .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.hero-btn svg{ transition:transform .18s ease; }
.hero-btn:hover svg{ transform:translateX(3px); }
.hero-btn-primary{ background:var(--pp-orange);color:#fff;box-shadow:0 10px 24px rgba(242,89,31,.28); }
.hero-btn-primary:hover{ background:var(--pp-orange-2);color:#fff;box-shadow:0 12px 28px rgba(242,89,31,.36);transform:translateY(-1px); }
.hero-btn-ghost{ background:#fff;color:var(--pp-navy);border:2px solid #d7dee8; }
.hero-btn-ghost:hover{ border-color:var(--pp-navy);color:var(--pp-navy);transform:translateY(-1px); }

/* --- pasek zaufania (grid: 2×2, a od 1240px w jednym rzędzie) --- */
.hero-2026-trust{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,auto));
  gap:16px 0;
  margin:0;padding:0;list-style:none;
  justify-content:start;
}
.hero-trust-item{ display:flex;align-items:center;gap:11px;padding:2px 22px;border-left:1px solid var(--pp-line); }
.hero-trust-item:nth-child(2n+1){ border-left:0;padding-left:0; }
.hero-trust-ico{ color:var(--pp-orange);flex:0 0 auto;display:inline-flex; }
.hero-trust-ico svg{ width:24px;height:24px; }
.hero-trust-txt{ display:flex;flex-direction:column;line-height:1.2;color:var(--pp-muted);font-size:.82rem; }
.hero-trust-txt b{ color:var(--pp-navy);font-weight:800;font-size:1rem;margin-bottom:1px; }
@media (min-width:1240px){
  .hero-2026-trust{ grid-template-columns:repeat(4,auto); }
  .hero-trust-item{ border-left:1px solid var(--pp-line);padding-left:22px; }
  .hero-trust-item:first-child{ border-left:0;padding-left:0; }
}

/* --- ilustracja (złożenie grafik) --- */
.hero-2026-art{ min-width:0; }
.hero-2026-stage{ position:relative;width:100%;aspect-ratio:1 / .78; }
.hero-art{ position:absolute;height:auto;max-width:none; }
.hero-art-imac{ width:83%;right:0;top:2%;z-index:1;filter:drop-shadow(0 26px 44px rgba(15,42,74,.18)); }
.hero-art-tablet{ width:63%;left:0;bottom:0;z-index:2;filter:drop-shadow(0 24px 40px rgba(15,42,74,.22)); }
.hero-art-card{ z-index:3;filter:drop-shadow(0 16px 30px rgba(15,42,74,.16)); }
.hero-art-card-1{ width:40%;left:0;top:1%; }
.hero-art-card-2{ width:35%;right:-3%;bottom:7%; }

/* =========================================================================
   ANIMACJE — wejście (stagger) + delikatne unoszenie kart.
   Uwaga: wejście na .hero-2026-art (rodzic), unoszenie na kartach (dzieci) —
   brak konfliktu transformów. Wszystko wyłączane przy prefers-reduced-motion.
   ========================================================================= */
@keyframes ppFadeUp{ from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:translateY(0)} }
@keyframes ppRise{ from{opacity:0;transform:translateY(28px) scale(.985)} to{opacity:1;transform:translateY(0) scale(1)} }
@keyframes ppFloatA{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes ppFloatB{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(9px)} }

.hero-2026-eyebrow{ animation:ppFadeUp .6s .05s both cubic-bezier(.22,.61,.36,1); }
.hero-2026-title{ animation:ppFadeUp .7s .14s both cubic-bezier(.22,.61,.36,1); }
.hero-2026-sub{ animation:ppFadeUp .7s .24s both cubic-bezier(.22,.61,.36,1); }
.hero-2026-cta{ animation:ppFadeUp .7s .34s both cubic-bezier(.22,.61,.36,1); }
.hero-2026-trust{ animation:ppFadeUp .7s .44s both cubic-bezier(.22,.61,.36,1); }
.hero-2026-art{ animation:ppRise .9s .18s both cubic-bezier(.22,.61,.36,1); }
.hero-art-card-1{ animation:ppFloatA 6s ease-in-out 1.1s infinite; }
.hero-art-card-2{ animation:ppFloatB 7s ease-in-out 1.3s infinite; }

@media (prefers-reduced-motion: reduce){
  .hero-2026-eyebrow,.hero-2026-title,.hero-2026-sub,.hero-2026-cta,
  .hero-2026-trust,.hero-2026-art,.hero-art-card-1,.hero-art-card-2{
    animation:none !important;opacity:1 !important;transform:none !important;
  }
}

/* =========================================================================
   RESPONSYWNOŚĆ
   ========================================================================= */
@media (max-width:991px){
  .hero-2026{ padding:80px clamp(16px,5vw,40px) 44px; }
  .hero-2026-wrap{ grid-template-columns:1fr;gap:30px; }
  .hero-2026-art{ width:100%;max-width:520px;margin:2px auto 0; }
}
@media (max-width:600px){
  .hero-2026-title{ font-size:clamp(1.9rem,8.5vw,2.5rem); }
  .hero-2026-stage{ aspect-ratio:1 / .64; }
  .hero-art-imac{ width:86%; }
  .hero-art-tablet{ width:66%; }
  .hero-art-card-1{ width:46%;left:0;top:0; }
  .hero-art-card-2{ display:none; }
}
