/* Bezpieczny Tag - sekcja hero (projekt z 13 wrzesnia: maskotka + dymek). Plik generowany przez Novamira.
   Poprzednia wersja: uploads/bt-assets/_backup/bt-hero.css.v1.txt */

:root{--bt-pink:#E8188A;--bt-hero-navy:#12225A}

.bt-hero{position:relative;overflow:hidden;background:linear-gradient(160deg,#EAF3FE 0%,#F2F8FF 48%,#EAF3FE 100%)}

/* ---------- ozdoby w tle ---------- */
.bt-hero__deco{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.bt-hero__deco svg{position:absolute;display:block;height:auto}
.bt-hero__deco .d-ring{color:#DCEBFB}
.bt-hero__deco .d-ring--a{left:3%;top:-9%;width:clamp(120px,12vw,210px)}
.bt-hero__deco .d-ring--b{left:35%;top:-15%;width:clamp(150px,15vw,260px);color:#E2EEFB}
.bt-hero__deco .d-ring--c{right:-6%;top:22%;width:clamp(150px,16vw,280px);color:#DCEBFB}
.bt-hero__deco .d-ring--d{right:3%;bottom:-12%;width:clamp(110px,11vw,190px);color:#E2EEFB}
.bt-hero__deco .d-star{color:#CFE3FA}
.bt-hero__deco .d-star--a{left:2.4%;top:11%;width:clamp(26px,2.6vw,46px);transform:rotate(-8deg)}
.bt-hero__deco .d-star--b{left:1.2%;bottom:14%;width:clamp(16px,1.6vw,28px);transform:rotate(12deg)}

/* ---------- siatka ---------- */
.bt-hero__in{position:relative;z-index:2;max-width:1360px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:center;gap:clamp(20px,3vw,48px);padding:clamp(36px,4.6vw,72px) clamp(20px,4vw,64px) clamp(36px,4.2vw,64px)}

.bt-hero__copy{min-width:0}

/* plakietka */
.bt-hero__badge{display:inline-flex;align-items:center;gap:10px;background:#fff;color:#0A76F6;border-radius:999px;padding:11px 20px 11px 14px;font-size:12.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;margin:0 0 22px;box-shadow:0 6px 18px rgba(20,38,94,.08)}
.bt-hero__badgesp{width:15px;height:auto;flex:0 0 auto}

.bt-hero__title{font-weight:900;font-size:clamp(36px,4.4vw,66px);line-height:1.02;letter-spacing:-.035em;color:var(--bt-hero-navy);margin:0 0 18px;text-wrap:balance}
.bt-hero__title em{font-style:normal;color:var(--bt-pink)}

.bt-hero__lead{font-size:clamp(16px,1.25vw,19px);line-height:1.58;color:rgba(18,34,90,.72);margin:0 0 26px;max-width:36em;text-wrap:pretty}

/* trzy cechy */
.bt-hero__feats{list-style:none;display:flex;flex-wrap:wrap;gap:16px clamp(18px,2.4vw,40px);padding:0;margin:0 0 26px}
.bt-hero__feats li{display:flex;align-items:center;gap:13px;font-size:clamp(14.5px,1.05vw,16px);font-weight:700;line-height:1.3;color:var(--bt-hero-navy)}
.bt-hero__ic{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}
.bt-hero__ic svg{width:25px;height:25px;display:block}
.bt-hero__ic--blue,.bt-hero__ic--sky{background:#DBEBFC;color:#1479DE}
.bt-hero__ic--pink{background:#FDE0EF;color:#FF2D8E}

/* cena nad przyciskami */
.bt-hero__price{flex:1 1 100%;margin:0;font-size:16px;font-weight:600;line-height:1.4;color:rgba(18,34,90,.72)}
.bt-hero__price b{font-size:24px;font-weight:900;letter-spacing:-.02em;color:var(--bt-hero-navy)}

/* przyciski */
.bt-hero__buy{display:flex;flex-wrap:wrap;align-items:stretch;gap:14px 18px;margin:0 0 22px}
.bt-hero__cta{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:66px;padding:0 44px;border-radius:999px;background:linear-gradient(180deg,#22A8FE 0%,#0687FD 100%);color:#fff;font-weight:800;font-size:17px;white-space:nowrap;text-decoration:none;box-shadow:0 14px 28px rgba(3,90,200,.32);transition:transform .2s ease,box-shadow .2s ease}
.bt-hero__cta:hover{color:#fff;transform:translateY(-2px);box-shadow:0 18px 34px rgba(3,90,200,.42)}
.bt-hero__cta svg{width:22px;height:22px;flex-shrink:0;transition:transform .2s ease}
.bt-hero__cta:hover svg{transform:translateX(3px)}
.bt-hero__video{display:inline-flex;align-items:center;gap:14px;min-height:66px;padding:0 40px 0 22px;border-radius:999px;background:#fff;border:2px solid #0A76F6;color:#0A76F6;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.bt-hero__video:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,38,94,.1);background:#F4F9FF}
.bt-hero__play{width:36px;height:36px;border-radius:50%;background:#0A76F6;color:#fff;display:grid;place-items:center;flex-shrink:0}
.bt-hero__play svg{width:14px;height:14px}
.bt-hero__video b{font-size:16.5px;font-weight:800;color:#0A76F6;white-space:nowrap}

/* linijka zaufania */
.bt-hero__mini{list-style:none;display:flex;flex-wrap:wrap;gap:8px 0;padding:0;margin:0}
.bt-hero__mini li{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:600;color:rgba(18,34,90,.72);padding:0 clamp(14px,1.8vw,30px);border-left:1px solid rgba(20,38,94,.14)}
.bt-hero__mini li:first-child{padding-left:0;border-left:0}
.bt-hero__mini svg{width:24px;height:24px;color:#0A76F6;flex-shrink:0}

/* ---------- maskotka ---------- */
.bt-hero__media{position:relative;min-width:0;display:flex;justify-content:center;align-items:flex-end}
.bt-hero__mascot{position:relative;width:min(100%,560px);padding-top:clamp(70px,6.5vw,96px)}
.bt-hero__mascot>img{display:block;width:88%;max-width:520px;height:auto;margin:0 auto;filter:drop-shadow(0 26px 30px rgba(20,38,94,.22))}
.bt-hero__sp{position:absolute;width:clamp(22px,2.4vw,34px);height:auto;overflow:visible}
.bt-hero__sp--blue{right:-5%;bottom:14%;transform:rotate(200deg)}

/* dymek */
.bt-hero__bubble{position:absolute;right:-4%;top:0;z-index:3;background:#fff;border-radius:18px;padding:16px 40px 16px 20px;box-shadow:0 14px 34px rgba(20,38,94,.14);max-width:min(280px,72%)}
.bt-hero__bubble::after{content:"";position:absolute;left:14px;bottom:-14px;width:0;height:0;border-left:0 solid transparent;border-right:20px solid transparent;border-top:16px solid #fff;transform:skewX(10deg)}
.bt-hero__bubble b{display:block;font-size:clamp(18px,1.5vw,22px);font-weight:900;color:var(--bt-hero-navy);letter-spacing:-.02em;margin:0 0 3px}
.bt-hero__bubble span{display:block;font-size:clamp(13.5px,1vw,15px);line-height:1.4;color:rgba(18,34,90,.75)}
.bt-hero__bheart{position:absolute;right:14px;top:14px;width:22px;height:22px}
.bt-hero__sp--bubble{right:-26px;top:-24px;width:20px;transform:rotate(30deg)}

/* ---------- pas pod hero: cztery kafle ---------- */
.bt-hero__band{position:relative;z-index:2;background:linear-gradient(180deg,#EBF4FE 0%,#F2F8FE 55%,#EFF6FE 100%);border-top:1px solid rgba(20,38,94,.05)}
.bt-hero__bandin{max-width:1240px;margin:0 auto;padding:clamp(24px,2.5vw,40px) clamp(20px,3vw,56px) clamp(22px,2.2vw,34px)}
.bt-hero__tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.3vw,20px)}
.bt-tile{background:#fff;border-radius:20px;padding:clamp(16px,1.5vw,24px);box-shadow:0 10px 26px rgba(20,38,94,.075);transition:transform .28s cubic-bezier(.16,.84,.44,1),box-shadow .28s ease}
.bt-tile:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(20,38,94,.12)}
.bt-tile h3{font-weight:800;font-size:clamp(15.5px,1.15vw,17.5px);letter-spacing:-.01em;color:var(--bt-hero-navy);margin:0 0 7px;line-height:1.25}
.bt-tile p{font-size:clamp(13.5px,1vw,14.5px);line-height:1.5;color:rgba(18,34,90,.7);margin:0;text-wrap:pretty}

/* ---------- responsywnosc ---------- */
@media (max-width:1180px){
  .bt-hero__in{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
  .bt-hero__feats li{flex:1 1 40%}
}
@media (max-width:980px){
  .bt-hero__in{grid-template-columns:1fr;gap:10px;padding-top:30px}
  .bt-hero__media{order:2;margin-top:8px}
  .bt-hero__mascot{width:min(100%,420px);padding-top:74px}
  .bt-hero__mascot>img{width:78%}
  .bt-hero__bubble{right:0;max-width:min(250px,70%)}
  .bt-hero__sp--blue{right:0}
  .bt-hero__deco .d-ring--b{display:none}
  .bt-hero__deco .d-ring--a{left:-10%;top:-4%}
}
@media (max-width:900px){
  .bt-hero__tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .bt-hero__in{padding:26px 5vw 30px}
  .bt-hero__copy{display:flex;flex-direction:column}
  .bt-hero__badge{font-size:11.5px;padding:9px 16px 9px 12px;margin-bottom:16px;align-self:flex-start}
  .bt-hero__title{font-size:clamp(34px,9.6vw,44px);margin-bottom:14px}
  .bt-hero__lead{font-size:16px;margin-bottom:20px}
  .bt-hero__feats{order:1;gap:12px;margin:24px 0 0}
  .bt-hero__feats li{flex:1 1 100%;font-size:15.5px}
  .bt-hero__ic{width:52px;height:52px}
  .bt-hero__buy{gap:12px}
  .bt-hero__cta,.bt-hero__video{flex:1 1 100%;justify-content:center;min-height:60px;padding-inline:20px}
  .bt-hero__mini{gap:10px 0;justify-content:space-between}
  .bt-hero__mini li{font-size:13.5px;padding:0 8px;border-left:0}
  .bt-hero__mini svg{width:20px;height:20px}
  .bt-hero__mascot{padding-top:70px}
  .bt-hero__bubble{padding:12px 34px 12px 16px;border-radius:16px}
  .bt-hero__bheart{width:18px;height:18px;right:11px;top:11px}
  .bt-hero__sp--bubble{display:none}
}
@media (max-width:520px){
  .bt-hero__tiles{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .bt-hero__cta,.bt-hero__video,.bt-hero__cta svg,.bt-tile{transition:none}
}