:root{
  --ex2-brand:#c6a07a;
  --ex2-brand-soft:#e8d7c5;
  --ex2-text:#222a33;
  --ex2-muted:#6f7580;
  --ex2-bg:#fff;
  --ex2-shadow:0 18px 40px rgba(0,0,0,.12);
}

/* Sekcja / layout */
.ex2{
  background:var(--ex2-bg);
  padding:clamp(36px,5vw,90px) 0;
  overflow:hidden;
}
.ex2-wrap{
  max-width: 900px;
  width:min(1200px,92%);
  margin:0 auto;
  display:grid;
  gap:clamp(28px,4vw,64px);
  grid-template-columns:1.05fr 1fr;
  align-items:center;
}
@media (max-width:980px){
  .ex2-wrap{ grid-template-columns:1fr; }
}

/* Kolumna lewa (scena) */
.ex2-left{ position:relative; min-height:560px; }
@media (max-width:980px){ .ex2-left{ min-height:460px; } }

/* Pierścień */
.ex2-ring{
  position:absolute;
  left:-25%;
  bottom:0;
  width:580px;
  height:580px;
  background: var(--ex2-ring) center / contain no-repeat;
  opacity:.55;
  transform-origin:50% 50%;
  animation: ex2-rot 28s linear infinite;
  pointer-events:none;
  z-index:0;
  filter:saturate(.95);
}
@media (max-width:980px){
  .ex2-ring{ left:-14%; bottom:-12%; width:480px; height:480px; }
}
@keyframes ex2-rot { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion:reduce){ .ex2-ring{ animation:none; } }

/* Zdjęcia */
.ex2-photo{
  position:absolute;
  overflow:hidden;
  border-radius:12px;
  box-shadow:var(--ex2-shadow);
  transform:translateZ(0) scale(.94);
  opacity:0;
  z-index:1;
}
.ex2-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.ex2-photo.p1{ left:4%;  top:8%;  width:48%; height:64%; }
.ex2-photo.p2{ left:38%; top:20%; width:44%; height:70%; }
.js .ex2-photo.rev{ opacity:0; transform:translateY(14px) scale(.94); }
.js .ex2-photo.rev.in{ opacity:1; transform:none; transition:transform .8s cubic-bezier(.2,.7,.2,1), opacity .6s ease; }
.ex2-photo:hover img{ transform:scale(1.04); transition:transform .35s ease; }

/* Liczniki */
.ex2-badges{
  position:absolute; right:6%; bottom:4%;
  display:flex; gap:16px; flex-wrap:wrap; z-index:2;
}
.ex2-badge{
  background:var(--ex2-brand); color:#fff; border-radius:12px;
  padding:16px 18px; min-width:160px; text-align:center;
  box-shadow:var(--ex2-shadow); transform:translateY(10px); opacity:0;
}
.ex2-num{ font-weight:900; font-size:clamp(28px,3.6vw,44px); line-height:1; letter-spacing:.5px; }
.ex2-small{ font-size:13px; opacity:.95; }
.js .ex2-badge.rev{ opacity:0; transform:translateY(14px); }
.js .ex2-badge.rev.in{ opacity:1; transform:none; transition:transform .6s ease, opacity .6s ease; }

/* Prawa kolumna */
.ex2-title{
  color:var(--ex2-text);
  font-size:clamp(26px,3.2vw,40px);
  line-height:1.15;
  margin:0 0 10px;
  font-weight:800;
}
.ex2-lead{
  color:var(--ex2-muted);
  margin:0 0 16px;
  font-size:17px;
}

/* =================== Linia dekoracyjna – WARIANTY =================== */
.ex2-line{
  display:inline-block;
  width:var(--line-l, 130px);
  height:var(--line-h, 6px);
  margin:6px 0 20px;
  opacity:.95;
  background:none !important;     /* <- gasi stare tło */
}

/* solid */
.ex2-line--solid{
  background: var(--line-color, var(--ex2-brand)) !important;
  border-radius: 999px;
}

