/* Bezpieczny Tag - sekcja "Wiecej swobody dla dziecka" (projekt z 13 wrzesnia: scena z maskotka). Plik generowany przez Novamira. */

.bt-swb{position:relative;overflow:hidden;background:linear-gradient(90deg,#E8F5FE 0%,#EBF7FE 45%,#E9F4FE 100%)}

/* ozdoby po prawej: miekkie kola i rozowe kreski jak na makiecie */
.bt-swb__deco{position:absolute;inset:0;pointer-events:none;z-index:1}
.bt-swb__deco .s-circ{position:absolute;border-radius:50%;background:#DDEEFB}
.bt-swb__deco .s-circ--a{right:-6%;top:-38%;width:30vw;max-width:520px;aspect-ratio:1/1;background:radial-gradient(circle at 50% 50%,#E3F1FC 0%,#DCEBFA 100%)}
.bt-swb__deco .s-circ--b{right:22%;bottom:-30%;width:14vw;max-width:240px;aspect-ratio:1/1;background:#E2F0FC}
.bt-swb__deco svg{position:absolute;display:block;height:auto}
.bt-swb__deco .s-p1{right:5.5%;top:17%;width:clamp(18px,1.7vw,30px);transform:rotate(-12deg)}
.bt-swb__deco .s-p2{right:2.6%;top:40%;width:clamp(16px,1.5vw,26px);transform:rotate(-6deg)}

.bt-swb__in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.96fr) minmax(0,1.1fr);align-items:stretch}

/* scena z maskotka, miekko wtopiona w tlo sekcji */
.bt-swb__media{position:relative;min-height:clamp(380px,40vw,620px)}
.bt-swb__media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%;display:block;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 82%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(90deg,#000 0%,#000 82%,rgba(0,0,0,0) 100%)}

/* tresc */
.bt-swb__copy{align-self:center;padding-block:clamp(34px,3.6vw,64px);padding-inline-start:clamp(18px,2.2vw,44px);padding-inline-end:max(5vw,calc((100vw - 1240px) / 2))}

.bt-swb__title{font-weight:900;font-size:clamp(26px,3vw,44px);line-height:1.08;letter-spacing:-.03em;color:#0E1C63;margin:0 0 18px;text-wrap:balance}
.bt-swb__title span{position:relative;display:inline-block;z-index:1}
.bt-swb__title span::after{content:"";position:absolute;left:-.04em;right:-.04em;bottom:-.05em;height:.2em;background:#BFDCFA;border-radius:999px;z-index:-1}

.bt-swb__lead{font-size:clamp(15px,1.2vw,18px);line-height:1.6;color:rgba(14,28,99,.78);margin:0 0 clamp(22px,2.4vw,36px);max-width:36em;text-wrap:pretty}

.bt-swb__cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.1vw,18px)}
.bt-swb__card{background:#fff;border-radius:20px;padding:clamp(18px,1.7vw,28px) clamp(10px,1vw,16px);text-align:center;box-shadow:0 10px 26px rgba(20,38,94,.08);transition:transform .28s cubic-bezier(.16,.84,.44,1),box-shadow .28s ease}
.bt-swb__card:hover{transform:translateY(-5px);box-shadow:0 18px 36px rgba(20,38,94,.13)}
.bt-swb__ico{display:grid;place-items:center;margin:0 0 14px}
.bt-swb__ico svg{width:clamp(38px,3.4vw,52px);height:auto;display:block}
.bt-swb__ico img{width:auto;height:auto;max-width:clamp(38px,3.4vw,52px);max-height:clamp(38px,3.4vw,52px);display:block}
.bt-swb__card h3{font-weight:900;font-size:clamp(15px,1.2vw,19px);line-height:1.2;letter-spacing:-.01em;color:#0E1C63;margin:0 0 6px;text-wrap:balance}
.bt-swb__card p{font-size:clamp(13px,1.02vw,15.5px);line-height:1.35;color:rgba(14,28,99,.7);margin:0;text-wrap:pretty}

@media (max-width:1080px){
  .bt-swb__cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:900px){
  .bt-swb__in{grid-template-columns:1fr}
  .bt-swb__media{min-height:0;aspect-ratio:4/3;order:1}
  .bt-swb__media>img{object-position:50% 50%;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 84%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(180deg,#000 0%,#000 84%,rgba(0,0,0,0) 100%)}
  .bt-swb__copy{order:2;padding-inline:5vw;padding-block:10px 40px}
  .bt-swb__deco .s-circ--a{right:-24%;top:auto;bottom:-10%;width:52vw}
  .bt-swb__deco .s-circ--b,.bt-swb__deco .s-p1,.bt-swb__deco .s-p2{display:none}
}

@media (max-width:520px){
  .bt-swb__cards{grid-template-columns:1fr}
  .bt-swb__card{display:flex;align-items:center;gap:14px;text-align:left;padding:14px 16px}
  .bt-swb__ico{margin:0}
  .bt-swb__ico svg{width:36px}
  .bt-swb__ico img{max-width:36px;max-height:36px}
}

@media (prefers-reduced-motion:reduce){
  .bt-swb__card{transition:none}
}
