/*
 * Spectrum Start LP — styl 1:1 z quizem: tło #050505, Space Grotesk + DM Mono, karty z gradientem,
 * limonka #c6ff00 i róż #ff2d78. Wszystko pod .ssl-lp i z !important, bo motywy WP lubią nadpisywać.
 */
html body.ssl-lp { margin:0 !important; padding:0 !important; background:#050505 !important; background-color:#050505 !important; color:#fff !important; }
.ssl-lp { --bg-card:#0d0d0f; --bg-raised:#151517; --line:rgba(255,255,255,.09); --line-strong:rgba(255,255,255,.16); --text:#fff; --dim:#9aa1ac; --faint:#63666f; --lime:#c6ff00; --pink:#ff2d78;
  font-family:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif !important; font-size:16px !important; line-height:1.4 !important; -webkit-font-smoothing:antialiased; }
.ssl-lp .ssl-root, .ssl-lp .ssl-root *, .ssl-lp .ssl-root *::before, .ssl-lp .ssl-root *::after { box-sizing:border-box !important; font-family:inherit; }
.ssl-lp .ssl-root { max-width:1120px; margin:0 auto; padding:0 16px 56px; color:var(--text); }
.ssl-lp .ssl-root :where(h1,h2,h3,p,ul,ol,figure,blockquote,i) { margin:0; padding:0; color:inherit; text-transform:none; letter-spacing:normal; font-style:normal; background:none; border:0; }
.ssl-lp .ssl-root :where(a) { color:inherit; text-decoration:none; }
.ssl-lp .ssl-mono, .ssl-lp .ssl-eyebrow, .ssl-lp .ssl-kit-tag, .ssl-lp .ssl-btn, .ssl-lp .ssl-price, .ssl-lp .ssl-micro, .ssl-lp .ssl-note, .ssl-lp .ssl-header-link, .ssl-lp .ssl-brand span, .ssl-lp .ssl-step-n, .ssl-lp .ssl-stars, .ssl-lp .ssl-review figcaption, .ssl-lp .ssl-footer { font-family:"DM Mono",ui-monospace,"Courier New",monospace !important; }

/* header */
.ssl-lp .ssl-header { display:flex; align-items:center; justify-content:space-between; padding:20px 0; }
.ssl-lp .ssl-brand { display:flex; align-items:center; gap:10px; }
.ssl-lp .ssl-brand img { height:34px; width:auto; display:block; }
.ssl-lp .ssl-brand-dot { display:block; width:8px; height:8px; border-radius:50%; background:var(--lime) !important; box-shadow:0 0 12px rgba(198,255,0,.7); }
.ssl-lp .ssl-brand span { font-size:13px; letter-spacing:.14em; color:var(--dim); text-transform:uppercase; }
.ssl-lp .ssl-brand b { color:#fff; font-weight:600; }
.ssl-lp .ssl-header-link { font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim) !important; }
.ssl-lp .ssl-header-link:hover { color:#fff !important; }

/* hero */
.ssl-lp .ssl-hero { text-align:center; padding:48px 0 36px; position:relative; }
.ssl-lp .ssl-hero::before { content:""; position:absolute; inset:-40px -20px auto; height:340px; background:radial-gradient(circle at 50% 0%, rgba(198,255,0,.10) 0%, rgba(0,0,0,0) 60%); pointer-events:none; }
.ssl-lp .ssl-eyebrow { position:relative; display:inline-flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--pink); margin-bottom:18px; }
.ssl-lp .ssl-eyebrow i, .ssl-lp .ssl-kit-tag i { display:block; width:16px; height:1px; background:currentColor !important; }
.ssl-lp .ssl-root h1 { position:relative; font-size:clamp(38px,7vw,68px); line-height:1.05; font-weight:600; letter-spacing:-.03em; color:#fff; max-width:820px; margin:0 auto 18px; }
.ssl-lp .ssl-sub { position:relative; font-size:clamp(15px,2.2vw,18px); line-height:1.6; color:var(--dim); max-width:640px; margin:0 auto 28px; }
.ssl-lp .ssl-note { font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--faint); margin-top:16px; }

/* buttons (jak sq-btn / sq-cta-primary) */
.ssl-lp .ssl-btn { display:inline-flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; line-height:1.2; padding:16px 26px; border-radius:12px; border:0; cursor:pointer; text-align:center; transition:opacity .15s ease, transform .1s ease; text-decoration:none !important; }
.ssl-lp .ssl-btn:hover { opacity:.9; }
.ssl-lp .ssl-btn:active { transform:scale(.98); }
.ssl-lp .ssl-btn-lime { background:var(--lime) !important; color:#050505 !important; }
.ssl-lp .ssl-btn-kit { background:var(--kit) !important; color:var(--kit-ink) !important; }
.ssl-lp .ssl-btn-block { display:flex; width:100%; }
.ssl-lp .ssl-btn-off { background:var(--bg-raised) !important; color:var(--faint) !important; cursor:not-allowed; border:1px solid var(--line); }

/* kits */
.ssl-lp .ssl-kits { display:grid; grid-template-columns:1fr; gap:20px; padding:12px 0 24px; scroll-margin-top:12px; }
@media (min-width:860px) { .ssl-lp .ssl-kits { grid-template-columns:repeat(3,1fr); gap:22px; } }
.ssl-lp .ssl-kit { position:relative; display:flex; flex-direction:column; background:linear-gradient(180deg,var(--bg-raised) 0%,var(--bg-card) 100%); border:1px solid var(--line); border-radius:20px; overflow:hidden; }
.ssl-lp .ssl-kit::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 100% 0%, rgba(var(--kit-rgb,198,255,0),.16) 0%, rgba(0,0,0,0) 55%); pointer-events:none; }
.ssl-lp .ssl-badge { position:absolute; top:16px; left:16px; z-index:2; background:var(--kit); color:var(--kit-ink); font-family:"DM Mono",monospace; font-weight:700; font-size:12px; letter-spacing:.06em; padding:7px 10px; border-radius:8px; }
.ssl-lp .ssl-kit-img { position:relative; margin:16px 16px 0; aspect-ratio:1/1; border-radius:14px; border:1px solid var(--line); background:var(--bg-raised); display:flex; align-items:center; justify-content:center; padding:12px; overflow:hidden; }
.ssl-lp .ssl-kit-img img { width:100%; height:100%; object-fit:contain; object-position:center; display:block; }
.ssl-lp .ssl-kit-body { position:relative; display:flex; flex-direction:column; flex:1; padding:22px 24px 26px; }
.ssl-lp .ssl-kit-tag { display:flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--kit); margin-bottom:12px; line-height:1.4; }
.ssl-lp .ssl-kit-tag i { flex:0 0 16px; }
.ssl-lp .ssl-root .ssl-kit h2 { font-size:26px; font-weight:600; letter-spacing:-.01em; color:#fff; margin-bottom:8px; }
.ssl-lp .ssl-kit-desc { font-size:14px; line-height:1.6; color:var(--dim); margin-bottom:18px; }
.ssl-lp .ssl-items { list-style:none; margin:0 0 20px !important; padding:0 !important; display:flex; flex-direction:column; gap:8px; font-size:14px; line-height:1.4; }
.ssl-lp .ssl-items li { display:flex; align-items:flex-start; gap:10px; margin:0 !important; padding:10px 12px !important; list-style:none; background:rgba(255,255,255,.02); border:1px solid var(--line); border-radius:10px; }
.ssl-lp .ssl-items li::before { content:none !important; }
.ssl-lp .ssl-dot { flex:0 0 8px; width:8px; height:8px; border-radius:50%; background:var(--kit) !important; margin-top:6px; box-shadow:0 0 8px rgba(var(--kit-rgb),.6); }
.ssl-lp .ssl-items strong { color:#fff; font-weight:600; }
.ssl-lp .ssl-price { margin-top:auto; display:flex; align-items:baseline; gap:12px; margin-bottom:16px; padding-top:6px; }
.ssl-lp .ssl-price-old { color:var(--faint); font-size:15px; text-decoration:line-through; }
.ssl-lp .ssl-price-new { color:var(--kit); font-size:30px; font-weight:700; }
.ssl-lp .ssl-price .woocommerce-Price-amount, .ssl-lp .ssl-price bdi { color:inherit; font-size:inherit; font-weight:inherit; font-family:inherit; }
.ssl-lp .ssl-micro { font-size:11px; letter-spacing:.04em; color:var(--faint); text-align:center; margin-top:12px; line-height:1.5; }
.ssl-lp .ssl-soldout { font-size:14px; color:var(--dim); margin:auto 0 14px; }

/* sections */
.ssl-lp .ssl-root h2.ssl-h2 { font-size:clamp(26px,4vw,36px); font-weight:600; letter-spacing:-.01em; color:#fff; text-align:center; margin-bottom:28px; }
.ssl-lp .ssl-how, .ssl-lp .ssl-about { padding:52px 0 8px; }
.ssl-lp .ssl-steps { list-style:none; margin:0 !important; padding:0 !important; display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:760px) { .ssl-lp .ssl-steps { grid-template-columns:repeat(3,1fr); } }
.ssl-lp .ssl-steps li { list-style:none; background:linear-gradient(180deg,var(--bg-raised),var(--bg-card)); border:1px solid var(--line); border-radius:16px; padding:24px; margin:0 !important; }
.ssl-lp .ssl-step-n { display:inline-flex; width:30px; height:30px; border-radius:8px; background:var(--lime); color:#050505; font-weight:700; font-size:13px; align-items:center; justify-content:center; margin-bottom:14px; }
.ssl-lp .ssl-root h3 { font-size:18px; font-weight:600; color:#fff; margin-bottom:6px; }
.ssl-lp .ssl-steps p, .ssl-lp .ssl-about-grid p { font-size:14px; line-height:1.6; color:var(--dim); }
.ssl-lp .ssl-about-grid { display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:760px) { .ssl-lp .ssl-about-grid { grid-template-columns:repeat(3,1fr); } }
.ssl-lp .ssl-about-grid > div { border-left:2px solid var(--lime); padding:2px 0 2px 16px; }

/* reviews carousel */
.ssl-lp .ssl-reviews { padding:60px 0 8px; }
.ssl-lp .ssl-marquee { overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); }
.ssl-lp .ssl-track { display:flex; gap:16px; width:max-content; animation:ssl-scroll 80s linear infinite; }
.ssl-lp .ssl-marquee:hover .ssl-track { animation-play-state:paused; }
@keyframes ssl-scroll { from { transform:translateX(0); } to { transform:translateX(calc(-50% - 8px)); } }
.ssl-lp .ssl-review { flex:0 0 280px; background:linear-gradient(180deg,var(--bg-raised),var(--bg-card)); border:1px solid var(--line); border-radius:16px; padding:16px; display:flex; flex-direction:column; gap:10px; overflow:hidden; }
@media (min-width:760px) { .ssl-lp .ssl-review { flex-basis:310px; } }
.ssl-lp .ssl-review-photo { aspect-ratio:4/5; border-radius:10px; overflow:hidden; background:var(--bg-raised); border:1px solid var(--line); }
.ssl-lp .ssl-review-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.ssl-lp .ssl-stars { color:var(--lime); font-size:14px; letter-spacing:2px; }
.ssl-lp .ssl-review blockquote { font-size:14px; line-height:1.6; color:var(--text); quotes:none; }
.ssl-lp .ssl-review figcaption { margin-top:auto; font-size:11px; letter-spacing:.04em; color:var(--faint); display:flex; flex-wrap:wrap; gap:4px 6px; }
.ssl-lp .ssl-review figcaption strong { color:#fff; font-weight:500; }
.ssl-lp .ssl-prod { flex-basis:100%; }
@media (prefers-reduced-motion:reduce) { .ssl-lp .ssl-track { animation:none; } .ssl-lp .ssl-marquee { overflow-x:auto; -webkit-mask-image:none; mask-image:none; } .ssl-lp .ssl-review[aria-hidden="true"] { display:none; } }

.ssl-lp .ssl-final { text-align:center; padding:60px 0 16px; }
.ssl-lp .ssl-footer { border-top:1px solid var(--line); margin-top:44px; padding-top:22px; font-size:11px; line-height:1.7; letter-spacing:.02em; color:var(--faint); text-align:center; display:flex; flex-direction:column; gap:6px; }
.ssl-lp .ssl-footer a { text-decoration:underline !important; text-underline-offset:3px; }

.ssl-lp .ssl-item-t { min-width:0; overflow-wrap:anywhere; }
.ssl-lp .ssl-root { overflow-x:clip; }
html body.ssl-lp { overflow-x:hidden !important; }

.ssl-lp .ssl-flavors-label { font-family:"DM Mono",monospace !important; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--faint); margin-bottom:8px; }
.ssl-lp .ssl-flavors { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.ssl-lp .ssl-chip { appearance:none; -webkit-appearance:none; cursor:pointer; background:rgba(255,255,255,.02) !important; color:var(--text) !important; border:1px solid var(--line) !important; border-radius:10px; padding:9px 12px; font-family:inherit; font-size:13px; line-height:1.2; transition:border-color .15s ease, background .15s ease; }
.ssl-lp .ssl-chip:hover { border-color:var(--line-strong) !important; background:rgba(255,255,255,.045) !important; }
.ssl-lp .ssl-chip.is-on { border-color:var(--kit) !important; background:rgba(var(--kit-rgb),.12) !important; color:#fff !important; }
.ssl-lp .ssl-kit-tag i { background:var(--kit) !important; }
