/* ==========================================================================
   Audyt online - wspólny komponent podstron audytu (prefiks au-)
   Formularz skanu (w ciemnym hero) + sekcja wyników #wynik (jasna).
   Kolory statusów: błąd #E11D48, uwaga #D97706, ok #059669, info #64748B.
   ========================================================================== */

:root{
	--au-fail:#E11D48;--au-warn:#D97706;--au-ok:#059669;--au-info:#64748B;
	--au-fail-bg:rgba(225,29,72,.07);--au-warn-bg:rgba(217,119,6,.08);--au-ok-bg:rgba(5,150,105,.07);--au-info-bg:rgba(100,116,139,.08);
}

/* ── Formularz ─────────────────────────────────────────────── */
.au-form{position:relative;width:100%;max-width:640px;margin-top:30px}
.au-form__row{display:flex;align-items:center;gap:8px;padding:7px 7px 7px 20px;border-radius:999px;background:#fff;box-shadow:0 24px 60px -24px rgba(79,70,229,.55),0 0 0 1px rgba(165,180,252,.25);transition:box-shadow .35s var(--cz-ease)}
.au-form__row:focus-within{box-shadow:0 24px 60px -20px rgba(79,70,229,.7),0 0 0 3px rgba(99,102,241,.45)}
.au-form__ic{flex:none;color:#7C83A6;font-size:.95rem}
.au-form__input{flex:1;min-width:0;padding:14px 4px;border:0;outline:0;background:transparent;font:500 1.02rem/1.2 var(--cz-body);color:var(--cz-ink-text)}
.au-form__input::placeholder{color:#9AA0BC}
.au-form__btn{flex:none;display:inline-flex;align-items:center;gap:10px;padding:15px 22px;border:0;border-radius:999px;background:linear-gradient(135deg,#4F46E5,#6366F1);color:#fff;font:600 .95rem/1 var(--cz-body);cursor:pointer;transition:transform .3s var(--cz-ease),filter .3s}
.au-form__btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.au-form__btn:disabled{cursor:progress;filter:saturate(.6) brightness(.95)}
.au-form__btn i{transition:transform .35s var(--cz-ease)}
.au-form__btn:hover i{transform:translateX(3px)}
.au-form.is-busy .au-form__btn i{animation:auSpin .9s linear infinite}
.au-form.is-busy .au-form__btn i::before{content:"\f110"}
@keyframes auSpin{to{transform:rotate(360deg)}}

.au-form__more{margin-top:12px;color:var(--cz-muted);font-size:.86rem}
.au-form__more summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;color:var(--cz-lav);list-style:none}
.au-form__more summary::-webkit-details-marker{display:none}
.au-form__more summary::before{content:"+";display:grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1px solid rgba(165,180,252,.4);font-size:.8rem;line-height:1}
.au-form__more[open] summary::before{content:"\2212"}
.au-form__input--sm{width:100%;margin-top:10px;padding:13px 18px;border-radius:14px;background:#fff;font-size:.92rem}
.au-form__more small{display:block;margin-top:8px;color:var(--cz-muted)}
.au-form__note{display:flex;align-items:center;gap:8px;margin-top:14px!important;font-size:.82rem;color:var(--cz-muted)}
.au-form__note i{color:var(--cz-cyan);font-size:.75rem}
.au-form__err{margin-top:12px!important;padding:11px 16px;border-radius:12px;background:rgba(225,29,72,.14);border:1px solid rgba(251,113,133,.35);color:#FECDD3;font-size:.9rem}

/* postęp skanu */
.au-prog[hidden],.au-res[hidden],.au-form__err[hidden]{display:none!important}
.au-prog{display:grid;gap:7px;margin:18px 0 0;padding:16px 18px;border-radius:18px;background:rgba(10,14,32,.55);border:1px solid rgba(165,180,252,.16);list-style:none;font:500 .8rem/1.35 var(--cz-mono);color:rgba(232,234,246,.55)}
.au-prog li{display:flex;align-items:center;gap:10px;transition:color .3s}
.au-prog li i{width:14px;text-align:center;opacity:.35}
.au-prog li.is-run{color:#fff}
.au-prog li.is-run i{opacity:1;color:var(--cz-cyan);animation:auSpin .9s linear infinite}
.au-prog li.is-done{color:rgba(232,234,246,.8)}
.au-prog li.is-done i{opacity:1;color:#34D399}
.au-prog li.is-done i::before{content:"\f00c"}

/* ── Wyniki ────────────────────────────────────────────────── */
.au-res{padding:clamp(56px,7vw,96px) 0}
.au-res.is-in [data-au-body]{animation:auIn .7s var(--cz-ease) both}
@keyframes auIn{from{opacity:0;transform:translate3d(0,24px,0)}}

.au-head{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(250px,320px);gap:28px clamp(24px,4vw,48px);align-items:center;padding:clamp(22px,3vw,34px);border-radius:28px;background:#fff;border:1px solid var(--cz-line-l);box-shadow:0 40px 80px -60px rgba(11,16,32,.45)}
.au-ring{position:relative;display:grid;place-items:center;width:150px;height:150px}
.au-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.au-ring circle{fill:none;stroke-width:9}
.au-ring__bg{stroke:#ECEEF6}
.au-ring__fg{stroke:var(--au-col);stroke-linecap:round;stroke-dasharray:var(--au-c);stroke-dashoffset:var(--au-c);transition:stroke-dashoffset 1.2s var(--cz-ease) .1s}
.au-res.is-in .au-ring__fg{stroke-dashoffset:var(--au-o)}
.au-ring b{position:relative;font:700 2.7rem/1 var(--cz-display);letter-spacing:-.04em;color:var(--cz-ink-text)}
.au-ring small{position:absolute;bottom:38px;font:500 .72rem/1 var(--cz-mono);color:var(--cz-muted-l)}
.au-ring b{margin-top:-10px}
.au-ring.is-ok{--au-col:var(--au-ok)}
.au-ring.is-warn{--au-col:var(--au-warn)}
.au-ring.is-fail{--au-col:var(--au-fail)}

.au-kick{font:500 .7rem/1.3 var(--cz-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cz-indigo-deep)}
.cz-page .au-title,.au-title{margin:8px 0 10px!important;font:700 clamp(1.25rem,2.2vw,1.7rem)/1.15 var(--cz-display)!important;letter-spacing:-.025em;color:var(--cz-ink-text)}
.au-url{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:.88rem;color:var(--cz-ink-text);word-break:break-all}
.au-url i{color:var(--cz-indigo-deep);font-size:.75rem}
.au-url span{color:var(--cz-muted-l);word-break:normal}
.au-counts{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0;list-style:none}
.au-counts li{display:inline-flex;align-items:baseline;gap:6px;padding:7px 13px;border-radius:999px;font-size:.84rem;font-weight:500}
.au-counts b{font:700 1rem/1 var(--cz-display)}
.au-counts .is-fail{background:var(--au-fail-bg);color:var(--au-fail)}
.au-counts .is-warn{background:var(--au-warn-bg);color:var(--au-warn)}
.au-counts .is-ok{background:var(--au-ok-bg);color:var(--au-ok)}

.au-head__cta{display:grid;gap:10px}
.au-cta2{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 16px;border-radius:999px;border:1px solid rgba(79,70,229,.35);background:#fff;color:var(--cz-indigo-deep);font:600 .88rem/1.25 var(--cz-body);text-align:center;cursor:pointer;transition:background .3s,border-color .3s}
.au-cta2:hover{background:#EEF0FF;border-color:var(--cz-indigo-deep)}
.au-mini{display:flex;justify-content:center;gap:14px}
.au-mini button{display:inline-flex;align-items:center;gap:6px;padding:6px 2px;border:0;background:none;color:var(--cz-muted-l);font:500 .8rem/1 var(--cz-body);cursor:pointer}
.au-mini button:hover{color:var(--cz-ink-text)}

.au-facts{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0;list-style:none}
.au-facts li{display:inline-flex;gap:8px;padding:8px 14px;border-radius:12px;background:#fff;border:1px solid var(--cz-line-l);font-size:.82rem}
.au-facts span{color:var(--cz-muted-l)}
.au-facts b{color:var(--cz-ink-text);font-weight:600;max-width:42ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.au-top{margin-top:16px;padding:22px clamp(20px,3vw,30px);border-radius:24px;background:var(--cz-deep);color:var(--cz-text)}
.cz-page .au-top h3,.au-top h3{display:flex;align-items:center;gap:10px;margin:0 0 12px!important;font:600 1rem/1.3 var(--cz-display)!important;color:#fff}
.au-top h3 i{color:var(--cz-cyan)}
.au-top ol{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px;margin:0;padding:0;list-style:none;counter-reset:au}
.au-top li a{display:flex;align-items:flex-start;gap:10px;height:100%;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(165,180,252,.14);color:var(--cz-text);font-size:.9rem;line-height:1.4;text-decoration:none;transition:background .3s,border-color .3s}
.au-top li a:hover{background:rgba(255,255,255,.08);border-color:rgba(165,180,252,.35)}
.au-top li a i{margin-top:3px}
.au-top li.is-fail i{color:#FB7185}
.au-top li.is-warn i{color:#FBBF24}

/* PageSpeed */
.au-speed{margin-top:16px;padding:22px clamp(20px,3vw,30px);border-radius:24px;background:#fff;border:1px solid var(--cz-line-l)}
.au-speed__h{display:flex;align-items:center;justify-content:space-between;gap:16px}
.cz-page .au-speed__h h3,.au-speed__h h3{display:flex;align-items:center;gap:10px;margin:0!important;font:600 1rem/1.3 var(--cz-display)!important;color:var(--cz-ink-text)}
.au-speed__h h3 i{color:var(--cz-indigo-deep)}
.au-speed__score{font:700 1.9rem/1 var(--cz-display);letter-spacing:-.03em}
.au-speed__score small{font:500 .7rem/1 var(--cz-mono);color:var(--cz-muted-l);margin-left:2px}
.au-speed__score.is-ok{color:var(--au-ok)}
.au-speed__score.is-warn{color:var(--au-warn)}
.au-speed__score.is-fail{color:var(--au-fail)}
.au-speed__wait{display:grid;gap:12px;margin:14px 0 0!important;font-size:.9rem;color:var(--cz-muted-l)}
.au-speed__wait a{color:var(--cz-indigo-deep);font-weight:600}
.au-bar{position:relative;display:block;height:6px;border-radius:6px;background:#ECEEF6;overflow:hidden}
.au-bar i{position:absolute;inset:0 auto 0 0;width:35%;border-radius:6px;background:linear-gradient(90deg,#4F46E5,#22D3EE);animation:auBar 1.6s ease-in-out infinite}
@keyframes auBar{0%{left:-35%}100%{left:100%}}
.au-speed__m{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:16px 0 0;padding:0;list-style:none}
.au-speed__m li{display:grid;gap:3px;padding:12px;border-radius:14px;background:var(--cz-paper);border-top:3px solid #D8DCEB}
.au-speed__m li.is-ok{border-top-color:var(--au-ok)}
.au-speed__m li.is-warn{border-top-color:var(--au-warn)}
.au-speed__m li.is-fail{border-top-color:var(--au-fail)}
.au-speed__m span{font-size:.74rem;color:var(--cz-muted-l)}
.au-speed__m b{font:700 1.15rem/1.1 var(--cz-display);color:var(--cz-ink-text)}
.au-speed__m small{font-size:.7rem;color:#8A91AE}
.au-speed__field{margin:14px 0 0!important;font-size:.86rem;line-height:1.55;color:var(--cz-muted-l)}
.au-speed__field b{color:var(--cz-ink-text);font-weight:600}
.au-speed__ops{margin-top:12px;font-size:.86rem}
.au-speed__ops ul{display:grid;gap:4px;margin:6px 0 0;padding:0;list-style:none}
.au-speed__ops li{display:flex;justify-content:space-between;gap:12px;padding:8px 12px;border-radius:10px;background:var(--cz-paper);color:var(--cz-ink-text)}
.au-speed__ops li span{flex:none;font:600 .8rem/1.4 var(--cz-mono);color:var(--au-warn)}

/* grupy testów */
.au-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px;align-items:start}
.au-g{padding:20px clamp(16px,2.4vw,24px);border-radius:24px;background:#fff;border:1px solid var(--cz-line-l)}
.au-g__h{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 12px;margin-bottom:12px}
.cz-page .au-g__h h3,.au-g__h h3{margin:0!important;font:600 1rem/1.3 var(--cz-display)!important;color:var(--cz-ink-text)}
.au-g__score{font:700 1.1rem/1 var(--cz-display)}
.au-g__score.is-ok{color:var(--au-ok)}
.au-g__score.is-warn{color:var(--au-warn)}
.au-g__score.is-fail{color:var(--au-fail)}
.au-g__bar{grid-column:1/-1;height:5px;border-radius:5px;background:#ECEEF6;overflow:hidden}
.au-g__bar i{display:block;height:100%;border-radius:5px;background:currentColor;transform-origin:left;animation:auGrow 1s var(--cz-ease) both}
.au-g__bar.is-ok{color:var(--au-ok)}
.au-g__bar.is-warn{color:var(--au-warn)}
.au-g__bar.is-fail{color:var(--au-fail)}
@keyframes auGrow{from{transform:scaleX(0)}}

.au-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.au-i{border-radius:14px;background:var(--au-bg);transition:box-shadow .4s}
.au-i.is-fail{--au-bg:var(--au-fail-bg);--au-c:var(--au-fail)}
.au-i.is-warn{--au-bg:var(--au-warn-bg);--au-c:var(--au-warn)}
.au-i.is-ok{--au-bg:var(--au-ok-bg);--au-c:var(--au-ok)}
.au-i.is-info{--au-bg:var(--au-info-bg);--au-c:var(--au-info)}
.au-i.is-flash{box-shadow:0 0 0 3px var(--au-c)}
.au-i__h{display:grid;grid-template-columns:18px minmax(0,1fr) auto auto;align-items:start;gap:10px;padding:11px 14px;list-style:none;cursor:default}
details>.au-i__h{cursor:pointer}
.au-i__h::-webkit-details-marker{display:none}
.au-i__h>i:first-child{margin-top:2px;color:var(--au-c)}
.au-i__t{font-size:.9rem;line-height:1.4;color:var(--cz-ink-text);font-weight:500}
.au-i__s{padding:2px 8px;border-radius:999px;background:#fff;font:600 .62rem/1.5 var(--cz-mono);font-style:normal;letter-spacing:.06em;text-transform:uppercase;color:var(--au-c)}
.au-i__chev{margin-top:4px;font-size:.7rem;color:var(--cz-muted-l);transition:transform .3s}
.au-i details[open] .au-i__chev{transform:rotate(180deg)}
.au-i__b{padding:0 14px 13px 42px;font-size:.86rem;line-height:1.55;color:#3D4560}
.au-i__d{margin:0 0 6px!important;word-break:break-word}
.au-i__fix{margin:0!important}
.au-i__fix b{color:var(--cz-ink-text)}
.au-g__ok{margin-top:8px}
.au-g__ok>summary{display:inline-flex;align-items:center;gap:6px;padding:6px 2px;color:var(--au-ok);font-size:.84rem;font-weight:500;cursor:pointer;list-style:none}
.au-g__ok>summary::-webkit-details-marker{display:none}
.au-g__ok>summary::before{content:"\f078";font:900 .65rem/1 "Font Awesome 7 Free","Font Awesome 6 Free";transition:transform .3s}
.au-g__ok[open]>summary::before{transform:rotate(180deg)}
.au-g__ok .au-list{margin-top:6px}

.au-note{display:flex;gap:10px;margin:18px 0 0!important;padding:14px 18px;border-radius:16px;background:#fff;border:1px dashed rgba(79,70,229,.3);font-size:.84rem;line-height:1.55;color:var(--cz-muted-l)}
.au-note i{margin-top:3px;color:var(--cz-indigo-deep)}

/* ── Responsywność ─────────────────────────────────────────── */
@media (max-width:1100px){
	.au-head{grid-template-columns:auto minmax(0,1fr)}
	.au-head__cta{grid-column:1/-1;grid-template-columns:1fr 1fr;align-items:center}
	.au-mini{grid-column:1/-1}
	.au-speed__m{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
	.au-groups{grid-template-columns:1fr}
}
@media (max-width:640px){
	.au-form__row{flex-wrap:wrap;padding:8px;border-radius:22px}
	.au-form__ic{display:none}
	.au-form__input{padding:12px 12px 8px;font-size:1rem}
	.au-form__btn{width:100%;justify-content:center;padding:15px 18px}
	.au-head{grid-template-columns:1fr;justify-items:start;text-align:left}
	.au-ring{width:124px;height:124px}
	.au-ring b{font-size:2.2rem}
	.au-ring small{bottom:30px}
	.au-head__cta{grid-template-columns:1fr;width:100%}
	.au-speed__m{grid-template-columns:repeat(2,minmax(0,1fr))}
	.au-speed__h{flex-wrap:wrap}
	.au-i__h{grid-template-columns:18px minmax(0,1fr) auto;padding:11px 12px}
	.au-i__s{display:none}
	.au-i__b{padding:0 12px 12px 40px}
	.au-facts b{max-width:24ch}
}
@media (prefers-reduced-motion:reduce){
	.au-res.is-in [data-au-body],.au-g__bar i,.au-bar i,.au-prog li.is-run i,.au-form.is-busy .au-form__btn i{animation:none}
	.au-ring__fg{transition:none}
}
