/* ===== styles.css ===== */

:root{--navy:#262261;--cyan:#00B8DE;--cyan-dark:#008AA8;--ink:#24262B;--muted:#6D7680;--line:#E5E7EB;--soft:#F6F7F8;--soft-cyan:#EFFAFC;--white:#fff;--max:1200px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Poppins,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}img{display:block;max-width:100%}.wrap{width:min(var(--max),calc(100% - 48px));margin:auto}h1,h2,h3,p{margin:0}h1{font-size:clamp(48px,6.2vw,78px);line-height:.96;letter-spacing:-.055em;font-weight:600;color:var(--navy)}h2{font-size:clamp(34px,4.2vw,52px);line-height:1.04;letter-spacing:-.045em;font-weight:600;color:var(--navy)}h3{font-size:23px;line-height:1.18;letter-spacing:-.025em;color:var(--navy)}p{color:var(--muted)}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan-dark)}.section{padding:90px 0}.section-head{max-width:780px;margin-bottom:34px}.section-head p{font-size:14px;line-height:1.7;margin-top:13px;max-width:680px}
.previewbar{background:#11131a;color:#dfe3e8;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.previewbar .wrap{min-height:30px;display:flex;align-items:center;justify-content:space-between;gap:16px}.previewbar b{color:#fff}.header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.96);backdrop-filter:blur(15px);border-bottom:1px solid var(--line)}.header .wrap{height:68px;display:flex;align-items:center;gap:26px}.logo{height:28px;width:auto}.header-actions{margin-left:auto;display:flex;align-items:center;gap:18px}.header-actions a{font-size:12px;color:#59636e}.header-actions a:hover{color:var(--navy)}
.btn{min-height:50px;border-radius:2px;border:1px solid transparent;padding:13px 22px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:13px;font-weight:600;cursor:pointer;transition:.16s}.btn.primary{background:var(--navy);color:#fff}.btn.primary:hover{background:#343073;transform:translateY(-1px)}.btn.secondary{background:#fff;color:var(--navy);border-color:#CFD5DC}.btn.secondary:hover{border-color:var(--cyan)}.textlink{font-size:12px;font-weight:600;color:var(--navy);border-bottom:1px solid #C8CFD7;padding-bottom:2px}.textlink:hover{border-color:var(--cyan);color:var(--cyan-dark)}
.calibration{display:flex;align-items:end;gap:6px;height:18px;width:min(330px,100%);margin-bottom:22px}.calibration i{display:block;width:1px;height:8px;background:#AAB1BA}.calibration i:nth-child(5n+1){height:14px;background:var(--navy)}.calibration i.active{width:3px;height:18px;background:var(--cyan)}
.hero{border-bottom:1px solid var(--line);background:linear-gradient(112deg,#fff 0%,#fff 58%,#F2FAFC 100%);overflow:hidden}.hero-grid{min-height:650px;display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center;padding:56px 0 62px}.hero-copy .lead{font-size:18px;line-height:1.65;max-width:620px;margin-top:22px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.hero-mini{display:flex;gap:18px;flex-wrap:wrap;margin-top:18px}.hero-mini span{font-size:10.5px;color:var(--muted);position:relative;padding-left:12px}.hero-mini span:before{content:"";position:absolute;left:0;top:50%;width:5px;height:5px;background:var(--cyan);transform:translateY(-50%)}.hero-visual{min-height:430px;position:relative;display:flex;align-items:center;justify-content:center}.product-stage{width:100%;max-width:520px;min-height:380px;border:1px solid var(--line);background:#fff;position:relative;overflow:hidden;box-shadow:0 24px 60px rgba(38,34,97,.08)}.product-stage:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,#fff 0,#E9F8FB 48%,rgba(233,248,251,0) 72%);right:-80px;top:-20px}.asset-zone{position:absolute;inset:36px;display:grid;place-items:center;text-align:center;border:1px dashed #C6D0D8;background:rgba(255,255,255,.7);padding:30px}.asset-zone b{font-size:18px;color:var(--navy)}.asset-zone span{display:block;font-size:11px;color:var(--muted);margin-top:7px;max-width:300px}.stage-label{position:absolute;left:18px;bottom:18px;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--navy);font-weight:700}
.trust{border-bottom:1px solid var(--line)}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}.trust-item{padding:20px 24px;border-right:1px solid var(--line)}.trust-item:last-child{border-right:0}.trust-item b{font-size:13px;color:var(--navy);display:block}.trust-item span{font-size:10.5px;color:var(--muted);display:block;margin-top:3px}
.finder{background:var(--soft)}.finder-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:50px;align-items:start}.finder-intro{position:sticky;top:120px}.finder-intro p{font-size:14px;line-height:1.75;margin-top:14px}.finder-intro .calibration{margin-top:28px;margin-bottom:0}.finder-box{background:#fff;border:1px solid var(--line);padding:34px 36px;box-shadow:0 18px 48px rgba(38,34,97,.045)}.step-meta{display:flex;justify-content:space-between;gap:18px;align-items:center}.step-label{font-size:11px;color:var(--muted)}.progress{height:2px;background:#E9ECEF;margin:16px 0 32px}.progress i{display:block;height:100%;background:var(--cyan);width:33%;transition:.25s}.question h3{font-size:29px;margin-bottom:18px}.answers{display:grid;grid-template-columns:1fr 1fr;gap:9px}.answer{text-align:left;border:1px solid var(--line);background:#fff;padding:18px 18px;cursor:pointer;min-height:94px;transition:.15s}.answer:hover,.answer.selected{border-color:var(--cyan);background:var(--soft-cyan)}.answer b{display:block;font-size:14px;color:var(--navy)}.answer span{display:block;font-size:11px;color:var(--muted);margin-top:5px;line-height:1.5}.finder-nav{display:flex;justify-content:space-between;align-items:center;margin-top:22px}.finder-nav button{border:0;background:none;color:var(--navy);font-weight:600;cursor:pointer;padding:0}.hidden{display:none!important}
.result{margin-top:26px;border:1px solid var(--line);background:#fff}.result-top{display:grid;grid-template-columns:.84fr 1.16fr}.result-visual{min-height:390px;background:linear-gradient(145deg,#F4FBFC,#fff);position:relative;display:grid;place-items:center;padding:34px;text-align:center}.result-visual .placeholder{width:76%;height:66%;border:1px dashed #C4CFD7;background:rgba(255,255,255,.7);display:grid;place-items:center;padding:20px}.result-visual b{font-size:19px;color:var(--navy)}.result-visual span{font-size:10.5px;color:var(--muted);display:block;margin-top:6px}.result-copy{padding:38px 40px}.result-line{font-size:10px;font-weight:700;letter-spacing:.14em;color:var(--cyan-dark);text-transform:uppercase}.result h3{font-size:39px;margin-top:8px}.why{font-size:15px;line-height:1.65;color:#4D5864;margin-top:14px}.benefits{margin:22px 0;display:grid;gap:0;border-top:1px solid var(--line)}.benefit{font-size:12.5px;color:#4F5963;border-bottom:1px solid var(--line);padding:11px 0}.price-row{display:flex;align-items:end;justify-content:space-between;gap:18px;flex-wrap:wrap;padding-top:2px}.price{font-size:24px;font-weight:700;color:var(--navy)}.price small{display:block;font-size:9.5px;font-weight:400;color:var(--muted)}.warranty{font-size:11.5px;color:var(--navy);font-weight:600}.result-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}.family-note{font-size:10.5px;color:var(--muted);margin-top:13px;line-height:1.55}.alt{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;border-top:1px solid var(--line);padding:18px 22px;background:#FAFAFB}.alt b{font-size:12px;color:var(--navy)}.alt p{font-size:10.5px;margin-top:3px}.alt a{font-size:11px;font-weight:600;color:var(--navy)}
.video-proof{background:#111229;color:#fff}.video-proof h2{color:#fff}.video-grid{display:grid;grid-template-columns:1.03fr .97fr;gap:44px;align-items:center}.video-frame{min-height:350px;cursor:pointer;border:1px solid rgba(255,255,255,.14);background:linear-gradient(135deg,#1C1A43,#0A0B16);display:grid;place-items:center;text-align:center;padding:34px}.play{width:68px;height:68px;border-radius:50%;background:#fff;color:var(--navy);display:grid;place-items:center;font-size:23px;margin:auto}.video-frame b{display:block;margin-top:17px}.video-frame span{display:block;font-size:10.5px;color:rgba(255,255,255,.6);margin-top:5px}.video-copy p{color:rgba(255,255,255,.7);font-size:14px;line-height:1.75;margin-top:14px}.video-copy .calibration i{background:rgba(255,255,255,.4)}.video-copy .calibration i:nth-child(5n+1){background:#fff}.video-copy .calibration i.active{background:var(--cyan)}
.use-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.use-card{padding:26px 24px;border-right:1px solid var(--line)}.use-card:last-child{border-right:0}.use-card .no{font-size:10px;font-weight:700;color:var(--cyan-dark)}.use-card h3{font-size:20px;margin-top:22px}.use-card p{font-size:11.5px;line-height:1.6;margin-top:7px}
.lines{background:var(--soft)}.line-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.line-card{border-top:3px solid var(--navy);background:#fff;padding:26px 24px;min-height:230px}.line-card .eyebrow{color:var(--navy)}.line-card h3{margin-top:14px}.line-card p{font-size:11.5px;line-height:1.6;margin-top:8px}.line-card ul{padding-left:17px;margin:15px 0 0;color:var(--muted);font-size:11px}.line-card li+li{margin-top:5px}.line-card.cyan{border-top-color:var(--cyan)}
.postpurchase{background:#fff;border-top:1px solid var(--line)}.post-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:52px;align-items:center}.post-copy p{font-size:14px;line-height:1.75;margin-top:14px}.post-steps{display:grid;gap:0;border-top:1px solid var(--line);margin-top:24px}.post-step{display:grid;grid-template-columns:42px 1fr;gap:14px;border-bottom:1px solid var(--line);padding:13px 0}.post-step b{font-size:11px;color:var(--navy)}.post-step span{font-size:10.5px;color:var(--muted)}.qr-panel{min-height:330px;background:var(--navy);color:#fff;padding:34px;display:grid;place-items:center;text-align:center}.fakeqr{width:108px;height:108px;background:repeating-linear-gradient(45deg,#fff 0 5px,#12102D 5px 10px);border:8px solid #fff;margin:16px auto}.qr-panel b{font-size:14px}.qr-panel p{font-size:10.5px;color:rgba(255,255,255,.65);margin-top:6px}
.faq-list{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line);padding:18px 0}summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--navy)}details p{font-size:11.5px;line-height:1.65;margin-top:9px;max-width:800px}.brand-proof{background:var(--soft-cyan)}.brand-proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:end}.brand-facts{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #CFE7EC}.brand-fact{padding:20px 18px 18px 0;border-bottom:1px solid #CFE7EC}.brand-fact b{display:block;font-size:12px;color:var(--navy)}.brand-fact span{font-size:10.5px;color:var(--muted)}
.final{padding:86px 0;background:#fff}.final-box{background:var(--navy);color:#fff;padding:46px 48px;display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center}.final-box h2{color:#fff}.final-box p{font-size:13px;color:rgba(255,255,255,.68);margin-top:9px;max-width:700px}footer{background:#11131A;color:#AEB5BE;padding:25px 0;font-size:10px}footer .wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}.toast{position:fixed;left:50%;bottom:20px;z-index:100;transform:translate(-50%,18px);opacity:0;pointer-events:none;background:#11131a;color:#fff;padding:11px 16px;font-size:10.5px;transition:.18s}.toast.on{opacity:1;transform:translate(-50%,0)}
@media(max-width:940px){.hero-grid,.finder-layout,.result-top,.video-grid,.post-grid,.brand-proof-grid,.final-box{grid-template-columns:1fr}.finder-intro{position:static}.trust-grid{grid-template-columns:1fr 1fr}.trust-item:nth-child(2){border-right:0}.trust-item{border-bottom:1px solid var(--line)}.use-grid{grid-template-columns:1fr 1fr}.use-card:nth-child(2){border-right:0}.use-card{border-bottom:1px solid var(--line)}.line-grid{grid-template-columns:1fr}.final-box{padding:36px}}
@media(max-width:620px){.wrap{width:calc(100% - 28px)}.previewbar .wrap{min-height:34px}.previewbar span:last-child{display:none}.header .wrap{height:60px}.header-actions a:not(.help){display:none}.hero-grid{min-height:auto;padding:38px 0 40px;gap:26px}h1{font-size:40px}h2{font-size:32px}.hero-copy .lead{font-size:15px}.hero-actions .btn{width:100%}.hero-mini{display:none}.product-stage{min-height:290px}.asset-zone{inset:24px}.trust-grid{grid-template-columns:1fr}.trust-item{border-right:0}.section{padding:62px 0}.finder-box{padding:23px 16px}.answers{grid-template-columns:1fr}.question h3{font-size:24px}.result-copy{padding:25px 20px}.result h3{font-size:32px}.result-visual{min-height:270px}.result-actions .btn{width:100%}.alt{grid-template-columns:1fr}.use-grid{grid-template-columns:1fr}.use-card{border-right:0}.brand-facts{grid-template-columns:1fr}.final-box{padding:28px 20px}.final-box .btn{width:100%}}


/* BOARD CANDIDATE visual pass */
.product-stage{background:linear-gradient(145deg,#fff 0%,#f7fbfc 100%);box-shadow:none}
.product-stage:before{display:none}
.hero-product-img{position:absolute;inset:26px;width:calc(100% - 52px);height:calc(100% - 52px);object-fit:contain}
.result-product-img{width:100%;height:100%;object-fit:contain;padding:28px;background:linear-gradient(145deg,#fff,#f4fafb)}
.video-frame{position:relative;overflow:hidden;cursor:pointer;padding:0;min-height:390px;background:#111229}
.video-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.72)}
.video-overlay{position:relative;z-index:2;min-height:390px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:34px;text-align:center}
.video-overlay b{display:block;margin-top:17px;color:#fff}
.video-overlay span{display:block;font-size:10.5px;color:rgba(255,255,255,.72);margin-top:5px}
.use-card{padding:0 22px 24px;overflow:hidden}
.use-photo{width:calc(100% + 44px);height:180px;object-fit:cover;margin:0 -22px 22px}
.line-card{padding-top:0;overflow:hidden}
.line-product{width:100%;height:180px;object-fit:contain;background:#fff;margin-bottom:8px}
.family-note{font-size:10.5px;line-height:1.55;color:#65707a;margin-top:12px}
@media(max-width:620px){
  .hero-product-img{inset:14px;width:calc(100% - 28px);height:calc(100% - 28px)}
  .use-photo{height:150px}
  .line-product{height:160px}
  .video-frame,.video-overlay{min-height:280px}
}


/* v11.2.1 START TUTAJ photo replacement */
.qr-panel{
  padding:0 !important;
  overflow:hidden;
  background:#fff !important;
  min-height:0 !important;
  align-items:stretch !important;
  justify-content:stretch !important;
}
.qr-panel>div{display:none !important}
.start-tutaj-photo{
  display:block;
  width:100%;
  height:100%;
  min-height:520px;
  object-fit:cover;
  object-position:center;
}
@media(max-width:900px){
  .start-tutaj-photo{min-height:420px}
}
@media(max-width:620px){
  .start-tutaj-photo{min-height:300px}
}


/* v11.3 COPY LOCK */
.benefit{display:flex!important;flex-direction:column;gap:4px}
.benefit b{font-size:12px;line-height:1.3;color:var(--navy)}
.benefit span{font-size:10.5px;line-height:1.5;color:#68717d}


/* v14.2 ASSET FIX: product renders are preloaded as static DOM assets */
.asset-option{display:none!important}
.asset-option.active{display:block!important}
.heroProductStack{position:absolute;inset:0}
.heroProductStack .hero-product-img{position:absolute}
.resultProductStack{width:100%;height:100%;display:grid;place-items:center}
.resultProductStack .result-product-img{width:100%;height:100%;object-fit:contain}

.sticky-cta{display:none}@media(max-width:760px){.sticky-cta{display:block;position:fixed;left:16px;right:16px;bottom:14px;z-index:50;background:var(--navy);color:#fff;text-align:center;font-weight:600;font-size:15px;padding:16px;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.18);transform:translateY(140%);transition:transform .25s}.sticky-cta.on{transform:none}}
/* v14.3 — wybór po funkcjach */
.lines{background:var(--soft)}
.lines .line-card{display:flex;flex-direction:column;padding:0 24px 26px;overflow:hidden;min-height:0}
.line-photo{width:calc(100% + 48px);height:210px;object-fit:contain;background:linear-gradient(145deg,#F4FBFC,#fff);margin:0 -24px 22px;padding:14px}
.line-card p b{color:var(--navy)}
.line-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:20px}
.line-actions .btn{min-height:44px;padding:10px 14px;font-size:12px}
@media(max-width:940px){.lines .line-grid{grid-template-columns:1fr}}
@media(max-width:620px){.line-actions .btn{width:100%}.line-photo{height:180px}}

/* v14.4 — większe zdjęcie modelu w wyniku doboru */
.result-visual{padding:18px;align-items:center}
.resultProductStack{height:auto;align-self:center}
.resultProductStack .result-product-img{width:100%;height:auto;max-height:360px;padding:0;background:none}
@media(max-width:620px){.resultProductStack .result-product-img{max-height:240px}}
@media(min-width:941px){.result-top{grid-template-columns:1fr 1fr}.result-visual{padding:10px}}

/* ===== v15.css ===== */
/* ŁUCZNIK LANDING 15.0 — warstwa nadrzędna nad styles.css */
body{font-size:15px}
p{color:#545e69}
.eyebrow{font-size:11px}
h1{font-size:clamp(44px,5.4vw,72px)}
.wrap.narrow{max-width:900px}
.section-head p{font-size:15.5px;color:#545e69}
.textlink{font-size:inherit}

/* pasek wersji */
.previewbar a{color:#7BE2F2;text-decoration:underline}
.bar-btn{background:none;border:1px solid #4b5563;color:#dfe3e8;font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;cursor:pointer}
.head-row{display:flex;align-items:center;justify-content:space-between}
.head-link{font-size:13px;font-weight:600;color:var(--navy)}

/* przyciski */
.btn{font-size:14px;min-height:54px;padding:15px 26px;border-radius:3px}
.btn.ghost{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn.ghost:hover{background:var(--soft-cyan)}

/* HERO */
.hero{background:linear-gradient(115deg,#fff 0%,#fff 48%,#EAF7FA 100%)}
.hero-grid{grid-template-columns:1fr 1.05fr;gap:48px;min-height:auto;padding:56px 0 64px}
.hero-copy .lead{font-size:18px;color:#3f4954}
.hero-hint{font-size:13px;color:#6D7680;margin-top:14px}
.hero-visual{display:block;min-height:0}
.hero-frame{position:relative;border:2px dashed #8FD9E8;background:repeating-linear-gradient(135deg,#F3FBFD 0 14px,#EAF7FA 14px 28px);aspect-ratio:16/11;min-height:420px;overflow:hidden}
.hero-brief{position:absolute;left:16px;top:16px;width:46%;background:rgba(255,255,255,.92);padding:14px 16px;border:1px solid #CFEFF6;z-index:2}
.hero-brief p{font-size:12px;line-height:1.55;color:#3f4954;margin-top:8px}
.hero-product{position:absolute;right:3%;bottom:6%;width:58%;aspect-ratio:3/2;display:grid;place-items:center}
.hero-product .heroProductStack{width:100%;height:100%;display:grid;place-items:center}
.hero-product .hero-product-img{width:100%;height:auto;mix-blend-mode:multiply}
.product-slot-label{position:absolute;top:-6px;right:0;background:rgba(255,255,255,.9);padding:2px 6px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#008AA8;font-weight:700}
.colors{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px}
.colors-label{font-size:13px;color:#3f4954;margin-right:4px}
.chip{border:1px solid #CFD5DC;background:#fff;color:var(--navy);font-size:13px;font-weight:600;padding:8px 14px;border-radius:99px;cursor:pointer}
.chip.on{border-color:var(--navy);background:var(--navy);color:#fff}
.color-brief{position:absolute;inset:0;background:rgba(255,255,255,.95);border:1px dashed #8FD9E8;padding:16px;font-size:12.5px;line-height:1.55;color:#3f4954;display:flex;flex-direction:column;justify-content:center}
.color-brief b{color:var(--navy);font-size:13px}

/* pas zaufania */
.trust-item b{font-size:15px}
.trust-item span{font-size:12.5px}

/* OPIS BRAKUJĄCEGO ZDJĘCIA */
.brief{margin:0;position:relative;border:2px dashed #8FD9E8;background:repeating-linear-gradient(135deg,#F6FCFD 0 14px,#EEF9FB 14px 28px);padding:16px 18px;display:flex;flex-direction:column;gap:6px;color:#3f4954}
.brief.r43{aspect-ratio:4/3}.brief.r169{aspect-ratio:16/9}.brief.r32{aspect-ratio:3/2}.brief.r11{aspect-ratio:1/1}
.brief-head{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.brief-head b{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:#fff;background:var(--navy);padding:3px 7px;letter-spacing:.04em}
.brief-tag{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#008AA8}
.brief-title{font-size:14px;font-weight:600;color:var(--navy);margin-top:2px}
.brief dl{margin:2px 0 0;display:grid;grid-template-columns:auto 1fr;gap:3px 10px;font-size:11.5px;line-height:1.45}
.brief dt{font-weight:700;color:var(--navy)}
.brief dd{margin:0}
.brief-rule{font-size:11.5px;line-height:1.45;color:#9a3412;background:#FFF7ED;border-left:3px solid #F97316;padding:5px 8px;margin-top:2px}
.brief-more{font-size:11.5px}
.brief-more summary{cursor:pointer;color:#008AA8;font-weight:600}
.brief-more p{font-size:11.5px;margin-top:4px;color:#3f4954}
.brief-more dl{margin-top:4px}
.hero-brief .brief-head b{font-size:11px}
body.briefs-off .brief dl,body.briefs-off .brief-rule,body.briefs-off .brief-more,body.briefs-off .hero-brief,body.briefs-off .brief-title,body.briefs-off .m-missing{display:none}
body.briefs-off .brief{justify-content:center;align-items:center}

/* EFEKTY */
.effects{background:#fff}
.fx-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.fx h3{font-size:20px;margin-top:16px}
.fx p{font-size:14px;margin-top:6px}

/* DOBÓR */
.finder-sub{font-size:16px;margin-top:14px;max-width:420px}
.answer b{font-size:16px}
.answer span{font-size:13px}
.why{font-size:15.5px}
.benefit b{font-size:14px!important}
.benefit span{font-size:13px!important}
.family-note{font-size:12.5px!important}

/* PORÓWNANIE */
.compare{background:var(--soft)}
.m-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:stretch}
.m-col{background:#fff;border-top:4px solid var(--navy);padding:22px 20px 22px;display:flex;flex-direction:column}
.m-col.start{border-top-color:var(--cyan)}
.m-col.start:first-child{box-shadow:0 18px 40px rgba(38,34,97,.10)}
.m-label{font-size:10.5px;font-weight:700;letter-spacing:.12em;color:#008AA8}
.m-col.creative .m-label,.m-col.master .m-label{color:var(--navy)}
.m-img{width:100%;aspect-ratio:3/2;object-fit:contain;margin:14px 0 6px;mix-blend-mode:multiply}
.m-col h3{font-size:21px}
.m-models{font-size:13px;color:var(--navy);font-weight:600;margin-top:6px}
.m-col ul{padding-left:18px;margin:12px 0 0;font-size:13.5px;color:#4b5563;line-height:1.5}
.m-col li+li{margin-top:6px}
.m-price{font-size:22px;font-weight:700;color:var(--navy);margin-top:auto;padding-top:16px}
.m-actions{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.m-actions .btn{min-height:46px;font-size:13px;padding:10px 14px}
.m-missing{margin-top:12px;display:flex;flex-direction:column;gap:4px}
.m-miss{font-size:11px;color:#008AA8;font-family:ui-monospace,Menlo,Consolas,monospace}
.m-note{font-size:14px;margin-top:20px;color:#545e69}

/* Z BLISKA */
.closeup{background:#11131a}
.closeup h2{color:#fff}.closeup .section-head p{color:#c7cdd4}.closeup .eyebrow{color:#7BE2F2}
.cu-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.brief.r219{aspect-ratio:21/9}
.closeup .brief{background:repeating-linear-gradient(135deg,#1b1f2b 0 14px,#171a24 14px 28px);border-color:#2f6f80;color:#c7cdd4}
.closeup .brief-title,.closeup .brief dt{color:#fff}
.closeup .brief-head b{background:#00B8DE;color:#11131a}
.closeup .brief-rule{background:#2a1d14;color:#fdba74}

/* PUDEŁKO */
.box-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.lead-s{font-size:16px;line-height:1.65;margin-top:14px}
.steps{list-style:none;counter-reset:s;padding:0;margin:24px 0 0;border-top:1px solid var(--line)}
.steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;gap:2px 10px;padding:14px 0;border-bottom:1px solid var(--line)}
.steps li:before{content:"0" counter(s);grid-row:span 2;font-weight:700;color:#008AA8;font-size:14px}
.steps b{color:var(--navy);font-size:16px}
.steps span{font-size:14px;color:#545e69}

/* OPINIE */
.reviews{background:var(--soft-cyan)}
.rv-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:center}
.rv-list{display:grid;gap:12px}
.rv-list blockquote{margin:0;background:#fff;padding:18px 20px;font-size:15px;color:var(--navy);font-weight:500;line-height:1.5}
.rv-list cite{display:block;font-style:normal;font-size:12.5px;color:#6D7680;margin-top:6px;font-weight:400}

/* PYTANIA */
.faq-list summary{font-size:15px}
.faq-list p{font-size:14.5px}

/* telefon / tablet */
@media(max-width:1100px){.m-grid,.fx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cu-row{grid-template-columns:minmax(0,1fr)}}
@media(max-width:940px){
 .hero-grid,.box-grid,.rv-grid{grid-template-columns:minmax(0,1fr)}
 .hero-frame{aspect-ratio:auto;min-height:0;padding:14px;display:flex;flex-direction:column;gap:18px}
 .hero-brief{position:static;width:auto}
 .hero-product{position:relative;right:auto;bottom:auto;width:100%;margin-top:14px}
}
@media(max-width:620px){
 h1{font-size:38px}
 .hero-copy .lead{font-size:16px}
 .hero-actions .btn{width:100%}
 .m-grid,.fx-grid{grid-template-columns:minmax(0,1fr)}
 .brief.r219{aspect-ratio:auto;min-height:220px}
 .brief.r43,.brief.r169,.brief.r32,.brief.r11{aspect-ratio:auto;min-height:220px}
 .previewbar span:last-child{display:inline;font-size:9px}
 .previewbar .wrap{flex-direction:column;align-items:flex-start;padding:6px 0}
 .head-link{display:none}
}

/* 15.1 — „Co chcesz uszyć?” w zdjęciu głównym */
.need-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:26px}
.need-chip{flex-direction:column;align-items:flex-start;gap:2px;background:#fff;border:1.5px solid #CFD5DC;color:var(--navy);text-align:left;min-height:68px;padding:12px 16px}
.need-chip b{font-size:16px}
.need-chip span{font-size:12.5px;font-weight:400;color:#6D7680}
.need-chip:hover{border-color:var(--navy);background:var(--soft-cyan)}
.need-chip:after{content:"→";position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--cyan-dark);font-weight:700}
.need-chip{position:relative;padding-right:34px}
.hero-hint{font-size:14px;margin-top:16px}
@media(max-width:620px){.need-grid{grid-template-columns:minmax(0,1fr)}.need-chip{min-height:58px}}

/* 15.3 — ścieżka 2: dobór po parametrach */
.pw-box{background:#fff;border:1px solid var(--line);padding:30px 34px;box-shadow:0 18px 40px rgba(38,34,97,.06)}
.pw-q h3{font-size:26px;margin:22px 0 16px}
.pw-nav{display:flex;gap:10px;margin-top:14px}
.pw-nav button{background:none;border:0;color:var(--navy);font-weight:600;cursor:pointer;font-size:13px;padding:6px 0}
.pw-result{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:30px;margin-top:22px;align-items:center}
.pw-img{background:linear-gradient(145deg,#F4FBFC,#fff);padding:18px;display:grid;place-items:center}
.pw-img img{width:100%;height:auto;max-height:340px;object-fit:contain;mix-blend-mode:multiply}
.pw-copy h3{font-size:36px;margin-top:6px}
.pw-copy .m-price{margin-top:6px;padding-top:8px}
.h3big{font-size:28px}
@media(max-width:760px){.pw-box{padding:22px 16px}.pw-result{grid-template-columns:minmax(0,1fr)}.pw-copy h3{font-size:30px}.pw-q h3{font-size:22px}.pw-copy .btn{width:100%}}

/* ===== v16.css ===== */
/* ŁUCZNIK LANDING 16.0 — wygląd według identyfikacji „Tradycja napędza precyzję”
   Biel jako baza · granat #262261 prowadzi · cyan #00B8DE jako jeden punkt · Poppins Regular/SemiBold · podziałka */
:root{--navy:#262261;--cyan:#00B8DE;--ink:#262261;--text:#59616c;--muted:#7a818b;--line:#E5E7EB;--soft:#F5F6F7;--soft-cyan:#F5F6F7}
body{color:var(--text);background:#fff}
p{color:var(--text)}
h1,h2,h3{color:var(--navy);font-weight:600}
h1{font-size:clamp(46px,5.2vw,74px);line-height:1.02;letter-spacing:-.03em}
h2{font-size:clamp(32px,3.6vw,48px);line-height:1.08;letter-spacing:-.025em}
h3{letter-spacing:-.015em}

/* podpisy sekcji: „02 / CO CHCESZ USZYĆ?” — szary, rozstrzelony; numer w granacie */
.eyebrow{color:#6b727c;font-weight:500;font-size:11px;letter-spacing:.18em}
.eyebrow .no{color:var(--navy);font-weight:600;margin-right:2px}
.section-head{max-width:820px}

/* nagłówek strony */
.header{background:#fff;border-bottom:1px solid var(--line)}
.head-link{font-weight:500}

/* HERO: biel, bez gradientów */
.hero{background:#fff}
.hero-copy .lead{color:var(--text)}

/* PODZIAŁKA wg księgi identyfikacji: stały odstęp, rytm długa–krótka–krótka,
   kreski wyśrodkowane w pionie, jeden dłuższy i grubszy cyanowy wskaźnik zajmuje miejsce kreski */
.scale{--g:20px;--n:15;position:relative;height:34px;width:calc(var(--g) * (var(--n) - 1));max-width:100%;margin:28px 0 0}
.scale .ticks{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center}
.scale .ticks i{display:block;flex:none;width:1.5px;height:11px;background:var(--navy)}
.scale .ticks i.M{height:17px}
.scale .ticks i.off{visibility:hidden}
.scale .ind{position:absolute;top:50%;width:3px;height:34px;background:var(--cyan);transform:translate(-50%,-50%);transition:left .7s cubic-bezier(.2,.8,.2,1)}
.scale.sm{--g:13px;height:22px;margin:0}
.scale.sm .ticks i{height:7px}
.scale.sm .ticks i.M{height:11px}
.scale.sm .ind{height:22px;width:2.5px}
.scale.light .ticks i{background:#fff;opacity:.55}
@media(prefers-reduced-motion:reduce){.scale .ind{transition:none}}
/* stary pasek postępu zastępujemy podziałką */
.progress{display:none}
.step-scale{margin:14px 0 6px}
.calibration{display:none}

/* przyciski: granat, prosto */
.btn{border-radius:2px;font-weight:600}
.btn.primary{background:var(--navy)}
.btn.secondary,.btn.ghost{background:#fff;color:var(--navy);border:1px solid var(--navy)}
.btn.secondary:hover,.btn.ghost:hover{background:var(--soft)}
.textlink{color:var(--navy);border-bottom:1px solid var(--navy)}
.textlink:hover{color:var(--navy);border-bottom-color:var(--cyan)}

/* „Co chcesz uszyć?” w hero — kafle z cienką linią u góry jak kolumny w identyfikacji */
.need-chip{border:1px solid var(--line);border-top:2px solid var(--navy);border-radius:0;background:#fff}
.need-chip:hover{background:#fff;border-color:var(--line);border-top-color:var(--cyan)}
.need-chip:after{color:var(--navy)}

/* pas zaufania */
.trust{border-color:var(--line)}
.trust-item{border-top:2px solid var(--navy)}
.trust-item b{color:var(--navy);font-weight:600}

/* odpowiedzi w doborach */
.answer{border:1px solid var(--line);border-radius:0;background:#fff;transition:border-color .15s}
.answer:hover{border-color:var(--navy)}
.answer.selected{border-color:var(--navy);box-shadow:inset 3px 0 0 var(--cyan)}
.answer b{color:var(--navy);font-weight:600}
.finder{background:var(--soft)}
.finder-box,.pw-box{border:0;border-top:2px solid var(--navy);box-shadow:none;border-radius:0}
.step-label,#pwStep{color:var(--muted)}
.result{border:1px solid var(--line);border-top:2px solid var(--navy)}
.result-line,.pw-copy .result-line{color:#6b727c;letter-spacing:.16em;font-weight:500}
.result-visual,.pw-img{background:var(--soft)}
.benefits{border-top:1px solid var(--line)}
.alt{background:var(--soft)}

/* porównanie modeli: kolumny z linią u góry; cyan tylko jako wskaźnik przy START */
.compare{background:#fff}
.m-col{border-top:2px solid var(--navy);box-shadow:none!important;background:#fff;position:relative;padding-left:0;padding-right:0}
.m-col.start,.m-col.creative,.m-col.master{border-top-color:var(--navy)}
.m-col.start:before{content:"";position:absolute;left:0;top:-8px;width:3px;height:14px;background:var(--cyan)}
.m-label{color:#6b727c;font-weight:500;letter-spacing:.14em}
.m-col.creative .m-label,.m-col.master .m-label{color:#6b727c}
.m-img{background:var(--soft);padding:10px}
.m-col ul{color:var(--text)}
.m-col .m-actions .btn{border-color:var(--navy)}
.m-note{color:var(--muted)}

/* efekty */
.effects{background:#fff}
.fx h3{font-weight:600}

/* Z BLISKA — jasne tło zamiast ciemnego */
.closeup{background:var(--soft)}
.closeup h2{color:var(--navy)}.closeup .section-head p{color:var(--text)}.closeup .eyebrow{color:#6b727c}

/* pudełko i kroki */
.steps{border-top:2px solid var(--navy)}
.steps li:before{color:var(--navy)}
.steps li:first-child:before{color:var(--cyan)}

/* opinie */
.reviews{background:var(--soft)}
.rv-list blockquote{border-top:2px solid var(--navy);font-weight:500}

/* pytania */
.faq-list details{border-color:var(--line)}
.faq-list summary{color:var(--navy);font-weight:500}

/* zakończenie: granat prowadzi */
.final-box{background:var(--navy);border-radius:0}
.final-box h2{color:#fff}
.final-box p{color:#c9cbe0}
.final .eyebrow{color:#c9cbe0!important}

/* stopka z warstwą historii */
footer{background:#fff;color:var(--muted);border-top:1px solid var(--line)}
footer span{color:var(--muted)}

/* OPISY BRAKUJĄCYCH ZDJĘĆ — warstwa robocza: neutralna szarość, żeby cyan został jedynym akcentem marki */
.brief,.hero-frame{border:1.5px dashed #b8bec6;background:repeating-linear-gradient(135deg,#F7F8F9 0 14px,#F1F3F5 14px 28px)}
.brief-head b{background:var(--navy);color:#fff}
.brief-tag{color:#6b727c}
.brief-more summary{color:var(--navy)}
.closeup .brief{background:repeating-linear-gradient(135deg,#F7F8F9 0 14px,#EEF0F2 14px 28px);border-color:#b8bec6;color:var(--text)}
.closeup .brief-title,.closeup .brief dt{color:var(--navy)}
.closeup .brief-head b{background:var(--navy);color:#fff}
.closeup .brief-rule{background:#FFF7ED;color:#9a3412}
.product-slot-label{color:var(--navy);border:1px solid var(--line)}
.m-miss{color:#6b727c}
.chip.on{background:var(--navy);border-color:var(--navy)}

/* pasek wersji */
.previewbar{background:#1b1d24}
.previewbar a{color:#9fe6f5}

.hero-brief{border:1px solid var(--line)}
.color-brief{border-color:#b8bec6}

/* ===== v17.css ===== */
/* ŁUCZNIK LANDING 17.0 — elementy wyglądu z wersji 9.9 (miękkie karty, pigułki, granatowa sekcja po zakupie)
   połączone z identyfikacją: granat prowadzi, cyan jako jeden punkt, podziałka, numerowane sekcje */
:root{--r-card:24px;--r-tile:16px;--shadow:0 22px 60px rgba(38,34,97,.08);--shadow-sm:0 10px 28px rgba(38,34,97,.06)}

/* przyciski i linki-przyciski: pigułki */
.btn{border-radius:999px;min-height:50px;padding:13px 24px}
.btn.secondary,.btn.ghost{border-color:#D8DDE4}
.btn.secondary:hover,.btn.ghost:hover{border-color:var(--navy);background:#fff}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-size:13px;font-weight:600;color:var(--navy);border-bottom:1px solid var(--navy);cursor:pointer}
.linkbtn:hover{border-bottom-color:var(--cyan)}
.save-link{margin-top:14px}

/* nagłówek: kotwice + pigułka */
.header .wrap{height:72px}
.head-nav{display:flex;align-items:center;gap:26px}
.head-nav a:not(.btn){font-size:12.5px;color:#626A75}
.head-nav a:not(.btn):hover{color:var(--navy)}
.head-cta{min-height:42px;padding:10px 18px;font-size:12.5px}
@media(max-width:900px){.head-nav a:not(.btn){display:none}.head-cta{min-height:38px;padding:8px 14px;font-size:11.5px}}

/* hero: miękka rama, etykieta jako pigułka, fakty jako pigułki */
.hero{background:linear-gradient(110deg,#fff 0%,#fff 55%,#F3F8FB 100%)}
.hero-frame{border-radius:28px;border:1px solid var(--line)!important;box-shadow:var(--shadow);background:repeating-linear-gradient(135deg,#F8F9FA 0 14px,#F2F4F6 14px 28px)!important}
.hero-brief{border-radius:18px;box-shadow:var(--shadow-sm)}
.product-slot-label{top:auto;bottom:10px;right:auto;left:0;border-radius:999px;padding:6px 12px;font-size:10px;letter-spacing:.04em;text-transform:none;font-weight:700;background:#fff;box-shadow:var(--shadow-sm);border:0}
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.facts span{font-size:12px;font-weight:600;color:var(--navy);background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 12px}
.need-chip{border-radius:var(--r-tile);border:1px solid var(--line);border-top:1px solid var(--line);box-shadow:var(--shadow-sm)}
.need-chip:hover{border-color:var(--navy);border-top-color:var(--navy);transform:translateY(-1px)}
.need-chip.on{border-color:var(--navy);box-shadow:inset 3px 0 0 var(--cyan),var(--shadow-sm)}

/* pas zaufania: miękkie kafle */
.trust{background:var(--soft);border:0}
.trust-grid{gap:12px;padding:18px 0}
.trust-item{background:#fff;border:1px solid var(--line);border-top:1px solid var(--line);border-radius:var(--r-tile);padding:16px 18px}

/* karty: dobory, wynik, kolumny, efekty, opinie */
.finder-box,.pw-box{border-radius:var(--r-card);border:1px solid var(--line);border-top:1px solid var(--line);box-shadow:var(--shadow);background:#fff}
.answer{border-radius:var(--r-tile)}
.answer.selected{box-shadow:inset 3px 0 0 var(--cyan)}
.result{border-radius:20px;border:1px solid var(--line);overflow:hidden}
.result-visual,.pw-img{border-radius:18px}
.alt,.pw-alt{border-radius:0 0 20px 20px}
.pw-alt{grid-column:1/-1;border-radius:16px;margin-top:6px}
.pw-result{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
.m-col{border-radius:var(--r-card);border:1px solid var(--line);border-top:1px solid var(--line);padding:22px!important;box-shadow:var(--shadow-sm)!important}
.m-col.start:before{left:22px;top:-1px;width:28px;height:3px;border-radius:0 0 3px 3px}
.m-img{border-radius:var(--r-tile)}
.m-proj{font-size:13px;color:var(--navy);background:var(--soft);border-radius:12px;padding:8px 12px;margin-top:10px}
.fx .brief,.brief{border-radius:20px}
.rv-list blockquote{border-radius:var(--r-tile);border:1px solid var(--line);border-top:1px solid var(--line);box-shadow:var(--shadow-sm)}
.rv-list .rv-later{background:transparent;border-style:dashed;box-shadow:none;color:#6b727c}
.faq-list details{border-radius:14px;border:1px solid var(--line);padding:4px 18px;margin-bottom:10px;background:#fff}
.faq-list details[open]{box-shadow:var(--shadow-sm)}

/* PO ZAKUPIE — granatowa sekcja z półprzezroczystymi krokami (jak 9.9) */
.box{background:var(--navy);color:#fff}
.box h2{color:#fff}
.box .eyebrow,.box .eyebrow .no{color:#9fe6f5}
.box .lead-s{color:rgba(255,255,255,.75)}
.box .steps{border:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.box .steps li{display:block;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);border-radius:14px;padding:16px 18px}
.box .steps li:before{display:block;color:#9fe6f5;font-size:11px;margin-bottom:6px}
.box .steps b{color:#fff;font-size:15px;display:block}
.box .steps span{color:rgba(255,255,255,.68);font-size:13px;display:block;margin-top:4px}
.box .brief{background:#fff;border:0;box-shadow:0 30px 70px rgba(0,0,0,.25)}

/* zakończenie: biała karta na jasnym tle */
.final{background:var(--soft);padding:80px 0}
.final-box{background:#fff;border-radius:28px;box-shadow:var(--shadow);border:1px solid var(--line)}
.final-box h2{color:var(--navy)}
.final-box p{color:var(--text)}
.final .eyebrow{color:#6b727c!important}
.final-box .btn.primary{background:var(--navy)!important;color:#fff!important}
.final .scale.light .ticks i{background:var(--navy);opacity:.9}

/* sekcja „Z bliska” i porównanie: miękkie tła */
.closeup .brief{border-radius:20px}

/* stopka ciemna jak w 9.9 */
footer{background:#14151c;border:0}
footer span{color:#a9aeb7}

/* okno „Wyślij mi ten wynik” */
.save-dlg{position:fixed;inset:0;background:rgba(20,21,28,.45);display:none;align-items:center;justify-content:center;z-index:100;padding:16px}
.save-dlg.on{display:flex}
.save-box{background:#fff;border-radius:24px;max-width:440px;width:100%;padding:26px;box-shadow:var(--shadow)}
.save-box h3{font-size:22px}
.save-box p{font-size:13.5px;margin-top:6px}
.save-box input[type=email]{width:100%;margin-top:16px;border:1px solid #D8DDE4;border-radius:12px;padding:13px 14px;font:inherit;font-size:15px}
.save-box label{display:flex;gap:10px;align-items:flex-start;font-size:12px;color:var(--text);margin-top:12px;line-height:1.45}
.save-box .row{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}

@media(max-width:760px){
 .box .steps{grid-template-columns:minmax(0,1fr)}
 .trust-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .final-box{border-radius:22px}
}
@media(max-width:620px){.trust-grid{grid-template-columns:minmax(0,1fr)}}

.faq-list summary{padding:14px 0}

/* 17.1 — rodzina START jak w 9.9: szeroka karta, kafle wersji */
.fam-list{display:grid;gap:18px}
.fam{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:34px;align-items:center;background:#fff;border-radius:28px;padding:44px 40px;box-shadow:var(--shadow)}
.fam.soft{background:linear-gradient(110deg,#F3F9FB 0%,#fff 55%)}
.fam .eyebrow{color:#6b727c}
.fam-h{font-size:clamp(28px,3vw,40px);line-height:1.05;letter-spacing:-.025em;margin-top:10px}
.fam p{font-size:15px;line-height:1.65;margin-top:14px}
.fam .facts span{background:var(--soft);border:0}
.fam-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:22px}
.fam-row .m-price{margin:0;padding:0}
.fam-tiles{display:grid;gap:12px}
.fam-tiles.t4{grid-template-columns:repeat(4,minmax(0,1fr))}
.fam-tiles.t3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tile{margin:0;background:#fff;border-radius:18px;padding:10px 10px 12px;box-shadow:var(--shadow-sm);text-align:center;transition:transform .18s,box-shadow .18s}
.tile:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.tile img{width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;border-radius:12px;mix-blend-mode:multiply}
.tile-brief{aspect-ratio:1/1;border-radius:12px;border:1.5px dashed #b8bec6;background:repeating-linear-gradient(135deg,#F8F9FA 0 10px,#F1F3F5 10px 20px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px}
.tile-brief b{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;background:var(--navy);color:#fff;padding:2px 6px}
.tile-brief span{font-size:10.5px;color:#6b727c;line-height:1.3}
.tile figcaption{font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--navy);margin-top:10px}
.tile figcaption small{display:block;font-weight:400;letter-spacing:0;color:#6b727c;margin-top:3px;font-size:11px}
.m-grid.m2{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:18px}
body.briefs-off .tile-brief span{display:none}

/* mniej obramowań, więcej głębi (cień zamiast ramki na kartach statycznych) */
.trust-item,.m-col,.rv-list blockquote:not(.rv-later),.finder-box,.pw-box{border-color:transparent!important}
.m-col{transition:transform .18s,box-shadow .18s}
.m-col:hover{transform:translateY(-2px);box-shadow:var(--shadow)!important}

@media(max-width:1000px){.fam{grid-template-columns:minmax(0,1fr);padding:30px 24px}}
@media(max-width:620px){
 .fam-tiles.t4{grid-template-columns:repeat(2,minmax(0,1fr))}
 .fam-tiles.t3{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 .fam-tiles.t3 .tile{padding:6px 6px 8px}
 .m-grid.m2{grid-template-columns:minmax(0,1fr)}
 .fam-row .btn{width:100%}
}

/* ===== v18.css ===== */
/* 18.0 — rolki, kampania modelowa, Omnibus, stopka prawna, przełączniki testów */
.omnibus{font-size:11.5px;color:#6b727c;margin-top:4px}

/* kampania na konkretny model */
.model-fit{background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:20px 22px;margin-top:22px}
.mf-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.mf-cols b{color:var(--navy);font-size:13.5px}
.mf-cols ul{list-style:none;padding:0;margin:8px 0 0}
.mf-cols li{font-size:13.5px;line-height:1.45;padding:4px 0 4px 22px;position:relative;color:var(--text)}
.mf-cols li.ok:before{content:"✓";position:absolute;left:0;color:var(--navy);font-weight:700}
.mf-cols li.no:before{content:"→";position:absolute;left:0;color:#6b727c}
.mf-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:16px}
.mf-row .m-price{margin:0;padding:0}
body.model-campaign .need-grid{margin-top:16px}

/* rolki 9:16 — przewijane w poziomie, jak w serwisach społecznościowych */
.reels{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,260px);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 4px 18px;margin:0 -4px;scrollbar-width:thin}
.reel{margin:0;scroll-snap-align:start}
.reel-media{position:relative;aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:repeating-linear-gradient(135deg,#F7F8F9 0 14px,#EEF0F2 14px 28px);border:1.5px dashed #b8bec6;box-shadow:var(--shadow-sm)}
.reel.has-poster .reel-media{border:0}
.reel-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reel.has-poster .reel-brief{display:none}
.reel-brief{position:absolute;inset:0;padding:16px 14px;display:flex;flex-direction:column;gap:6px;overflow:auto}
.reel-brief b{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11px;background:var(--navy);color:#fff;padding:3px 7px;align-self:flex-start}
.reel-brief p{font-size:12px;line-height:1.45;color:var(--text)}
.reel-brief .brief-rule{font-size:11px}
.reel-brief dl{display:grid;grid-template-columns:auto 1fr;gap:3px 8px;font-size:11px;margin:4px 0 0}
.reel-brief dt{font-weight:700;color:var(--navy)}
.reel-brief dd{margin:0}
.reel-play{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);width:58px;height:58px;border-radius:50%;border:0;background:#fff;color:var(--navy);font-size:20px;box-shadow:0 10px 30px rgba(0,0,0,.18);cursor:pointer}
.reel-play:hover{transform:translateX(-50%) scale(1.05)}
.reel figcaption{font-size:14px;font-weight:600;color:var(--navy);margin-top:12px}
.reels-nav{display:flex;gap:18px;justify-content:flex-end;margin-top:6px}
.reels-nav .linkbtn{font-size:18px;border:1px solid #D8DDE4;border-radius:999px;width:44px;height:44px;background:#fff}
body.briefs-off .reel-brief p,body.briefs-off .reel-brief details{display:none}
.reel-dlg{position:fixed;inset:0;background:rgba(10,11,16,.82);display:none;align-items:center;justify-content:center;z-index:120;padding:16px}
.reel-dlg.on{display:flex}
.reel-box{position:relative;height:min(86vh,760px);aspect-ratio:9/16;max-width:94vw}
.reel-box video{width:100%;height:100%;border-radius:22px;background:#000;object-fit:cover}
.reel-x{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;border:0;background:#fff;font-size:22px;cursor:pointer;z-index:2}
.closeup .cu-row{margin-top:26px}

/* test: wynik bez alternatywy */
body.ab-noalt #result .alt,body.ab-noalt .pw-alt{display:none}

/* stopka z wymogami prawnymi */
footer .foot{display:block;padding:28px 0}
.foot-legal{display:flex;flex-wrap:wrap;gap:8px 22px}
.foot-legal a{color:#d6d9df;font-size:12.5px;text-decoration:underline;text-underline-offset:3px}
.foot-seller{font-size:12px;color:#a9aeb7;margin-top:12px}
.foot-ver{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:11.5px;color:#7c818b;margin-top:14px}

@media(max-width:620px){
 .mf-cols{grid-template-columns:minmax(0,1fr)}
 .mf-row .btn{width:100%}
 .reels{grid-auto-columns:72%}
 .reels-nav{display:none}
}
.mf-h{font-size:20px;margin-bottom:12px}
body.model-campaign .need-grid,body.model-campaign .hero .facts{display:none}
body.model-campaign #heroTitle{font-size:clamp(44px,5vw,68px)}

/* 18.1 — porównanie z ptaszkami */
.cmp-common{font-size:14px;color:var(--navy);background:#fff;border-radius:14px;padding:12px 16px;box-shadow:var(--shadow-sm);margin-top:14px;max-width:none}
.cmp-table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border-radius:24px;box-shadow:var(--shadow);overflow:hidden;margin-top:18px}
.cmp-table th,.cmp-table td{padding:14px 12px;text-align:center;border-bottom:1px solid var(--line);font-size:14px}
.cmp-table thead th{background:#fff;vertical-align:bottom}
.cmp-table thead th b{display:block;color:var(--navy);font-size:15px}
.cmp-table thead th small{display:block;color:#6b727c;font-size:11.5px;font-weight:400;margin-top:3px}
.cmp-table tbody th{text-align:left;color:var(--navy);font-weight:500;width:26%}
.cmp-table tbody tr:nth-child(odd) td,.cmp-table tbody tr:nth-child(odd) th{background:#FAFBFC}
.cmp-table .yes{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;font-weight:700;font-size:14px}
.cmp-table .no{color:#b8bec6}
.cmp-table td small{display:block;font-size:11px;color:#6b727c;margin-top:4px}
.cmp-table thead th:nth-child(2),.cmp-table thead th:nth-child(3){box-shadow:inset 0 3px 0 var(--cyan)}
.cmp-table .cmp-price td{font-weight:700;color:var(--navy);background:#fff!important}
.cmp-table .cmp-btn td{border-bottom:0;background:#fff!important}
.cmp-table .cmp-btn .btn{min-height:40px;padding:8px 16px;font-size:12.5px}
.cmp-cards{display:none}
.cmp-src{font-size:11.5px;color:#7a818b;margin-top:10px}

/* raty, dostawa, pomoc przy wyniku */
.pay{font-size:12.5px;color:var(--navy);margin-top:6px}
.help-line{font-size:12.5px;color:var(--text);margin-top:10px;padding:10px 12px;background:var(--soft);border-radius:12px}

/* pasek świąteczny (kampania prezentowa) */
.xmas{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;background:var(--navy);color:#fff;border-radius:14px;padding:10px 14px;margin-bottom:18px;font-size:13px}
.xmas.hidden{display:none}
.xmas b{color:#fff}.xmas span{color:#c9cbe0}

/* link do rolki w krokach po zakupie */
.box-link{color:#9fe6f5;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.reel.pulse .reel-media{box-shadow:0 0 0 3px var(--cyan),var(--shadow)}

@media(max-width:900px){
 .cmp-table{display:none}
 .cmp-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:16px}
 .cmp-card{background:#fff;border-radius:20px;box-shadow:var(--shadow-sm);padding:16px 18px}
 .cmp-card h4{font-size:17px;color:var(--navy);margin:0}
 .cmp-card h4 small{display:block;font-size:12px;color:#6b727c;font-weight:400;margin-top:2px}
 .cmp-card ul{list-style:none;padding:0;margin:12px 0 0}
 .cmp-card li{display:grid;grid-template-columns:30px 1fr;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line);font-size:13.5px}
 .cmp-card li .yes{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--navy);color:#fff;font-size:12px;font-weight:700}
 .cmp-card li .no{color:#b8bec6;text-align:center}
 .cmp-card li small{grid-column:2;font-size:11px;color:#6b727c;margin-top:-4px}
 .cmp-card li:has(.no) span:last-child{color:#9aa0a8}
 .cmp-card-row{display:flex;justify-content:space-between;align-items:center;margin-top:12px}
 .cmp-card-row .m-price{margin:0;padding:0;font-size:18px}
}
@media(max-width:900px){
 .cmp-card li{grid-template-columns:30px 1fr}
 .cmp-card li .mk{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;font-size:12px;font-weight:700}
 .cmp-card li.on .mk{background:var(--navy);color:#fff}
 .cmp-card li.off .mk{color:#b8bec6}
 .cmp-card li.off .lbl{color:#9aa0a8}
 .cmp-card li .lbl small{display:block;font-size:11px;color:#6b727c;margin-top:2px}
}

/* ===== 18.5: pierwsze zatwierdzone zdjęcia ===== */
.photo{margin:0;border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:#efe9e0}
.photo img{display:block;width:100%;height:100%;object-fit:cover}
/* zdjęcie główne: scena z pustym stołem, na stole maszyna wybrana kolorem lub kampanią */
.hero-frame.has-photo{background:#efe9e0!important;border:0!important;padding:0!important;aspect-ratio:1448/995!important;min-height:0!important;display:block!important;overflow:hidden;position:relative}
.hero-frame.has-photo .hero-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-frame.has-photo .hero-product{position:absolute!important;right:var(--hx,4%)!important;bottom:var(--hy,25.7%)!important;width:var(--hw,43%)!important;margin:0!important;left:auto!important;top:auto!important}
.hero-frame.has-photo .hero-product-img{mix-blend-mode:normal!important;filter:drop-shadow(0 10px 10px rgba(60,40,20,.28)) sepia(.06) saturate(1.02)}
/* zbliżenia z podpisem */
.photo.cap{position:relative}
.photo.cap figcaption{position:absolute;left:12px;bottom:12px;right:12px;width:max-content;max-width:calc(100% - 24px);background:rgba(255,255,255,.92);color:var(--navy);font-size:12.5px;font-weight:600;padding:7px 12px;border-radius:999px;box-shadow:0 4px 14px rgba(20,20,60,.12)}
/* Zestaw STARTER – karta zamiast zdjęcia pudełka (do czasu zdjęcia z druku) */
.kit{position:relative;background:linear-gradient(160deg,#dcc6a2,#c9ad84);border-radius:24px;padding:26px 26px 24px;box-shadow:0 30px 70px rgba(0,0,0,.25);color:#2b2316;overflow:hidden}
.kit-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
.kit-tag{font-weight:700;letter-spacing:.14em;font-size:13px;color:var(--navy)}
.kit-sub{font-size:13px;color:#5b4a30}
.kit-machine{display:block;width:78%;margin:6px auto -8px;filter:drop-shadow(0 14px 14px rgba(60,40,20,.25))}
.kit-card{display:flex;align-items:center;justify-content:space-between;gap:14px;background:#fff;border-radius:14px;padding:14px 16px;margin:0 0 14px;box-shadow:0 8px 20px rgba(60,40,20,.15)}
.kit-card-t b{display:block;color:var(--navy);font-size:17px;letter-spacing:.04em}
.kit-card-t span{display:block;font-size:12.5px;color:#5d6470;margin-top:2px}
.kit-qr{flex:none;width:54px;height:54px;background:#fff;padding:3px;border-radius:6px}
.kit-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.kit-list li{background:rgba(255,255,255,.55);border-radius:999px;padding:7px 12px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:8px}
.kit-spools{display:inline-flex;gap:3px}
.kit-spools i{width:10px;height:10px;border-radius:50%;display:block;border:1px solid rgba(0,0,0,.15)}
.kit-spools i:nth-child(1){background:#9fd3ea}.kit-spools i:nth-child(2){background:var(--navy)}.kit-spools i:nth-child(3){background:#fff}

/* ===== 18.8: poprawki z oceny ===== */
/* START ma większą wagę niż CREATIVE i MASTER (strategia START-first) */
.fam{grid-template-columns:minmax(0,.78fr) minmax(0,1.55fr)}
.tile img{aspect-ratio:4/3;object-fit:cover}
.m-grid.m2 .m-img{aspect-ratio:2/1;object-fit:contain}
/* kolory 30.20 w jednym rzędzie */
.colors{flex-wrap:nowrap}
.colors-label{white-space:nowrap}
/* telefon: zaraz pod hasłem zdjęcie z maszyną, potem przyciski zadań */
@media(max-width:940px){
 .hero-grid{display:flex!important;flex-direction:column;gap:0!important;align-items:stretch!important}
 .hero-visual{width:100%;align-self:stretch}
 .hero-copy>.eyebrow{margin-bottom:10px}
 .hero-copy>h1{margin-bottom:0}
 .hero-copy>.lead{margin-top:14px!important}
 .hero-copy>.need-grid{margin-top:4px}
 .hero-copy{display:contents}
 .hero-copy>*{order:3}
 .hero-copy>.xmas,.hero-copy>.eyebrow,.hero-copy>h1,.hero-copy>.lead{order:1}
 .hero-visual{order:2;margin:6px 0 22px}
 .colors{flex-wrap:wrap}
}

/* ===== 19.0: treść i kolejność ===== */
.fx-go{display:inline-block;margin-top:10px;padding:0;border:0;background:none;color:var(--navy);font:inherit;font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;cursor:pointer}
.fx-go:hover{text-decoration-color:var(--cyan)}
.m-note-top{margin:10px 0 0;max-width:640px}
/* 19.1: zdjęcie Zestawu STARTER w sekcji „W każdym pudełku” */
.kit-photo{box-shadow:0 30px 70px rgba(0,0,0,.25)}

/* ===== v19.css ===== */
/* =====================================================================
   ŁUCZNIK 2026 — WARSTWA WZORCOWA wg „Łucznik — wzorzec wyglądu v2”
   Cztery kolory: #FFFFFF biel · #262261 granat · #00B8DE cyan · #E5E7EB szarość (linie).
   Jeden krój: Poppins 400 / 600. Ten plik przenosimy na łucznik.eu i szablon IdoSell.
   Zasady:
   - cały tekst w granacie; hierarchia przez wielkość i grubość, nie odcień,
   - cyan tylko jako akcent (kreska, podkreślenie linku, znacznik, obwódka zaznaczenia)
     albo tekst na granacie – nigdy tekst na bieli (kontrast 2,4:1),
   - sekcje białe, rozdzielone linią #E5E7EB; ciemne sekcje w granacie,
   - karty: promień 20 px, linia #E5E7EB, cień tylko przy najechaniu,
   - przyciski: pigułka, min. 48 px, tekst 14 px; na telefonie pełna szerokość.
   ===================================================================== */

:root{
  --navy:#262261; --cyan:#00B8DE; --line:#E5E7EB; --white:#FFFFFF;
  /* dawne odcienie szarości i jasne tła sprowadzone do palety */
  --ink:#262261; --text:#262261; --muted:#262261; --cyan-dark:#262261;
  --soft:#FFFFFF; --soft-cyan:#FFFFFF;
  /* kształty i cienie */
  --r-card:20px; --r-tile:20px;
  --shadow:none; --shadow-sm:none;
  --hover-shadow:0 16px 36px rgba(38,34,97,.10);
  /* rytm */
  --sec-y:88px;
}
@media(max-width:620px){:root{--sec-y:48px}}

/* ---------- 1. Szerokość treści i rytm sekcji ---------- */
.wrap{width:min(1240px,calc(100% - 48px))}
.section{padding-top:var(--sec-y);padding-bottom:var(--sec-y)}
.hero,.trust,.finder,.effects,.closeup,.compare,.reviews,.final,.fam.soft,.result-visual,.pw-img,.alt{background:#FFFFFF!important}
.trust,.finder,.effects,.closeup,.compare,.reviews,#pytania,.final{border-top:1px solid var(--line)}
.box{background:var(--navy)}
footer{background:var(--navy);color:#FFFFFF}
footer a,footer span,footer p,.foot-seller,.foot-ver span{color:#FFFFFF!important}
footer a{text-decoration-color:var(--cyan)}

/* ---------- 2. Tekst: wyłącznie granat na jasnych sekcjach ---------- */
:is(.header,.hero,.trust,.finder .result,.effects,.closeup,.compare,.models,.reviews,#pytania,.final:not(.final-dark),.model-fit)
  :is(p,li,span,small,figcaption,td,th,dd,dt,cite,label,summary,b,strong,em,h1,h2,h3,h4,h5,a,div,button)
  :not(.btn.primary):not(.btn.primary *):not(.chip.on):not(.yes):not(.mk):not(.xmas):not(.xmas *):not(.toast){color:#262261!important}
/* ciemna sekcja: biel i cyan, bez przezroczystości tekstu */
.box,.box h2,.box p,.box .lead-s,.box .steps b,.box .steps span{color:#FFFFFF!important}
.box .eyebrow,.box .eyebrow .no,.box .steps li:before{color:var(--cyan)!important}
.box-link{color:var(--cyan)!important;text-decoration-color:var(--cyan)}

/* ---------- 3. Pismo ---------- */
h1,h2,h3,h4,.h3big,.fam-h{font-weight:600}
h2{font-size:clamp(30px,3.3vw,46px);letter-spacing:-.03em}
.h3big{font-size:clamp(24px,2.4vw,30px)}
p{font-size:16px;line-height:1.7}
@media(max-width:620px){h2{font-size:clamp(27px,7.4vw,34px)} p{font-size:15px}}
/* opisy w kartach min. 14 px */
.need-chip span,.answer span,.pw-a span,.trust-item span,.tile figcaption small,.m-col ul,.rv-list cite,.cmp-off,.faq-list details p{font-size:14px}
.cmp-table td small,.cmp-table thead th small,.cmp-card li small,.cmp-card h4 small,.omnibus,.cmp-src{font-size:13px}
.hero .facts span,.fam .facts span{font-size:13px}
.tile figcaption{font-size:12px}
.step-label,#stepLabel,#pwStep{font-size:13px}

/* mały nagłówek: granat + kreska w cyanie */
.eyebrow{color:var(--navy);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.eyebrow::before{content:"";display:inline-block;width:18px;height:2px;background:var(--cyan);vertical-align:middle;margin:-2px 10px 0 0}

/* linki w tekście: granat, podkreślenie w cyanie */
.textlink,.fx-go,a.textlink{color:var(--navy);text-decoration:underline;text-decoration-color:var(--cyan);text-decoration-thickness:2px;text-underline-offset:4px;border-bottom:0}

/* ---------- 4. Przyciski ---------- */
.btn:not(.need-chip){min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:13px 24px;border-radius:999px;font-size:14px;font-weight:600}
.btn.primary{background:var(--navy);color:#FFFFFF;border:1px solid var(--navy)}
.btn.primary:hover,.btn.primary:focus-visible{background:var(--cyan);color:var(--navy)!important;border-color:var(--cyan)}
.btn.secondary{background:#FFFFFF;color:var(--navy);border:1px solid var(--navy)}
.btn.secondary:hover{background:var(--line)}
.head-cta{min-height:44px!important;padding:10px 20px!important}
@media(max-width:620px){
  .section .btn.primary:not(.need-chip),.section .btn.secondary:not(.cmp-card-row .btn),.final .btn.primary{width:100%}
}
/* zaznaczenie z klawiatury */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:none;box-shadow:0 0 0 3px #FFFFFF,0 0 0 6px var(--cyan)}

/* ---------- 5. Karty: linia, promień 20, cień tylko przy najechaniu ---------- */
.need-chip,.answer,.pw-a,.trust-item,.finder-box,.pw-box,.fam,.m-col,.rv-list blockquote,.faq-list details,.final-box,.tile,.model-fit,.m-proj,.fam .facts span,.alt,.cmp-table,.cmp-card,.cmp-common{border:1px solid var(--line)!important;border-radius:20px;box-shadow:none!important;background:#FFFFFF}
.m-col.start:first-child,.kit-photo,.hero-frame,.photo,.reel-media{box-shadow:none!important}
.hero-frame,.photo,.reel-media,.m-img,.tile img{border-radius:20px}
.m-img{background:#FFFFFF;border:1px solid var(--line)}
.fam .facts span{border-radius:999px;padding:6px 12px}
.need-chip,.answer,.pw-a,.tile,.fx,.m-col,.fam{transition:box-shadow .2s,transform .2s,border-color .2s}
.need-chip:hover,.answer:hover,.pw-a:hover{box-shadow:var(--hover-shadow)!important;transform:translateY(-2px);background:#FFFFFF}
.answer.selected,.pw-a.selected,.need-chip.on{border-color:var(--navy)!important;box-shadow:inset 3px 0 0 var(--cyan)!important}
.cmp-table tr,.cmp-table td,.cmp-table th{background:#FFFFFF!important}
.cmp-table td,.cmp-table th{border-bottom:1px solid var(--line)}
.box .steps li{border:1px solid rgba(255,255,255,.18)!important;background:transparent!important}

/* ---------- 6. Karty linii START i modele ---------- */
.fam .facts{display:flex;flex-wrap:wrap;gap:8px}
.fam .facts span{display:inline-flex}
.tile{padding:10px 10px 14px}
.tile img{background:transparent}
.m-grid.m2 .m-col{display:flex;flex-direction:column}
.m-grid.m2 .m-col .m-price{margin-top:auto;padding-top:14px}
.m-grid.m2 .m-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}

/* ---------- 7. Rolki: bez paska przewijania (są strzałki) ---------- */
.reels{scrollbar-width:none}
.reels::-webkit-scrollbar{display:none}

/* ---------- 8. Pytania: wyrównane do siatki, znak +/− ---------- */
#pytania .wrap.narrow{max-width:1240px;display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.5fr);gap:56px;align-items:start}
#pytania .section-head{position:sticky;top:110px;margin:0}
#pytania .faq-list{border-top:0}
.faq-list details{padding:0 20px;margin-bottom:10px}
.faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;font-size:15.5px;font-weight:600;cursor:pointer}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);color:var(--navy);font-size:18px;font-weight:400;line-height:1}
.faq-list details[open] summary::after{content:"–";border-color:var(--cyan)}
.faq-list details p{margin:0 0 18px;line-height:1.7}
@media(max-width:940px){#pytania .wrap.narrow{grid-template-columns:minmax(0,1fr);gap:24px}#pytania .section-head{position:static}}

/* ---------- 9. Bez ryzyka ---------- */
.rv-list blockquote{font-weight:600}
.rv-list blockquote cite{font-weight:400}

/* ---------- 10. Porównanie na telefonie: tylko to, co model ma ---------- */
.cmp-off{display:none}
@media(max-width:820px){.cmp-card li.off{display:none}.cmp-off{display:block;margin:8px 0 0;line-height:1.5}}

/* ---------- 11. Opisy brakujących zdjęć (podgląd): przerywana linia w cyanie ---------- */
.brief,.tile-brief,.reel-brief{background:#FFFFFF!important;border:1px dashed var(--cyan)!important;color:var(--navy)!important}

/* ---------- 12. Telefon: margines 24 px, cele dotyku min. 44 px ---------- */
@media(max-width:620px){
  .wrap{width:calc(100% - 48px)}
  .chip{min-height:44px;padding:10px 16px}
  .fx-go{padding:10px 0;margin-top:2px}
  .box-link,.textlink{display:inline-block;padding:8px 0}
  footer a{display:inline-block;padding:10px 0}
  .faq-list summary{font-size:15px;padding:16px 0}
}
@media(max-width:620px){.box-link,.textlink{padding:12px 0}footer a{padding:12px 0}}
/* wzmocnienie: starsze reguły ustawiały przezroczyste ramki kart */
.trust-item:not(.x),.m-col:not(.x),.rv-list blockquote:not(.rv-later),.finder-box:not(.x),.pw-box:not(.x){border-color:var(--line)!important}
/* etykiety linii w kartach modeli – jak mały nagłówek */
.m-label{color:var(--navy);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.m-label::before{content:"";display:inline-block;width:18px;height:2px;background:var(--cyan);vertical-align:middle;margin:-2px 10px 0 0}

/* ===== 19.3: poprawki po wykrywaczu Impeccable ===== */
/* zaznaczenie bez bocznego paska (typowy znak stron generowanych przez AI): pełna granatowa ramka 2 px */
.answer.selected,.pw-a.selected,.need-chip.on{box-shadow:none!important;border:2px solid var(--navy)!important}
.answer,.pw-a,.need-chip{border-width:1px}
/* wyraźniejsze stopnie pisma: opis 14–15 px → tytuł karty 18 px → tytuł modułu 22 px (min. 1,25×) */
.need-chip b,.answer b,.pw-a b,.trust-item b,.rv-list blockquote,.cmp-card h4,.cmp-table thead th b{font-size:18px}
.fx h3,.m-col h3,.final-box .h3,.pw-copy h3,#pwName,#resultName{font-size:22px;letter-spacing:-.01em}
.faq-list summary{font-size:17px}
@media(max-width:620px){.need-chip b,.answer b,.pw-a b{font-size:17px}.fx h3,.m-col h3{font-size:21px}.faq-list summary{font-size:16px}}
/* pozostałe uwagi wykrywacza: bez pasków w tle i bocznych kresek w opisach brakujących zdjęć */
.reel-media,.hero-frame,.brief,.tile-brief{background-image:none!important}
.reel-media{background-color:#FFFFFF!important;border:1px dashed var(--cyan)}
.reel.has-poster .reel-media{border:0}
.brief-rule{border-left:0!important;background:#FFFFFF!important;color:var(--navy)!important;padding:0!important}
.need-chip.on,.need-chip.on:hover{box-shadow:none!important}
.sticky-cta,.box *{text-shadow:none}

/* ===== 19.4: etap 3 – techniczne ===== */
/* znacznik przejścia klawiszem Tab musi wygrywać z regułami kart */
.need-chip:focus-visible,.answer:focus-visible,.pw-a:focus-visible,.chip:focus-visible,.btn:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:none!important;box-shadow:0 0 0 3px #FFFFFF,0 0 0 6px var(--cyan)!important}
/* zdjęcia z wymiarami w kodzie – zachowują proporcje przy zmianie szerokości */
img{height:auto}
.hero-scene,.photo img,.reel-poster,.tile img,.m-img,.hero-product-img{height:100%}
.tile img,.m-img{height:auto}
/* osoby z wyłączonymi animacjami w systemie */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important}
  .need-chip:hover,.answer:hover,.pw-a:hover{transform:none!important}
}

/* ===== v20.css ===== */
/* =====================================================================
   ŁUCZNIK 2026 — WARSTWA 20.0: rytm, skala, podziałka
   Paleta wzorca v2 + jeden ton tła: #F5F6F8 (tylko tło sekcji, nigdy tekst).
   Rytm sekcji: biała → jasna → granatowa. Ramka tylko na tym, co się klika.
   ===================================================================== */
:root{--tone:#F5F6F8;--panel-shadow:0 1px 2px rgba(38,34,97,.04),0 12px 32px rgba(38,34,97,.06)}

/* ---------- 1. Rytm tła sekcji ---------- */
body .hero{background:linear-gradient(180deg,#FFFFFF 0%,#FFFFFF 62%,var(--tone) 100%)!important}
body .trust,body .finder,body .closeup,body .compare,body #pytania{background:var(--tone)!important}
body .effects,body .models,body .reviews{background:#FFFFFF!important}
body .trust,body .finder,body .effects,body .closeup,body .compare,body .models,body .reviews,body #pytania,body .final{border-top:0!important}
body .finder{padding-top:24px}
body .trust{padding-bottom:8px}
/* przejście tonalne z jasnej sekcji w granatową */
body .box{background-color:var(--navy);background-image:linear-gradient(180deg,var(--navy) 0%,#1d1a4f 100%)}

/* ---------- 2. Karty: ramka tylko na elementach klikanych ---------- */
body .trust-item,body .rv-list blockquote,body .fam,body .m-col,body .m-proj,body .cmp-common,body .final-box,body .faq-list details,body .finder-box,body .pw-box,body .cmp-table,body .cmp-card{border:0!important}
body .trust-item{background:#FFFFFF;box-shadow:var(--panel-shadow)!important}
body .finder-box,body .pw-box{background:#FFFFFF;box-shadow:var(--panel-shadow)!important;border-radius:28px}
body .faq-list details{background:#FFFFFF;box-shadow:0 1px 2px rgba(38,34,97,.05)!important}
body .faq-list details[open]{box-shadow:var(--panel-shadow)!important}
body .cmp-table,body .cmp-card{box-shadow:var(--panel-shadow)!important;background:#FFFFFF}
/* „Bez ryzyka”: granatowa linia nad kolumną (jak w identyfikacji), bez pudełek */
body .rv-list blockquote{background:transparent!important;border-top:2px solid var(--navy)!important;border-radius:0!important;padding:18px 0 6px!important}
/* karty linii na jasnym tle zamiast ramki */
body .fam,body .m-col{background:var(--tone)!important;border-radius:28px}
body .fam .facts span{background:#FFFFFF!important;border:0!important}
body .m-proj{background:#FFFFFF!important}
body .m-img{border:0!important;background:transparent!important}

/* ---------- 3. Efekty: mozaika (jedno duże zdjęcie + trzy mniejsze) ---------- */
@media(min-width:941px){
  .fx-grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr)!important;gap:22px 22px}
  .fx-grid .fx:nth-child(1){grid-row:span 2;display:flex;flex-direction:column}
  .fx-grid .fx:nth-child(1) .photo{aspect-ratio:auto;flex:1;min-height:420px}
  .fx-grid .fx:nth-child(1) h3{font-size:30px!important;letter-spacing:-.02em}
  .fx-grid .fx:nth-child(4){grid-column:span 2}
  .fx-grid .fx:nth-child(4) .photo{aspect-ratio:21/9}
}
@media(max-width:940px) and (min-width:621px){.fx-grid .fx:nth-child(1){grid-column:span 2}.fx-grid .fx:nth-child(1) .photo{aspect-ratio:16/9}}
@media(max-width:620px){.fx-grid .fx:nth-child(1) .photo{aspect-ratio:4/3}.fx-grid .fx:nth-child(1) h3{font-size:24px!important}}

/* ---------- 4. Linie START: jedna duża maszyna + miniatury ---------- */
.fam-tiles.has-stage{display:flex!important;flex-direction:column;gap:14px}
.fam-stage{margin:0;background:#FFFFFF;border-radius:24px;padding:18px 18px 16px;text-align:center}
.fam-stage img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
.fam-stage figcaption{font-size:15px;font-weight:600;letter-spacing:.06em;color:var(--navy);margin-top:4px}
.fam-stage figcaption small{display:block;font-size:14px;font-weight:400;letter-spacing:0;margin-top:2px;color:var(--navy)}
.fam-thumbs{display:flex;gap:10px;flex-wrap:wrap}
.fam-thumb{flex:1 1 0;min-width:72px;min-height:48px;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px 10px;background:#FFFFFF;border:1px solid var(--line);border-radius:16px;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--navy)}
.fam-thumb img{width:100%;max-width:120px;height:auto;aspect-ratio:3/2;object-fit:contain}
.fam-thumb[aria-pressed="true"]{border:2px solid var(--navy)}
.fam-thumb:hover{border-color:var(--navy)}
@media(min-width:1001px){body .fam{grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr)!important;padding:48px!important}}

/* ---------- 5. Podziałka jako konstrukcja ---------- */
.scale-xl{position:relative;display:flex;justify-content:space-between;align-items:center;height:44px;max-width:620px;margin:0 0 26px}
.scale-xl i{display:block;flex:none;width:2px;height:14px;background:var(--navy)}
.scale-xl i.M{height:24px}
.scale-xl .ind{position:absolute;top:50%;left:50%;width:4px;height:44px;background:var(--cyan);transform:translate(-50%,-50%)}
.scale-xl.on-dark i{background:#FFFFFF}
@media(max-width:620px){.scale-xl{max-width:100%}.scale-xl i:nth-child(even){display:none}}
/* pasek postępu w nagłówku – wskaźnik idzie z przewijaniem */
.scroll-scale{position:absolute;left:0;right:0;bottom:-1px;height:9px;max-width:none;margin:0;padding:0 max(24px,calc((100% - 1240px)/2));align-items:flex-end;pointer-events:none}
.scroll-scale i{width:1px;height:4px;background:var(--line)}
.scroll-scale i.M{height:7px;background:#C9CCD3}
.scroll-scale .ind{top:auto;bottom:0;width:3px;height:9px;transform:translateX(-50%);left:0;transition:none}
@media(max-width:620px){.scroll-scale i:nth-child(odd):not(.M){display:none}}

/* ---------- 6. Zakończenie: granatowy pas ---------- */
body .final.final-dark{background:var(--navy)!important;padding:96px 0}
body .final-dark .final-box{background:transparent!important;box-shadow:none!important;padding:0!important}
body .final-dark h2,body .final-dark p{color:#FFFFFF!important}
body .final-dark .eyebrow{color:var(--cyan)!important}
body .final-dark h2{font-size:clamp(34px,4.2vw,56px)}
body .final-dark .scale{display:none}
.btn.btn-on-dark{background:#FFFFFF!important;color:var(--navy)!important;border-color:#FFFFFF!important}
.btn.btn-on-dark:hover{background:var(--cyan)!important;border-color:var(--cyan)!important}
footer{border-top:1px solid rgba(255,255,255,.18)}

/* ---------- 7. Większa skala nagłówków sekcji (kontrast skali) ---------- */
@media(min-width:941px){
  .section-head h2{font-size:clamp(38px,3.6vw,54px)}
  .box-copy h2{font-size:clamp(40px,3.8vw,58px)}
}
.section-head{margin-bottom:36px}
/* poprawki po przeglądzie zrzutów */
body .fam.soft{background:var(--tone)!important}
.fx{display:flex;flex-direction:column;align-items:flex-start}
.fx .photo{align-self:stretch}
body .final-dark .btn.btn-on-dark{background:#FFFFFF!important;color:var(--navy)!important;border-color:#FFFFFF!important}
body .final-dark .btn.btn-on-dark:hover{background:var(--cyan)!important;border-color:var(--cyan)!important}
@media(max-width:1000px){body .fam{grid-template-columns:minmax(0,1fr)!important;padding:28px 20px!important;gap:22px}}
@media(max-width:620px){.fam-thumb{min-width:0;font-size:12px}.fam-thumbs{gap:8px}}
@media(max-width:1000px){body .fam .fam-tiles{order:-1}}

/* ===== v21.css ===== */
/* =====================================================================
   ŁUCZNIK 2026 — WARSTWA 21.0: wygląd jak Sklep firmowy Łucznik (v18)
   Tylko wygląd. Paleta: #FFFFFF #262261 #00B8DE #E5E7EB. Poppins 400/600.
   Wzór: LUCZNIK_WZORZEC_WYGLADU_v2 + sklep home.html / listing.html.
   ===================================================================== */
:root{--tone:#FFFFFF;--line:#E5E7EB;--panel-shadow:none;--hover-shadow:0 16px 36px rgba(0,0,0,.08);--r-tile:20px}

/* ---------- 1. Tła sekcji: biel + linia #E5E7EB, ciemne tylko granat ---------- */
body .hero{background:#FFFFFF!important;background-image:none!important}
body .trust,body .finder,body .effects,body .closeup,body .models,body .compare,body .reviews,body #pytania{background:#FFFFFF!important;border-top:1px solid #E5E7EB!important}
body .box{background:#262261!important;background-image:none!important}
body .final.final-dark{background:#262261!important;background-image:none!important}

/* rytm pionowy: 56–92 px (telefon 48) */
body .section{padding:80px 0!important}
body .trust{padding:28px 0!important}
body .final.final-dark{padding:88px 0!important}
@media(max-width:760px){body .section,body .final.final-dark{padding:48px 0!important}body .trust{padding:24px 0!important}}

/* treść do 1240 px, margines 24 px (telefon 16 px) */
.wrap{width:min(1240px,calc(100% - 48px))}
@media(max-width:760px){.wrap{width:calc(100% - 32px)!important}}

/* ---------- 2. Nagłówek: logo 44 px (telefon 30), przycisk główny 48 px ---------- */
.header{background:#FFFFFF!important;border-bottom:1px solid #E5E7EB!important;box-shadow:none!important}
.header .wrap{height:auto!important;min-height:80px;padding:18px 0}
.logo{height:44px!important;width:auto!important}
.head-cta{min-height:48px!important;padding:13px 24px!important;font-size:14px!important}
@media(max-width:760px){
  .header .wrap{min-height:58px;padding:14px 0}
  .logo{height:30px!important}
  .header{transition:transform .25s}
  .header.hid{transform:translateY(-100%)}
}
@media(prefers-reduced-motion:reduce){.header{transition:none}}
.scroll-scale i,.scroll-scale i.M{background:#E5E7EB!important}

/* ---------- 3. Typografia: wielkość i grubość, nie szarość ---------- */
b,strong,th,td,.m-price,.yes,.need-chip:after{font-weight:600!important}
@media(min-width:761px){
  .section-head h2,.box-copy h2,body .final-dark h2,.finder-intro h2{font-size:clamp(30px,3.2vw,46px)!important;line-height:1.08;letter-spacing:-.04em}
}
@media(max-width:760px){
  h1,#heroTitle{font-size:34px!important;line-height:1.06;letter-spacing:-.03em}
  .section-head h2,.box-copy h2,body .final-dark h2,.finder-intro h2{font-size:30px!important;line-height:1.1;letter-spacing:-.03em}
}
.section-head p,.finder-sub,.lead-s,.box-copy p,.faq-list details p,.cmp-common p{font-size:16px!important;line-height:1.7!important}
@media(max-width:760px){.section-head p,.finder-sub,.lead-s,.box-copy p,.faq-list details p,.cmp-common p{font-size:15px!important}}

/* opisy w kartach min. 14 px */
.need-chip span,.answer span,.pw-a span,.trust-item span,.colors-label,.chip,.step-label,.box-link,.m-models,.m-proj,.m-label,
.tile figcaption,.tile figcaption small,.m-col small,.cmp-card small,.cmp-table small,.linkbtn,.photo figcaption,.fx figcaption,
.m-col li,.cmp-off,.rv-list cite,.foot-legal a,.foot-seller,.foot-ver,.foot-ver span,.toast,.save-dlg p,.save-dlg label,.reel-dlg p,
.sticky-cta,.xmas span,.result small,.result-why li,.alt span,.m-price small{font-size:14px!important}

/* ---------- 4. Przyciski ---------- */
.btn.primary:not(.need-chip),.sticky-cta{background:#262261!important;color:#FFFFFF!important;border:1px solid #262261!important;border-radius:999px!important;box-shadow:none!important}
.btn.primary:not(.need-chip):hover,.sticky-cta:hover{background:#00B8DE!important;border-color:#00B8DE!important;color:#262261!important}
.btn.secondary{background:#FFFFFF!important;color:#262261!important;border:1px solid #262261!important}
.btn.secondary:hover{background:#E5E7EB!important}
body .final-dark .btn.btn-on-dark{background:#FFFFFF!important;color:#262261!important;border-color:#FFFFFF!important}
body .final-dark .btn.btn-on-dark:hover{background:#00B8DE!important;border-color:#00B8DE!important;color:#262261!important}
.sticky-cta{min-height:48px;padding:13px 24px!important;font-size:14px!important}
/* linki tekstowe w liniach przycisków */
.linkbtn{border:0!important;text-decoration:underline;text-decoration-color:#00B8DE;text-decoration-thickness:2px;text-underline-offset:4px}
.reels-nav .linkbtn{text-decoration:none;border:1px solid #E5E7EB!important;border-radius:999px}
.reels-nav .linkbtn:hover{border-color:#262261!important}
.box-link{color:#FFFFFF!important;text-decoration:underline;text-decoration-color:#00B8DE;text-decoration-thickness:2px;text-underline-offset:4px}

/* przyciski kolorów (chip) */
.chip{border:1px solid #E5E7EB!important;background:#FFFFFF;color:#262261;min-height:44px}
.chip:hover{border-color:#262261!important}
.chip.on{background:#262261!important;border-color:#262261!important;color:#FFFFFF!important}

/* ---------- 5. Dobór: kafelki jak „Co chcesz uszyć?” w sklepie (.choice) ---------- */
.need-chip,.answer,.pw-a{background:#FFFFFF!important;border:1px solid #E5E7EB!important;border-radius:20px!important;box-shadow:none!important;transform:none!important;padding:20px 48px 20px 22px!important;position:relative;text-align:left}
.need-chip b,.answer b,.pw-a b{font-size:17px!important;font-weight:600!important;color:#262261!important}
.need-chip span,.answer span,.pw-a span{color:#262261!important;margin-top:2px}
.need-chip:hover,.answer:hover,.pw-a:hover{border-color:#262261!important;box-shadow:none!important;background:#FFFFFF!important;transform:none!important}
.answer:after,.pw-a:after{content:"→";position:absolute;right:22px;top:50%;transform:translateY(-50%);color:#262261;font-weight:400}
.need-chip:after{right:22px!important;color:#262261!important;font-weight:400!important}
.answer.selected,.pw-a.selected,.need-chip.on{border:1px solid #262261!important;box-shadow:inset 0 0 0 1px #262261!important}
.finder-box,.pw-box{background:#FFFFFF!important;border:1px solid #E5E7EB!important;border-radius:20px!important;box-shadow:none!important}
.progress{background:#E5E7EB!important}
.progress i{background:#00B8DE!important}

/* ---------- 6. Karty: promień 20, linia #E5E7EB, cień tylko po najechaniu ---------- */
body .trust-item{background:#FFFFFF!important;border:1px solid #E5E7EB!important;border-radius:20px!important;box-shadow:none!important}
body .fam,body .fam.soft,body .m-col,body .cmp-table,body .cmp-card,body .cmp-common,body .model-fit,body .alt,body .m-proj{background:#FFFFFF!important;border:1px solid #E5E7EB!important;border-radius:20px!important;box-shadow:none!important}
body .fam .facts span{background:#FFFFFF!important;border:1px solid #E5E7EB!important}
.cmp-table th,.cmp-table td{box-shadow:none!important}
.m-col:hover,.cmp-card:hover{box-shadow:0 16px 36px rgba(0,0,0,.08)!important}

/* ---------- 7. Modele: karty jak „Nowa generacja maszyn” (bez sceny z miniaturami) ---------- */
.fam-tiles{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px!important;align-content:start}
.fam-tiles.t3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.fam-tiles .tile{display:flex;flex-direction:column;gap:8px;margin:0;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;text-align:left}
.fam-tiles .tile img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;background:#FFFFFF;border:1px solid #E5E7EB;border-radius:20px;padding:10px;box-sizing:border-box;transition:box-shadow .2s}
.fam-tiles .tile:hover img{box-shadow:0 16px 36px rgba(0,0,0,.08)}
.fam-tiles .tile figcaption{margin:0!important;font-size:17px!important;font-weight:600!important;letter-spacing:0!important;color:#262261!important;text-transform:none}
.fam-tiles .tile figcaption small{display:block;font-size:14px!important;font-weight:400!important;margin-top:2px}
@media(max-width:760px){.fam-tiles,.fam-tiles.t3{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}.fam-tiles .tile figcaption{font-size:15px!important}}

/* ---------- 8. Zdjęcia: ramka 20 px, białe tło pod zdjęciem ---------- */
.photo,.hero-frame,.reel-media,.kit-photo{border-radius:20px!important;background:#FFFFFF!important;overflow:hidden}
.photo.cap figcaption,.photo figcaption{background:#FFFFFF!important;color:#262261!important;box-shadow:none!important;border:1px solid #E5E7EB}
.reel-play{box-shadow:none!important;border:1px solid #E5E7EB!important}
.reel-play:hover{background:#00B8DE!important;border-color:#00B8DE!important}

/* ---------- 9. Pytania: lista jak „Pytania o zakupy” w sklepie ---------- */
body .faq-list details{background:transparent!important;border:0!important;border-bottom:1px solid #E5E7EB!important;border-radius:0!important;box-shadow:none!important;padding:0!important;margin:0!important}
body .faq-list details:first-child{border-top:1px solid #E5E7EB!important}
body .faq-list details[open]{box-shadow:none!important}
body .faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:18px 0!important;font-size:16px!important;font-weight:600!important;color:#262261!important;background:none!important}
body .faq-list summary::-webkit-details-marker{display:none}
body .faq-list summary::before{content:none!important;display:none!important}
body .faq-list summary::after{content:"+"!important;font-size:22px;line-height:1;color:#262261!important;font-weight:400;flex:none;position:static!important;transform:none!important;background:none!important;width:auto!important;height:auto!important}
body .faq-list details[open] summary::after{content:"−"!important}
body .faq-list details p{margin:0 0 18px!important;padding:0!important;max-width:62ch}
body .faq-list{display:block!important;gap:0!important}

/* ---------- 10. Granat: Po zakupie, zakończenie ---------- */
.box .steps li{border:0!important;border-top:1px solid #E5E7EB!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.box .steps li:first-child{border-top:0!important}

/* ---------- 11. Stopka jak w sklepie: biała, linia #E5E7EB ---------- */
footer{background:#FFFFFF!important;color:#262261!important;border-top:1px solid #E5E7EB!important}
footer a,footer span,footer p,.foot-seller,.foot-ver span{color:#262261!important}
.foot-legal a{text-decoration:underline;text-decoration-color:#00B8DE;text-decoration-thickness:2px;text-underline-offset:4px}

/* ---------- 12. Okienka i komunikaty ---------- */
.toast{background:#262261!important;color:#FFFFFF!important;border-radius:999px;padding:12px 20px!important}
/* przyciemnienie pod okienkami: granat 60%, jak okienko rolki w sklepie (ivonne.html) */
.save-dlg,.reel-dlg{background:rgba(38,34,97,.6)!important}
.save-dlg>div,.save-dlg .dlg,.reel-dlg>div{border-radius:20px}

/* ---------- 13. Rolki: podpisy i miejsce na film ---------- */
.reel figcaption{font-size:15px!important;font-weight:600!important}

/* ---------- 14. Poprawki po audycie 21.0 ---------- */
body .finder-box,body .pw-box{border:1px solid #E5E7EB!important}
body .hero-frame,body .hero-frame.has-photo,#LP-HERO-01{background:#FFFFFF!important}
.head-nav a:not(.btn){font-size:14px!important}
.facts span,.fam .facts span,.box .steps li span,.btn.secondary,.pick2,.cmp-src,.lbl,.final-dark p,.final-box p{font-size:14px!important}
.mk{font-size:14px!important;font-weight:600!important}
/* fokus zawsze widoczny (wygrywa z „bez cienia” powyżej) */
body a:focus-visible,body button:focus-visible,body .btn:focus-visible,body .btn.primary:focus-visible,body summary:focus-visible,body input:focus-visible,body .sticky-cta:focus-visible{outline:none!important;box-shadow:0 0 0 3px #FFFFFF,0 0 0 6px #00B8DE!important}
/* elementy ukryte do czasu użycia: też tylko paleta */
.xmas{border-radius:20px}.xmas span{color:#FFFFFF!important}
.calibration i{background:#262261}
.color-brief{background:#FFFFFF!important;border:1px dashed #00B8DE!important;border-radius:20px}
.save-dlg input,input[type=email]{border:1px solid #E5E7EB!important;border-radius:999px}
.save-dlg input:focus-visible{border-color:#262261!important}
.reel-x{color:#FFFFFF!important}
body .cmp-card li.off .mk{color:#262261}

/* ===== v22.css ===== */
/* =====================================================================
   ŁUCZNIK 2026 — WARSTWA 22.0: poprawki po niezależnym przeglądzie
   Sekcja 01 jak „Dobierz maszynę” w sklepie (home.html), telefon, wynik, karty.
   ===================================================================== */

/* ---------- 1. Sekcja 01: granat jak w sklepie, odpowiedzi jak kafelki .choice ---------- */
body .finder{background:#262261!important;border-top:0!important;color:#FFFFFF}
body .finder .finder-intro h2,body .finder .finder-sub,body .finder .finder-intro p{color:#FFFFFF!important}
body .finder .eyebrow,body .finder .eyebrow .no{color:#00B8DE!important}
body .finder .calibration i,body .finder .scale .ticks i{background:#FFFFFF!important}
body .finder .calibration i.active,body .finder .scale .ind{background:#00B8DE!important}
/* pytania leżą na granacie, bez białej ramki */
body .finder .finder-box{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
body .finder .step-label{color:#00B8DE!important;font-size:14px!important}
body .finder .question h3{color:#FFFFFF!important}
body .finder .progress{background:#FFFFFF!important;opacity:1}
body .finder .finder-nav button{color:#FFFFFF!important;background:none;border:0;font:inherit;font-size:14px;font-weight:600;text-decoration:underline;text-decoration-color:#00B8DE;text-decoration-thickness:2px;text-underline-offset:4px;cursor:pointer;min-height:44px}
body .finder .answer{background:#FFFFFF!important;border:1px solid #E5E7EB!important}
body .finder .answer b,body .finder .answer span{color:#262261!important}
body .finder .answer:hover{border-color:#00B8DE!important}
body .finder .answer.selected{box-shadow:inset 0 0 0 2px #00B8DE!important;border-color:#00B8DE!important}
body .finder .answer:focus-visible{box-shadow:0 0 0 3px #262261,0 0 0 6px #00B8DE!important}
/* wynik: biała karta na granacie */
body .finder.has-result .finder-box{background:#FFFFFF!important;border-radius:20px!important;padding:28px!important}
body .finder.has-result .finder-box .eyebrow{color:#262261!important}
body .finder.has-result .step-label{color:#262261!important}
body .finder.has-result .finder-box .scale .ticks i{background:#262261!important}
body .finder.has-result .finder-nav button{color:#262261!important}
@media(max-width:760px){body .finder.has-result .finder-box{padding:20px 16px!important;margin:0 -4px}}
/* linki na granacie */
body .finder a:not(.btn){color:#FFFFFF}
body .finder .result a:not(.btn){color:#262261}

/* ---------- 2. Podsumowanie odpowiedzi nad wynikiem ---------- */
.result-answers{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 18px}
.result-answers.hidden{display:none}
.ra-l{font-size:14px;color:#262261}
.ra-b{min-height:44px;padding:10px 16px;border:1px solid #E5E7EB;border-radius:999px;background:#FFFFFF;color:#262261;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.ra-b span{font-weight:400;text-decoration:underline;text-decoration-color:#00B8DE;text-decoration-thickness:2px;text-underline-offset:4px}
.ra-b:hover{border-color:#262261}
.result-actions-top{margin:10px 0 18px!important}

/* ---------- 3. Wynik w jednej kolumnie na telefonie (oba dobory) ---------- */
@media(max-width:760px){
  .result-top,.pw-result{display:flex!important;flex-direction:column!important;gap:14px!important}
  .result-visual,.pw-img{width:100%!important;max-width:none!important}
  .result-visual img,.pw-img img{width:100%!important;height:auto!important;aspect-ratio:3/2;object-fit:contain}
  .result-copy,.pw-copy{width:100%!important}
  .result-actions .btn,.result-actions-top .btn{width:100%}
}

/* ---------- 4. Pierwszy ekran telefonu: najpierw „co chcesz uszyć”, potem zdjęcie ---------- */
@media(max-width:940px){
  .hero-copy>.need-grid{order:1;margin-top:18px!important}
  .hero-visual{order:2}
}
@media(max-width:620px){
  .hero-copy>.need-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
  .hero .need-chip{min-height:0!important;padding:14px 30px 14px 14px!important}
  .hero .need-chip b{font-size:15px!important;line-height:1.25}
  .hero .need-chip span{font-size:14px!important;line-height:1.3}
  .hero .need-chip:after{right:12px!important}
  .hero-frame{aspect-ratio:16/10!important;height:auto!important}
  .hero-frame img{height:100%!important;object-fit:cover}
}

/* ---------- 5. Typografia: bez pojedynczych słów w ostatniej linii ---------- */
h1,h2,h3,h4{text-wrap:balance}
p,li,figcaption,summary{text-wrap:pretty}
.m-price,.price,.m-price *{font-weight:600!important}

/* ---------- 6. Karty modeli: większa maszyna, START 30.21–30.23 w 3 kolumnach na telefonie ---------- */
.fam-tiles .tile img{padding:4px!important;aspect-ratio:4/3!important}
@media(max-width:760px){
  .fam-tiles.t3{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}
  .fam-tiles.t3 .tile figcaption{font-size:14px!important}
  .fam-tiles.t3 .tile figcaption small{font-size:14px!important;line-height:1.3}
}
.fam .facts{display:flex!important;flex-wrap:wrap;gap:8px}
.m-proj{border:0!important;padding:0!important;background:none!important;font-weight:600}

/* ---------- 7. Tabela porównania ---------- */
.cmp-table .btn{white-space:nowrap;padding-left:16px!important;padding-right:16px!important}
.cmp-table thead th{vertical-align:bottom}
.cmp-table tr:last-child th,.cmp-table tr:last-child td{border-bottom:0!important}

/* ---------- 8. Zbliżenia: tablet 3 kolumny, telefon pasek przewijany ---------- */
@media(min-width:621px) and (max-width:1000px){
  .cu-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important}
  .cu-row .photo{aspect-ratio:1!important}
}
@media(max-width:620px){
  .cu-row{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px!important;padding-bottom:6px}
  .cu-row>*{flex:0 0 78%;scroll-snap-align:start}
}

/* ---------- 9. Kafelki zaufania 2×2 na telefonie ---------- */
@media(max-width:760px){
  .trust-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
  .trust-item{padding:14px!important}
  .trust-item b{font-size:15px!important}
}

/* ---------- 10. Nagłówek na telefonie: lżejszy przycisk (drugorzędny, nadal 48 px) ---------- */
@media(max-width:620px){
  body .header .btn.primary.head-cta{background:#FFFFFF!important;color:#262261!important;border:1px solid #262261!important;padding:13px 18px!important}
  body .header .btn.primary.head-cta:hover{background:#E5E7EB!important;color:#262261!important}
}

/* ---------- 11. Zakończenie: mocniejszy przycisk ---------- */
body .final-dark .final-box{align-items:end!important}
body .final-dark .btn.btn-on-dark{min-height:56px!important;padding:16px 32px!important;font-size:16px!important}

/* ---------- 12. Cele dotyku i linki w tekście ---------- */
.fx-go{min-height:44px;display:inline-flex!important;align-items:center}
.pw-sub a,.section-head p a{padding:0!important}

/* ---------- 13. Komunikat błędu w okienku ---------- */
.save-err{margin:10px 0 0;font-size:14px;font-weight:600;color:#262261;min-height:0}
.save-err:empty{display:none}
.save-err:not(:empty){border-left:2px solid #00B8DE;padding-left:10px}
.omnibus,.pay,.family-note,.help-line,.result .why,.pw-copy .why{font-size:14px!important}
/* wynik: zdjęcie u góry obok nazwy */
@media(min-width:761px){.result-top{align-items:start!important}.result-visual{align-self:start!important;position:sticky;top:96px}}