/* Ł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%}
}