.elementor-711 .elementor-element.elementor-element-ad5737a{--display:flex;}@media(max-width:767px){.elementor-711 .elementor-element.elementor-element-ad5737a{--justify-content:flex-start;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-711 .elementor-element.elementor-element-2eea7f7 > .elementor-widget-container{margin:-20px 0px 0px 0px;}}@media(min-width:768px){.elementor-711 .elementor-element.elementor-element-ad5737a{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-ad5737a */:root{
    --bg:#ffffff;
    --ink:#101828;
    --muted:#475467;
    --soft:#FFF7F5;        /* delikatny róż z palety */
    --line:#EAECF0;

    --c1:#F47676;          /* koral */
    --c2:#FED071;          /* żółty */
    --c3:#1BC1B6;          /* turkus */
    --c4:#EA3014;          /* mocne CTA */

    --radius:18px;
    --shadow:0 12px 34px rgba(16,24,40,.10);
    --shadow2:0 10px 22px rgba(16,24,40,.12);

    --max:1200px;          /* BYLO 1100px -> TERAZ 1200px */
  }

  /* Wrapper */
  .bc-wrap{
    font-family: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color:var(--ink);
    background:var(--bg);
  }

  .bc-container{max-width:var(--max); margin:0 auto; padding:0 18px;}
  .bc-section{padding:54px 0;}
  .bc-grid{display:grid; gap:18px;}
  .bc-2{grid-template-columns:1.15fr .85fr;}
  .bc-3{grid-template-columns:repeat(3,1fr);}

  /* Cards */
  .bc-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:22px;}
  .bc-soft{background:linear-gradient(180deg, #fff, #fff), radial-gradient(600px 220px at 15% 0%, rgba(244,118,118,.18), transparent 60%); 
           background-origin:border-box; background-clip:padding-box,border-box;
           border:1px solid transparent; border-radius:var(--radius); padding:18px;}

  /* Typography */
  .bc-badge{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:999px; border:1px solid var(--line); background:#fff; font-size:13px; color:var(--muted);}
  .bc-dot{width:9px; height:9px; border-radius:99px; background:var(--c3); display:inline-block;}
  .bc-h1{font-size:40px; line-height:1.06; margin:12px 0 10px;}
  .bc-h2{font-size:28px; line-height:1.15; margin:0 0 10px;}
  .bc-h3{font-size:18px; margin:0 0 8px;}
  .bc-p{color:var(--muted); margin:0 0 14px; font-size:16px; line-height:1.6;}
  .bc-small{color:var(--muted); font-size:13px; line-height:1.45;}
  .bc-ul{margin:0; padding:0 0 0 18px; color:var(--muted); line-height:1.6;}
  .bc-ul li{margin:6px 0;}

  /* Buttons */
  .bc-ctaRow{display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:12px;}
  .bc-btn{
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    padding:14px 16px; border-radius:14px; border:1px solid transparent;
    background:var(--c4); color:#fff; text-decoration:none; font-weight:800;
    box-shadow:var(--shadow2); transition:transform .12s ease, filter .12s ease;
  }
  .bc-btn:hover{transform:translateY(-1px); filter:brightness(1.02);}
  .bc-btn2{
    background:#fff; color:var(--ink); border-color:var(--line); box-shadow:none;
  }

  /* Pills / tags */
  .bc-pill{display:inline-flex; gap:8px; align-items:center; font-size:13px; color:var(--muted);
    padding:8px 12px; border-radius:999px; border:1px dashed var(--line); background:#fff;}
  .bc-pill strong{color:var(--ink);}
  .bc-tags{display:flex; gap:10px; flex-wrap:wrap; margin:12px 0 8px;}
  .bc-tag{padding:8px 12px; border-radius:999px; border:1px solid var(--line); background:#fff; color:var(--muted); font-size:13px;}
  .bc-hr{height:1px; background:var(--line); margin:18px 0; border:0;}

  /* Feature blocks */
  .bc-feature{display:flex; gap:12px; align-items:flex-start;}
  .bc-icon{width:34px; height:34px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-weight:900;}
  .i-teal{background:rgba(27,193,182,.16); color:var(--c3);}
  .i-yellow{background:rgba(254,208,113,.22); color:#8a5a00;}
  .i-coral{background:rgba(244,118,118,.18); color:var(--c1);}

  /* Steps */
  .bc-steps{display:grid; gap:12px;}
  .bc-step{display:flex; gap:12px; align-items:flex-start; padding:14px; border:1px solid var(--line); border-radius:16px; background:#fff;}
  .bc-step .n{width:28px; height:28px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-weight:900;}
  .n-teal{background:rgba(27,193,182,.18); color:var(--c3);}
  .n-coral{background:rgba(244,118,118,.18); color:var(--c1);}
  .n-yellow{background:rgba(254,208,113,.28); color:#8a5a00;}

  /* FAQ */
  details.bc-faq{border:1px solid var(--line); border-radius:16px; padding:14px; background:#fff;}
  details.bc-faq summary{cursor:pointer; font-weight:900; color:var(--ink); list-style:none;}
  details.bc-faq summary::-webkit-details-marker{display:none;}
  details.bc-faq p{margin:10px 0 0; color:var(--muted); line-height:1.6;}

  /* Sticky CTA (mobile) */
  .bc-sticky{position:fixed; left:0; right:0; bottom:0; background:#fff; border-top:1px solid var(--line);
    padding:10px 14px; display:none; z-index:9999;}
  .bc-sticky .bc-container{display:flex; gap:10px; align-items:center; justify-content:space-between;}
  .bc-sticky .mini{font-size:13px; color:var(--muted);}
  .bc-sticky .mini strong{color:var(--ink);}

  /* Responsive */
  @media (max-width: 980px){
    .bc-2{grid-template-columns:1fr;}
    .bc-3{grid-template-columns:1fr;}
    .bc-h1{font-size:34px;}
  }
  @media (max-width: 720px){
    .bc-section{padding:42px 0;}
    .bc-h1{font-size:30px;}
    .bc-sticky{display:block;}
  }
  
  /* === MOBILE FIX: brak poziomego overflow + poprawne zawijanie === */
html, body { overflow-x: hidden !important; }
.bc-wrap { overflow-x: hidden !important; }

/* box sizing, żeby padding nie rozpychał szerokości */
.bc-wrap, .bc-wrap * { box-sizing: border-box !important; }

/* grid children muszą mieć min-width:0, inaczej potrafią „wypychać” */
.bc-grid > * { min-width: 0 !important; }

/* wymuś łamanie długich fragmentów (np. gdy coś wstawi plugin/shortcode) */
.bc-wrap p, .bc-wrap h1, .bc-wrap h2, .bc-wrap h3, .bc-wrap span, .bc-wrap a, .bc-wrap div {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* media / iframe też potrafią robić overflow */
.bc-wrap img, .bc-wrap iframe, .bc-wrap video, .bc-wrap svg {
  max-width: 100% !important;
  height: auto !important;
}

/* === HERO stricte === */
@media (max-width: 767px){

  /* kontener zawsze w 100% */
  #bc-top .bc-container { max-width: 100% !important; width: 100% !important; }

  /* rotujący tekst: nigdy nie wymuszaj jednej linii */
  #bc-top .bc-rotate,
  #bc-top .bc-rotate__word {
    max-width: 100% !important;
    white-space: normal !important;
  }

  /* TAGI: dwa równe kafelki i brak ucinania */
  #bc-top .bc-tags{
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  #bc-top .bc-tag{
    width: 100% !important;
    min-width: 0 !important;
    text-align: center !important;
    white-space: normal !important;
  }

  /* CTA: pełna szerokość */
  #bc-top .bc-ctaRow{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #bc-top .bc-btn, 
  #bc-top .bc-btn2{
    width: 100% !important;
  }
}
/* =========================
   PATCH: Buttons/Links colors (visited/hover/focus/active)
   Fixes "black/purple" states on mobile/Elementor
   ========================= */

/* Base buttons (anchors + buttons) */
.bc-wrap .bc-btn,
.bc-wrap a.bc-btn,
.bc-wrap a.bc-btn:link,
.bc-wrap a.bc-btn:visited,
.bc-wrap a.bc-btn:hover,
.bc-wrap a.bc-btn:active,
.bc-wrap a.bc-btn:focus{
  background: var(--c4) !important;
  color: #fff !important;
  border-color: transparent !important;
  text-decoration: none !important;
  -webkit-text-fill-color:#fff !important; /* iOS/Safari */
}

/* Secondary button */
.bc-wrap .bc-btn2,
.bc-wrap a.bc-btn2,
.bc-wrap a.bc-btn2:link,
.bc-wrap a.bc-btn2:visited,
.bc-wrap a.bc-btn2:hover,
.bc-wrap a.bc-btn2:active,
.bc-wrap a.bc-btn2:focus{
  background:#fff !important;
  color: var(--ink) !important;
  border:1px solid var(--line) !important;
  text-decoration:none !important;
  -webkit-text-fill-color: var(--ink) !important;
}

/* Keep hover effect but never change colors */
.bc-wrap a.bc-btn:hover{ filter:brightness(1.02) !important; }
.bc-wrap a.bc-btn2:hover{ background:#fff !important; filter:brightness(1.01) !important; }

/* Focus ring (optional, consistent) */
.bc-wrap a.bc-btn:focus-visible,
.bc-wrap a.bc-btn2:focus-visible,
.bc-wrap button.bc-btn:focus-visible{
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(234,48,20,.14) !important;
}

/* Stop global visited styles from theme affecting any CTA links */
.bc-wrap a:visited{
  color: inherit; /* doesn't override bc-btn because it's more specific above */
}

/* If Elementor theme adds underline on hover */
.bc-wrap a.bc-btn,
.bc-wrap a.bc-btn2{
  text-decoration:none !important;
}/* End custom CSS */