/* dashed */
.ex2-line--dashed{
  height: max(2px, var(--line-h, 6px));
  background: repeating-linear-gradient(
    90deg,
    var(--line-color, var(--ex2-brand)) 0 calc(var(--line-gap,16px) / 2),
    transparent calc(var(--line-gap,16px) / 2) var(--line-gap,16px)
  ) !important;
}

/* double (dwie cienkie kreski) */
.ex2-line--double{
  background:
    linear-gradient(90deg, var(--line-color, var(--ex2-brand)) 0 100%),
    linear-gradient(90deg, var(--line-color, var(--ex2-brand)) 0 100%) !important;
  background-repeat:no-repeat !important;
  background-size: 100% 2px, 100% 2px !important;
  background-position: 0 0, 0 calc(100% - 2px) !important;
  height: max(6px, var(--line-h, 6px));
}

/* dots */
.ex2-line--dots{
  height: max(4px, var(--line-h, 6px));
  background:
    radial-gradient(circle, var(--line-color, var(--ex2-brand)) 3px, transparent 3px) !important;
  background-size: var(--line-gap, 16px) var(--line-gap, 16px) !important;
  background-repeat: repeat-x !important;
  background-position: left center !important;
}

/* brand (oryginalny efekt – dwa rzędy kresek) */
.ex2-line--brand{
  background:
    linear-gradient(90deg, var(--line-color, var(--ex2-brand)) 0 10px, transparent 10px var(--line-gap,16px)) left/var(--line-gap,16px) 2px repeat-x,
    linear-gradient(90deg, var(--line-color, var(--ex2-brand)) 0 10px, transparent 10px var(--line-gap,16px)) left/var(--line-gap,16px) 2px repeat-x !important;
  background-position: 0 0, 0 calc(var(--line-h, 6px) - 2px) !important;
}


/* Wejścia na scroll (tekst/ikony) */
.rev{ opacity:1; transform:none; }
.js .rev{ opacity:0; transform:translateX(-18px); }
.js .rev.in{ opacity:1; transform:none; transition:transform .6s cubic-bezier(.2,.7,.2,1), opacity .6s ease; }
@media (max-width:640px){ .js .rev{ transform:translateY(12px); } }

/* USP (wyróżniki) */
.ex2-feats{ list-style:none; margin:0 0 24px; padding:0; display:grid; gap:18px; }
.ex2-feats li{ display:grid; grid-template-columns:52px 1fr; gap:14px; align-items:flex-start; }
.ex2-feats .icon{ width:52px; height:52px; display:grid; place-items:center; color:var(--ex2-text); border:0; box-shadow:none; background:transparent; }
.ex2-feats .icon img{ max-width:100%; max-height:100%; object-fit:contain; display:block; }
.ex2-feats .icon svg{ color:inherit; fill:currentColor; }

.ex2-feats h3{ margin:0 0 4px; color:var(--ex2-text); font-size:20px; font-weight:800; }
.ex2-feats p{ margin:0; color:var(--ex2-muted); }

/* CTA */
.ex2-cta{
  display:inline-flex; align-items:center; gap:10px;
  color:#fff; text-decoration:none; font-weight:900;
  background:var(--ex2-brand); padding:14px 22px; border-radius:999px;
  box-shadow:var(--ex2-shadow); transition:transform .2s ease, box-shadow .2s ease;
}
.ex2-cta:hover{ transform:translateY(-2px); box-shadow:0 24px 48px rgba(198,160,122,.35); }
.ex2-cta .arr{ transition:transform .2s ease; }
.ex2-cta:hover .arr{ transform:translateX(4px); }

/* Subtelny parallax (sterowany w JS) */
.ex2-left[data-parallax] .ex2-photo,
.ex2-left[data-parallax] .ex2-badge{ transition:transform .2s ease; }

/* w edytorze Elementora zawsze pokazuj */
.elementor-editor-active .ex2 .rev{
  opacity:1 !important;
  transform:none !important;
  transition:none !important;
}