/* Baner „flagowy system” — sekcja pod hero ogniwo.ai (podgląd 26.10.2026) */
.flagship{padding-block:40px 24px}
.flagship-card{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:48px;align-items:center;background:#182e30;color:#fff;border-radius:24px;padding:48px 48px 40px;max-width:1220px;margin-inline:auto}
.flagship-card:before{content:"";position:absolute;inset:auto -120px -220px auto;width:520px;height:520px;border-radius:50%;border:1px solid rgba(200,244,220,.12);pointer-events:none}
.flagship-card:after{content:"";position:absolute;inset:-160px auto auto -160px;width:380px;height:380px;border-radius:50%;border:1px solid rgba(200,244,220,.08);pointer-events:none}
.flagship-eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.08em;font-weight:600;text-transform:uppercase;color:#145c63;background:#c8f4dc;border-radius:999px;padding:6px 12px;margin:0 0 22px}
.flagship-eyebrow b{font-weight:700}
.flagship-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:#145c63}
.flagship h2{font-size:clamp(30px,3.3vw,46px);line-height:1.08;letter-spacing:-.02em;font-weight:600;margin:0;color:#fff;max-width:15ch}
.flagship h2 em{font-style:normal;color:var(--mint,#c8f4dc)}
.flagship-payoff{font-size:16px;line-height:1.6;color:#cfe1dc;margin:18px 0 0;max-width:46ch}
.flagship-client{display:flex;align-items:center;gap:12px;margin-top:22px;font-size:12px;color:#a8c4bd}
.flagship-client img{height:22px;width:auto;background:#fff;border-radius:6px;padding:5px 8px}
.flagship-stats{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:12px;margin-top:30px}
.flagship-stat{background:rgba(255,255,255,.05);border:1px solid rgba(200,244,220,.14);border-radius:14px;padding:16px 16px 14px}
.flagship-stat--main{background:var(--mint,#c8f4dc);border-color:transparent;color:var(--ink,#182e30)}
.flagship-stat strong{display:block;font-size:30px;line-height:1;font-weight:700;letter-spacing:-.02em}
.flagship-stat--main strong{font-size:38px}
.flagship-stat span{display:block;font-size:12px;line-height:1.45;margin-top:8px;color:#cfe1dc}
.flagship-stat--main span{color:#20474a}
.flagship-stat s{text-decoration:line-through;opacity:.65}
.flagship-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:28px}
.flagship-button{display:inline-flex;align-items:center;gap:14px;background:#fff;color:var(--ink,#182e30);min-height:52px;padding:12px 22px;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none;transition:transform .2s var(--ease,ease),background .2s}
.flagship-button:hover{transform:translateY(-1px);background:var(--mint,#c8f4dc)}
.flagship-button svg{width:16px;height:16px}
.flagship-link{font-size:13px;color:#d8efe4;text-decoration:none;border-bottom:1px solid rgba(216,239,228,.35);padding-bottom:2px}
.flagship-note{font-size:11px;line-height:1.55;color:#8fb0a8;margin:22px 0 0;max-width:62ch}
.flagship-visual{position:relative}
.flagship-window{background:#0b2228;border:1px solid rgba(200,244,220,.16);border-radius:14px;overflow:hidden;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.flagship-window-bar{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid rgba(200,244,220,.1);font-size:11px;color:#8fb0a8}
.flagship-window-bar i{width:8px;height:8px;border-radius:50%;background:rgba(200,244,220,.25)}
.flagship-window-bar span{margin-left:8px}
.flagship-window img{display:block;width:100%;height:auto}
.flagship-flow{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;counter-reset:f}
.flagship-flow li{counter-increment:f;display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:#e6f3ee;background:rgba(255,255,255,.06);border:1px solid rgba(200,244,220,.14);border-radius:999px;padding:7px 12px 7px 8px}
.flagship-flow li:before{content:counter(f);display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--mint,#c8f4dc);color:var(--ink,#182e30);font-size:11px;font-weight:700}
.flagship-badge{position:absolute;right:-14px;top:-26px;background:#fff;color:var(--ink,#182e30);border-radius:12px;padding:12px 14px;box-shadow:0 18px 40px rgba(0,0,0,.25);font-size:12px;line-height:1.35;max-width:220px}
.flagship-badge strong{display:block;font-size:20px;color:var(--petrol,#145c63)}
@media (max-width:1050px){.flagship-card{grid-template-columns:1fr;gap:36px;padding:40px 32px}.flagship h2{max-width:20ch}.flagship-badge{right:12px;top:-18px}}
@media (max-width:700px){.flagship{padding-block:24px 8px}.flagship-card{padding:30px 20px 26px;border-radius:18px}.flagship-stats{grid-template-columns:1fr 1fr}.flagship-stat--main{grid-column:1/-1}.flagship-stat strong{font-size:24px}.flagship-stat--main strong{font-size:32px}.flagship-payoff{font-size:15px}.flagship-badge{display:none}.flagship-flow li{font-size:11px}}

.flagship-hero{display:flex;align-items:flex-end;gap:18px;margin-top:30px;padding-top:26px;border-top:1px solid rgba(200,244,220,.14)}
.flagship-hero strong{font-size:64px;line-height:.9;font-weight:700;letter-spacing:-.02em;color:#c8f4dc;font-variant-numeric:tabular-nums}
.flagship-hero span{font-size:18px;line-height:1.35;font-weight:500;color:#fff}
.flagship-hero small{display:block;font-size:14px;font-weight:400;color:#8fa3a0;margin-top:4px}
.flagship-hero small s{text-decoration:line-through}
.flagship-secondary{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:22px}
.flagship-secondary div strong{display:block;font-size:32px;line-height:1;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.flagship-secondary div span{display:block;font-size:14px;line-height:1.45;color:#8fa3a0;margin-top:6px}
.flagship-note{color:#8fa3a0;font-size:13px}
.flagship-note sup,.flagship-hero sup{color:#c8f4dc}
@media (max-width:700px){.flagship-hero strong{font-size:44px}.flagship-hero span{font-size:16px}.flagship-secondary div strong{font-size:26px}.flagship-note{font-size:13px}}
.flagship-modules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px}
.flagship-group{background:rgba(255,255,255,.04);border:1px solid rgba(200,244,220,.12);border-radius:14px;padding:14px 14px 10px}
.flagship-group h3{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#c8f4dc;margin:0 0 10px}
.flagship-group ul{list-style:none;margin:0;padding:0}
.flagship-group li{font-size:13px;line-height:1.35;color:#fff;font-weight:500;padding:7px 0;border-top:1px solid rgba(200,244,220,.1)}
.flagship-group li:first-child{border-top:0;padding-top:0}
.flagship-group li span{display:block;font-size:11.5px;font-weight:400;color:#8fa3a0;margin-top:2px}
@media (max-width:700px){.flagship-modules{grid-template-columns:1fr}}