/* =========================================================
   Natalia Wójcicka — Widgety Elementora
   Design system "Editorial Warmth". Scope: .nw (nic nie wycieka
   do motywu ani reszty strony).
   Marka: róż #D61A6F, granat #00234D, Playfair Display + Manrope.
   ========================================================= */

.nw{
  --magenta:#D61A6F;
  --magenta-deep:#B0145C;
  --rose:#CC3366;
  --navy:#00234D;
  --ink:#26262E;
  --muted:#76707A;
  --blush:#FBEEF4;
  --blush-deep:#F6DBE7;
  --line:rgba(0,35,77,.12);
  --line-soft:rgba(0,35,77,.07);
  --radius:22px;

  --display:"Playfair Display", Georgia, serif;
  --sans:"Manrope", system-ui, -apple-system, sans-serif;
  --radius-lg:34px;
  --ease:cubic-bezier(.22,.61,.36,1);

  font-family:var(--sans);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.nw *,.nw *::before,.nw *::after{box-sizing:border-box}

/* reveal (opcjonalna, włączana z poziomu widgetu) */
.nw [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.nw [data-reveal].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .nw [data-reveal]{opacity:1;transform:none}
  .nw *{animation:none!important}
}

/* =========================================================
   WIDGET: Portret w łukowej ramie + plakietka
   ========================================================= */
.nw-portrait{
  position:relative;
  width:100%;
  max-width:var(--nw-portrait-max, 480px);
  margin-inline:auto;
  padding:clamp(1.25rem,3.5vw,2.25rem);
}
/* miękka różowa poświata w tle łuku */
.nw-portrait::before{
  content:"";position:absolute;inset:0;z-index:0;border-radius:40px;
  background:
    radial-gradient(120% 90% at 80% 10%, var(--blush-deep), transparent 55%),
    radial-gradient(120% 90% at 10% 95%, var(--blush), transparent 60%),
    linear-gradient(160deg,#fff,var(--blush) 120%);
}
.nw-portrait--no-glow::before{display:none}
.nw-portrait__inner{position:relative;z-index:1}

.nw-portrait-frame{
  position:relative;
  z-index:1;                              /* zdjęcie nad ringiem */
  border-radius:var(--nw-arch,230px) var(--nw-arch,230px) var(--radius-lg) var(--radius-lg);
  overflow:hidden;
  background:linear-gradient(160deg,var(--blush),var(--blush-deep));
  box-shadow:0 40px 80px -30px rgba(0,35,77,.35);
  aspect-ratio:4 / 4.4;
}
.nw-portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
/* obrys POZA zdjęciem — koncentryczny łuk, schowany za kadrem */
.nw-portrait-ring{
  position:absolute;inset:-14px;
  z-index:0;pointer-events:none;
  border:1px solid var(--line);
  border-radius:
    calc(var(--nw-arch,230px) + 14px) calc(var(--nw-arch,230px) + 14px)
    calc(var(--radius-lg) + 14px) calc(var(--radius-lg) + 14px);
}

/* plakietka */
.nw-badge{
  position:absolute;left:-6px;bottom:34px;z-index:2;
  background:#fff;border-radius:18px;padding:.85rem 1.15rem;
  display:flex;align-items:center;gap:.75rem;
  box-shadow:0 24px 50px -18px rgba(0,35,77,.3);
  animation:nw-floaty 6s ease-in-out infinite;
}
.nw-badge__dot{width:38px;height:38px;border-radius:12px;background:linear-gradient(150deg,var(--magenta),var(--rose));display:grid;place-items:center;flex:none;color:#fff}
.nw-badge__dot svg{width:20px;height:20px;fill:currentColor;color:#fff}
.nw-badge__dot i{font-size:18px;line-height:1;color:#fff}
.nw-badge__dot img{width:20px;height:20px;object-fit:contain;display:block}
.nw-badge__text strong{display:block;font:700 .92rem/1.2 var(--display);color:var(--navy);letter-spacing:.01em}
.nw-badge__text span{display:block;font:600 .68rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--magenta);margin-top:.25rem}

@keyframes nw-floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

@media (max-width:520px){
  .nw-badge{left:50%;transform:translateX(-50%);bottom:-20px}
  @keyframes nw-floaty{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-10px)}}
}

/* =========================================================
   WIDGET: Karty atutów (ikona + tytuł + tekst), repeater
   ========================================================= */
.nw-cards{--nw-cards-cols:3}
.nw-cards__grid{
  display:grid;
  grid-template-columns:repeat(var(--nw-cards-cols,3),minmax(0,1fr));
  gap:var(--nw-cards-gap,1.1rem);
}
.nw-card{
  background:var(--nw-card-bg,#fff);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  padding:1.9rem 1.6rem;
  box-shadow:0 18px 40px -30px rgba(0,35,77,.25);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s;
}
.nw-cards--hover .nw-card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -28px rgba(0,35,77,.35);border-color:transparent}
.nw-card__ic{
  width:48px;height:48px;border-radius:14px;
  background:var(--nw-ic-bg,var(--blush));
  display:grid;place-items:center;margin-bottom:1.15rem;color:var(--magenta);
}
.nw-card__ic svg{width:24px;height:24px;fill:currentColor;color:var(--magenta)}
.nw-card__ic i{font-size:22px;line-height:1;color:var(--magenta)}
.nw-card__ic img{width:24px;height:24px;object-fit:contain;display:block}
.nw-card__title{font-family:var(--display);font-weight:700;font-size:1.14rem;line-height:1.2;letter-spacing:-.01em;margin:0 0 .6rem;color:var(--navy)}
.nw-card__text{font:500 .94rem/1.65 var(--sans);color:var(--muted);margin:0}

@media (max-width:640px){.nw-cards__grid{gap:.9rem}}

/* =========================================================
   WIDGET: Certyfikaty (marquee + lightbox)
   ========================================================= */
.nw-certs{background:var(--nw-certs-bg,var(--navy));padding:clamp(2rem,5vw,3.25rem) 0;--nw-cert-speed:42s;overflow:hidden}
.nw-certs__marquee{
  position:relative;
  overflow:hidden;                 /* przytnij pas — bez poziomego scrolla strony */
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
}
.nw-certs__track{display:flex;gap:1.5rem;width:max-content;animation:nw-scroll var(--nw-cert-speed,42s) linear infinite}
.nw-certs__marquee:hover .nw-certs__track{animation-play-state:paused}
@keyframes nw-scroll{to{transform:translateX(-50%)}}

.nw-cert{width:var(--nw-cert-w,240px);flex:none}
.nw-cert__doc{
  display:block;position:relative;aspect-ratio:3/4;
  border-radius:14px;overflow:hidden;background:#fff;
  box-shadow:0 24px 50px -24px rgba(0,0,0,.55);cursor:zoom-in;
}
.nw-cert__doc img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .6s var(--ease)}
.nw-cert__doc::after{content:"";position:absolute;inset:0;background:rgba(0,35,77,0);transition:background .35s}
.nw-cert__doc:hover img{transform:scale(1.04)}
.nw-cert__doc:hover::after{background:rgba(0,35,77,.06)}
.nw-cert__zoom{position:absolute;right:.7rem;top:.7rem;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;opacity:0;transform:translateY(-4px);transition:opacity .35s,transform .35s;z-index:2}
.nw-cert__zoom svg{width:17px;height:17px;color:var(--navy)}
.nw-cert__doc:hover .nw-cert__zoom{opacity:1;transform:none}
.nw-cert__cap{padding:1rem .25rem 0}
.nw-cert__cap strong{display:block;font:700 1rem/1.25 var(--display);color:var(--nw-cert-title,#fff);letter-spacing:-.01em}
.nw-cert__cap span{display:block;font:600 .68rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--magenta);margin-top:.4rem}

@media (max-width:640px){.nw-cert{width:var(--nw-cert-w,190px)}}
@media (prefers-reduced-motion:reduce){.nw-certs__track{animation:none}.nw-certs__marquee{overflow-x:auto}}

/* =========================================================
   WIDGET: Karty usług (numerowane + pasek u góry)
   ========================================================= */
.nw-svc-grid{
  display:grid;
  grid-template-columns:repeat(var(--nw-svc-cols,3),minmax(0,1fr));
  gap:var(--nw-svc-gap,1.4rem);
}
.nw-svc{
  position:relative;overflow:hidden;
  background:var(--nw-card-bg,#fff);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  padding:2.2rem 1.9rem;
  box-shadow:0 18px 40px -30px rgba(0,35,77,.22);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease);
}
.nw-svc--rule::before{content:"";position:absolute;left:1.9rem;top:0;width:40px;height:3px;background:var(--magenta);border-radius:0 0 3px 3px}
.nw-svc-grid.nw-svc--hover .nw-svc:hover{transform:translateY(-8px);box-shadow:0 34px 60px -34px rgba(0,35,77,.4)}
.nw-svc__no{display:block;font:italic 500 1rem/1 var(--display);color:var(--nw-num,var(--rose))}
.nw-svc__ic{width:52px;height:52px;border-radius:15px;background:var(--nw-ic-bg,var(--blush));display:grid;place-items:center;margin:1.3rem 0 1.2rem;color:var(--magenta)}
.nw-svc__ic svg{width:26px;height:26px;fill:currentColor;color:var(--magenta)}
.nw-svc__ic i{font-size:24px;line-height:1;color:var(--magenta)}
.nw-svc__ic img{width:26px;height:26px;object-fit:contain;display:block}
.nw-svc__title{font-family:var(--display);font-weight:700;font-size:1.18rem;line-height:1.25;letter-spacing:-.01em;margin:0 0 .7rem;color:var(--navy)}
.nw-svc__text{font:500 .94rem/1.65 var(--sans);color:var(--muted);margin:0}

/* =========================================================
   WIDGET: FAQ / Accordion (Najczęściej zadawane pytania)
   ========================================================= */
.nw-faq{--nw-faq-gap:16px}
.nw-faq__head{text-align:var(--nw-faq-align,center);margin-bottom:clamp(2rem,4vw,3rem)}
.nw-faq__eyebrow{display:inline-block;background:#fff;border:1px solid var(--blush-deep);border-radius:999px;padding:.5rem 1.3rem;font:700 .8rem/1 var(--sans);letter-spacing:.08em;color:var(--navy);box-shadow:0 12px 30px -16px rgba(0,35,77,.25)}
.nw-faq__title{font-family:var(--display);font-weight:700;font-size:clamp(1.8rem,4vw,2.85rem);line-height:1.12;letter-spacing:-.01em;color:var(--nw-faq-title,var(--magenta));margin:1.2rem 0 0}
.nw-faq__list{display:flex;flex-direction:column;gap:var(--nw-faq-gap,16px);max-width:var(--nw-faq-max,820px);margin-inline:auto}
.nw-faq__item{background:var(--nw-faq-card,#fff);border-radius:var(--nw-faq-radius,24px);box-shadow:0 14px 36px -24px rgba(0,35,77,.22);overflow:hidden;transition:box-shadow .35s var(--ease)}
.nw-faq__item.is-open{box-shadow:0 22px 48px -26px rgba(0,35,77,.32)}
.nw-faq__q{width:100%;background:none;border:0;cursor:pointer;display:flex;align-items:center;gap:1rem;text-align:left;padding:1.35rem 1.6rem;font:600 1.05rem/1.35 var(--sans);color:var(--nw-faq-q,var(--navy))}
.nw-faq__chev{flex:none;width:22px;height:22px;display:grid;place-items:center;color:var(--magenta);transition:transform .35s var(--ease)}
.nw-faq__chev svg{width:15px;height:15px}
.nw-faq__item.is-open .nw-faq__chev{transform:rotate(90deg)}
.nw-faq__a{max-height:0;overflow:hidden;transition:max-height .42s var(--ease)}
.nw-faq__a-inner{padding:0 1.6rem 1.45rem 3.6rem;color:var(--muted);font:500 .98rem/1.7 var(--sans)}
.nw-faq__a-inner :where(p):first-child{margin-top:0}
.nw-faq__a-inner :where(p):last-child{margin-bottom:0}
@media (max-width:640px){.nw-faq__a-inner{padding-left:1.6rem}}

/* =========================================================
   WIDGET: Zdjęcie z cytatem (rama + karta na dole)
   ========================================================= */
.nw-pq{position:relative;width:100%;max-width:var(--nw-pq-max,520px);margin-inline:auto}
.nw-pq__frame{
  position:relative;overflow:hidden;
  border-radius:var(--nw-pq-radius,28px);
  aspect-ratio:var(--nw-pq-ratio,4 / 3.6);
  background:linear-gradient(160deg,var(--blush),var(--blush-deep));
  box-shadow:0 32px 64px -30px rgba(0,35,77,.32);
}
.nw-pq__frame img{width:100%;height:100%;object-fit:cover;object-position:var(--nw-pq-pos,center);display:block}
.nw-pq__card{
  position:absolute;z-index:2;
  left:var(--nw-pq-inset,18px);right:var(--nw-pq-inset,18px);bottom:var(--nw-pq-inset,18px);
  background:var(--nw-pq-card,#fff);
  border-radius:16px;padding:.95rem 1.25rem;
  box-shadow:0 18px 40px -18px rgba(0,35,77,.4);
  text-align:var(--nw-pq-align,center);
}
.nw-pq__card p{font-family:var(--display);font-style:italic;font-weight:500;font-size:var(--nw-pq-qsize,1rem);line-height:1.42;color:var(--nw-pq-qcolor,var(--navy));margin:0}

/* =========================================================
   WIDGET: Pasek przewijany (ticker / marquee)
   ========================================================= */
.nw-marq{position:relative;overflow:hidden;background:var(--nw-marq-bg,var(--magenta));--nw-marq-speed:30s}
.nw-marq__track{display:flex;align-items:center;width:max-content;animation:nw-marq var(--nw-marq-speed,30s) linear infinite;will-change:transform}
.nw-marq--right .nw-marq__track{animation-direction:reverse}
.nw-marq--pause:hover .nw-marq__track{animation-play-state:paused}
@keyframes nw-marq{to{transform:translateX(-50%)}}
.nw-marq__item{
  display:inline-flex;align-items:center;white-space:nowrap;text-decoration:none;
  color:var(--nw-marq-color,#fff);
  font-family:var(--sans);font-weight:600;
  font-size:var(--nw-marq-size,1.05rem);
  letter-spacing:var(--nw-marq-ls,.01em);
  padding:var(--nw-marq-pad,1rem) 0;
}
a.nw-marq__item:hover{text-decoration:underline;text-underline-offset:4px}
.nw-marq__sep{display:inline-flex;align-items:center;justify-content:center;flex:none;color:var(--nw-marq-sep,rgba(255,255,255,.55));margin:0 clamp(1.3rem,3vw,2.6rem);font-size:var(--nw-marq-sepsize,15px);line-height:1}
.nw-marq__sep svg{width:var(--nw-marq-sepsize,15px);height:var(--nw-marq-sepsize,15px);fill:currentColor}
.nw-marq--upper .nw-marq__item{text-transform:uppercase;letter-spacing:.12em}
@media (prefers-reduced-motion:reduce){.nw-marq__track{animation:none}.nw-marq{overflow-x:auto}}

/* =========================================================
   WIDGET: Cennik / Oferta (lista kart)
   ========================================================= */
.nw-price-head{text-align:var(--nw-price-align,left);margin-bottom:clamp(1.8rem,3.5vw,2.6rem)}
.nw-price-head .eb{display:inline-flex;align-items:center;gap:.6rem;font:600 .72rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--magenta)}
.nw-price-head .eb::before{content:"";width:26px;height:1px;background:var(--magenta)}
.nw-price-head h2{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,4vw,2.8rem);color:var(--navy);margin:.9rem 0 0;letter-spacing:-.01em}
.nw-price{display:flex;flex-direction:column;gap:1rem;max-width:var(--nw-price-max,940px);margin-inline:auto}
.nw-price__item{
  background:var(--nw-price-card,#fff);
  border:1px solid var(--line-soft);border-radius:var(--radius);
  padding:1.6rem 1.9rem;
  display:grid;grid-template-columns:1fr auto;gap:1rem 2.2rem;align-items:center;
  box-shadow:0 14px 36px -28px rgba(0,35,77,.22);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.nw-price--hover .nw-price__item:hover{transform:translateY(-3px);box-shadow:0 24px 48px -30px rgba(0,35,77,.3)}
.nw-price__title{font-family:var(--display);font-weight:700;font-size:1.26rem;line-height:1.2;color:var(--navy);margin:0;letter-spacing:-.01em}
.nw-price__note{display:inline-block;margin-top:.45rem;font:600 .7rem/1.2 var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--magenta)}
.nw-price__desc{margin:.7rem 0 0;font:500 .95rem/1.6 var(--sans);color:var(--muted);max-width:50ch}
.nw-price__meta{display:flex;flex-direction:column;align-items:flex-end;gap:.6rem;text-align:right;white-space:nowrap}
.nw-price__dur{display:inline-flex;align-items:center;gap:.45rem;background:var(--nw-price-pill,var(--blush));color:var(--navy);border-radius:100px;padding:.42rem .85rem;font:600 .8rem/1 var(--sans)}
.nw-price__dur svg{width:15px;height:15px;color:var(--magenta);flex:none}
.nw-price__price{font-family:var(--display);font-weight:700;font-size:1.75rem;line-height:1;color:var(--nw-price-color,var(--magenta))}
.nw-price__alt{font:500 .8rem/1.3 var(--sans);color:var(--muted)}
.nw-price__alt b{color:var(--navy);font-weight:700}
@media (max-width:680px){
  .nw-price__item{grid-template-columns:1fr;gap:1.1rem}
  .nw-price__meta{align-items:center;text-align:left;flex-direction:row;flex-wrap:wrap;gap:.7rem 1.2rem}
}

/* =========================================================
   WIDGET: Oś czasu / Timeline
   ========================================================= */
.nw-tl{position:relative;max-width:var(--nw-tl-max,640px)}
.nw-tl__item{position:relative;padding-left:2.6rem;padding-bottom:var(--nw-tl-gap,2rem)}
.nw-tl__item:last-child{padding-bottom:0}
.nw-tl__item::before{content:"";position:absolute;left:8px;top:1.4rem;bottom:-.2rem;width:2px;background:var(--nw-tl-line,var(--line))}
.nw-tl__item:last-child::before{display:none}
.nw-tl__dot{position:absolute;left:0;top:.55rem;width:18px;height:18px;border-radius:50%;background:#fff;border:3px solid var(--magenta);box-shadow:0 0 0 5px var(--nw-tl-halo,var(--blush))}
.nw-tl__year{display:block;font:italic 600 .92rem/1 var(--display);color:var(--nw-tl-year,var(--rose))}
.nw-tl__title{font-family:var(--display);font-weight:700;font-size:1.18rem;line-height:1.3;letter-spacing:-.01em;color:var(--navy);margin:.35rem 0 .25rem}
.nw-tl__desc{font:500 .94rem/1.6 var(--sans);color:var(--muted);margin:0}
/* znacznik roku (grupowanie) */
.nw-tl__item--year{padding-top:.5rem;padding-bottom:1rem}
.nw-tl__item--year:first-child{padding-top:0}
.nw-tl__item--year .nw-tl__dot{top:.15rem;width:16px;height:16px;background:var(--magenta);border-color:var(--magenta)}
.nw-tl__rok{font-family:var(--display);font-weight:800;font-size:1.55rem;line-height:1;letter-spacing:-.01em;color:var(--magenta)}

/* układ naprzemienny — linia na środku, pozycje raz lewo / raz prawo */
.nw-tl--alt{max-width:var(--nw-tl-max,860px);margin-inline:auto;position:relative}
.nw-tl--alt::before{content:"";position:absolute;left:50%;top:.4rem;bottom:.4rem;width:2px;background:var(--nw-tl-line,var(--line));transform:translateX(-50%)}
.nw-tl--alt .nw-tl__item{width:50%;padding:0 0 var(--nw-tl-gap,2.4rem) 0}
.nw-tl--alt .nw-tl__item::before{display:none}
.nw-tl--alt .nw-tl__item--left{margin-right:50%;padding-right:2.6rem;text-align:right}
.nw-tl--alt .nw-tl__item--right{margin-left:50%;padding-left:2.6rem;text-align:left}
.nw-tl--alt .nw-tl__dot{top:.35rem}
.nw-tl--alt .nw-tl__item--left .nw-tl__dot{left:auto;right:-9px}
.nw-tl--alt .nw-tl__item--right .nw-tl__dot{left:-9px}
.nw-tl--alt .nw-tl__item--center{width:100%;margin:0;padding:.4rem 0 1.4rem;text-align:center}
.nw-tl--alt .nw-tl__item--center .nw-tl__dot{display:none}
.nw-tl--alt .nw-tl__item--center .nw-tl__rok{display:inline-block;position:relative;background:var(--nw-tl-bg,#FDF8F6);padding:0 1rem}
@media (max-width:700px){
  .nw-tl--alt::before{left:8px;transform:none}
  .nw-tl--alt .nw-tl__item,
  .nw-tl--alt .nw-tl__item--left,
  .nw-tl--alt .nw-tl__item--right{width:100%;margin:0;padding:0 0 var(--nw-tl-gap,2rem) 2.6rem;text-align:left}
  .nw-tl--alt .nw-tl__item--left .nw-tl__dot,
  .nw-tl--alt .nw-tl__item--right .nw-tl__dot{left:0;right:auto}
  .nw-tl--alt .nw-tl__item--center{width:100%;margin:0;padding:.4rem 0 1rem 2.6rem;text-align:left}
  .nw-tl--alt .nw-tl__item--center .nw-tl__rok{padding:0;background:none}
}

/* =========================================================
   WIDGET: Breadcrumbs (okruszki, SEO)
   ========================================================= */
.nw-crumbs__list{display:flex;align-items:center;flex-wrap:wrap;gap:var(--nw-cr-gap,.55rem);list-style:none;margin:0;padding:0;justify-content:var(--nw-cr-justify,flex-start)}
.nw-crumbs__item{display:inline-flex;align-items:center;gap:var(--nw-cr-gap,.55rem);font-family:var(--sans);font-weight:600;font-size:.82rem;line-height:1.3}
.nw-crumbs a{color:var(--nw-cr-link,var(--muted));text-decoration:none;transition:color .2s}
.nw-crumbs a:hover{color:var(--magenta)}
.nw-crumbs__current{color:var(--nw-cr-current,var(--magenta))}
.nw-crumbs__sep{color:var(--nw-cr-sep,var(--muted));opacity:.6}
