/*
Theme Name: Suplo.OS
Theme URI: https://suplosfera.pl
Author: Suplosfera
Description: Własny, technologiczny motyw WooCommerce dla Suplosfery.
Version: 0.10.0
Requires at least: 6.8
Tested up to: 7.0
Requires PHP: 8.2
Text Domain: suplo-os
*/

:root {
  --suplo-bg: #070a0f;
  --suplo-panel: #090d12;
  --suplo-panel-2: #0d1516;
  --suplo-line: #26332e;
  --suplo-line-strong: #3a5148;
  --suplo-text: #eef4f0;
  --suplo-muted: #81958c;
  --suplo-dim: #53675f;
  --suplo-accent: #76ffc8;
  --suplo-dark: #06100c;
  --suplo-max: 1800px;
  --suplo-sans: Arial, Helvetica, sans-serif;
  --suplo-mono: "Courier New", Courier, monospace;
}

* { box-sizing: border-box; }
html { overflow-x: hidden; scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: var(--suplo-bg); color: var(--suplo-text); font-family: var(--suplo-sans); font-size: 17px; line-height: 1.62; }
body.admin-bar .suplo-topbar { top: 32px; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; height: auto; }
.screen-reader-text { width: 1px; height: 1px; position: absolute; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.suplo-skip-link { position: fixed; z-index: 9999; left: 16px; top: -100px; padding: 12px 18px; background: var(--suplo-accent); color: var(--suplo-dark); }
.suplo-skip-link:focus { top: 16px; }
:focus-visible { outline: 2px solid var(--suplo-accent); outline-offset: 4px; }

.suplo-topbar { min-height: 68px; display: flex; align-items: center; gap: 32px; position: sticky; z-index: 80; top: 0; padding: 0 28px; border-bottom: 1px solid var(--suplo-line); background: rgba(7, 10, 15, .93); backdrop-filter: blur(16px); }
.suplo-logo { min-height: 48px; display: grid; grid-template-columns: 34px auto; align-items: center; column-gap: 9px; }
.suplo-logo > span { grid-row: 1 / 3; color: var(--suplo-accent); font-size: 28px; }
.suplo-logo b { align-self: end; font: 700 15px/1 var(--suplo-mono); letter-spacing: .12em; }
.suplo-logo small { align-self: start; color: var(--suplo-muted); font: 12px/1.2 var(--suplo-mono); }
.suplo-system-status { display: flex; align-items: center; gap: 8px; color: var(--suplo-accent); font: 13px var(--suplo-mono); }
.suplo-system-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--suplo-accent); box-shadow: 0 0 14px var(--suplo-accent); }
.suplo-system-status span { color: var(--suplo-dim); }
.suplo-nav { display: flex; align-items: center; gap: 28px; margin-left: auto; }
.suplo-nav a, .suplo-cart-link, .suplo-search-link { min-height: 46px; display: inline-flex; align-items: center; color: #b7c5bf; font: 13px var(--suplo-mono); }
.suplo-nav a:hover, .suplo-nav a:focus-visible { color: var(--suplo-accent); }
.suplo-category-menu { position: static; }
.suplo-category-menu summary { min-height: 46px; display: inline-flex; align-items: center; gap: 8px; color: #b7c5bf; cursor: pointer; list-style: none; font: 13px var(--suplo-mono); }
.suplo-category-menu summary::-webkit-details-marker { display: none; }
.suplo-category-menu summary::after { content: "+"; color: var(--suplo-accent); }
.suplo-category-menu[open] summary::after { content: "−"; }
.suplo-category-menu summary:hover, .suplo-category-menu summary:focus-visible { color: var(--suplo-accent); }
.suplo-mega-menu { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); position: absolute; left: 0; right: 0; top: 100%; border: 1px solid var(--suplo-line-strong); padding: 18px; background: rgba(7, 10, 15, .98); box-shadow: 0 24px 60px rgba(0,0,0,.45); }
.suplo-mega-menu a { min-height: 96px; display: grid; grid-template-columns: 34px 1fr; align-content: center; column-gap: 10px; border: 1px solid var(--suplo-line); padding: 14px; }
.suplo-mega-menu a:hover { border-color: var(--suplo-accent); background: rgba(118,255,200,.035); }
.suplo-mega-menu span { grid-row: 1 / 3; color: var(--suplo-accent); font: 18px var(--suplo-mono); }
.suplo-mega-menu b { color: var(--suplo-text); font: 700 16px var(--suplo-sans); }
.suplo-mega-menu small { color: var(--suplo-muted); font: 12px var(--suplo-mono); }
.suplo-header-actions { display: flex; align-items: center; gap: 10px; }
.suplo-header-actions:empty { display: none; }
.suplo-search-link { width: 44px; justify-content: center; border: 1px solid var(--suplo-line-strong); color: var(--suplo-accent); font-size: 22px; }
.suplo-cart-link { padding: 0 14px; border: 1px solid var(--suplo-accent); color: var(--suplo-accent); }
.suplo-menu-toggle { display: none; min-height: 44px; margin-left: auto; border: 1px solid var(--suplo-accent); padding: 0 13px; background: transparent; color: var(--suplo-accent); font: 12px var(--suplo-mono); }

.suplo-main, .suplo-commerce-main { max-width: var(--suplo-max); margin: 0 auto; }
.suplo-hero { min-height: 760px; display: grid; grid-template-columns: minmax(430px, 1.05fr) minmax(500px, 1.05fr) 230px; border-inline: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); background-image: linear-gradient(rgba(118,255,200,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(118,255,200,.035) 1px, transparent 1px); background-size: 36px 36px; }
.suplo-hero-copy { display: flex; flex-direction: column; justify-content: center; padding: 72px 5vw; border-right: 1px solid var(--suplo-line); }
.suplo-kicker { display: flex; align-items: center; gap: 15px; }
.suplo-kicker span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid var(--suplo-accent); border-radius: 50%; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-kicker p { color: var(--suplo-muted); font: 13px/1.55 var(--suplo-mono); letter-spacing: .04em; }
.suplo-hero h1 { max-width: 900px; margin: 68px 0 26px; font: 700 clamp(58px, 5.8vw, 100px)/.88 var(--suplo-sans); letter-spacing: -.075em; }
.suplo-hero h1 em { color: var(--suplo-accent); font-style: normal; }
.suplo-hero-copy > p { max-width: 670px; margin: 0; color: #b0beb8; font-size: 19px; line-height: 1.7; }
.suplo-actions { display: flex; align-items: center; gap: 28px; margin-top: 34px; }
.suplo-actions > a:not(.suplo-solid-button) { color: #b7c5bf; font: 13px var(--suplo-mono); }
.suplo-solid-button { min-height: 58px; display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 20px; background: var(--suplo-accent); color: var(--suplo-dark); font: 700 13px var(--suplo-mono); }
.suplo-outline-button { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--suplo-accent); padding: 0 15px; color: var(--suplo-accent); font: 700 12px var(--suplo-mono); }
.suplo-solid-button:hover, .suplo-outline-button:hover { filter: brightness(.9); }
.suplo-privacy { margin-top: 36px; color: var(--suplo-muted); font: 12px var(--suplo-mono); }

.suplo-orbital { min-height: 620px; position: relative; overflow: hidden; background: radial-gradient(circle at center, #15332b 0, #0a1113 38%, #070a0f 70%); }
.suplo-radar { width: 320px; height: 320px; display: grid; place-items: center; position: absolute; left: 50%; top: 50%; overflow: hidden; transform: translate(-50%, -50%); border: 1px solid #466b5d; border-radius: 50%; box-shadow: 0 0 70px rgba(118,255,200,.08), inset 0 0 50px rgba(118,255,200,.035); }
.suplo-radar::before, .suplo-radar::after { content: ""; position: absolute; border: 1px solid #263b34; border-radius: 50%; }
.suplo-radar::before { width: 225px; height: 225px; }
.suplo-radar::after { width: 120px; height: 120px; }
.suplo-radar > i { width: 1px; height: 100%; position: absolute; z-index: 2; background: #355047; }
.suplo-radar > i:nth-child(2) { transform: rotate(60deg); }
.suplo-radar > i:nth-child(3) { transform: rotate(120deg); }
.suplo-radar-sweep { position: absolute; z-index: 1; inset: 0; border-radius: 50%; background: conic-gradient(from 0deg, transparent 0 72%, rgba(118,255,200,.03) 80%, rgba(118,255,200,.38) 98%, var(--suplo-accent) 100%); animation: suplo-radar-rotate 4.6s linear infinite; transform-origin: center; }
.suplo-radar-sweep::after { content: ""; width: 50%; height: 2px; position: absolute; right: 0; top: calc(50% - 1px); background: linear-gradient(90deg, transparent, var(--suplo-accent)); box-shadow: 0 0 14px rgba(118,255,200,.85); }
.suplo-radar-mark { z-index: 3; color: var(--suplo-accent); font: 76px var(--suplo-sans); text-shadow: 0 0 28px rgba(118,255,200,.22); }
.suplo-radar > small { position: absolute; z-index: 3; bottom: 80px; color: #91a89e; text-align: center; font: 12px/1.45 var(--suplo-mono); }
@keyframes suplo-radar-rotate { to { transform: rotate(360deg); } }
.suplo-node { min-width: 145px; min-height: 54px; display: grid; grid-template-columns: 42px 1fr; align-items: center; position: absolute; z-index: 4; border: 1px solid #3b5149; padding: 9px; background: rgba(7,12,14,.9); text-align: left; }
.suplo-node b { grid-row: 1 / 3; color: var(--suplo-accent); font: 20px var(--suplo-mono); }
.suplo-node span { font: 12px var(--suplo-mono); }
.suplo-node i { color: #91a89e; font: 11px var(--suplo-mono); font-style: normal; }
.suplo-node-0 { left: 4%; top: 7%; }
.suplo-node-1 { right: 4%; top: 7%; }
.suplo-node-2 { left: 1.5%; top: 31%; }
.suplo-node-3 { right: 1.5%; top: 31%; }
.suplo-node-4 { left: 1.5%; bottom: 31%; }
.suplo-node-5 { right: 1.5%; bottom: 31%; }
.suplo-node-6 { left: 4%; bottom: 7%; }
.suplo-node-7 { right: 4%; bottom: 7%; }
.suplo-scanline { width: 100%; height: 1px; position: absolute; z-index: 3; top: 0; background: var(--suplo-accent); box-shadow: 0 0 20px var(--suplo-accent); opacity: .22; animation: suplo-scan 6s linear infinite; }
@keyframes suplo-scan { to { top: 100%; } }

.suplo-live-panel { display: flex; flex-direction: column; border-left: 1px solid var(--suplo-line); }
.suplo-live-panel > span { padding: 20px 15px; color: var(--suplo-muted); font: 12px var(--suplo-mono); }
.suplo-live-panel > div { padding: 26px 15px; border-top: 1px solid var(--suplo-line); }
.suplo-live-panel small { display: block; color: var(--suplo-muted); font: 12px var(--suplo-mono); }
.suplo-live-panel b { display: block; margin-top: 8px; font: 30px var(--suplo-sans); overflow-wrap: anywhere; }
.suplo-live-panel b.ok { color: var(--suplo-accent); }
.suplo-live-panel b.muted { color: #788a82; }
.suplo-live-panel p { margin: auto 0 0; padding: 18px; border-top: 1px solid var(--suplo-line); color: #aab9b2; font: 12px/1.65 var(--suplo-mono); }
.suplo-live-panel p i { width: 7px; height: 7px; display: inline-block; margin-right: 5px; border-radius: 50%; background: var(--suplo-accent); }

.suplo-command { min-height: 420px; display: grid; grid-template-columns: .72fr 1.28fr; align-content: center; gap: 22px 70px; border-inline: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); padding: 68px clamp(22px, 5vw, 80px); background: #0c1116; }
.suplo-command > header { grid-row: 1 / 4; align-self: center; }
.suplo-command > header span { color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-command h2 { margin: 18px 0; font-size: clamp(42px, 5vw, 72px); line-height: .95; letter-spacing: -.055em; }
.suplo-command > header p { max-width: 520px; margin: 0; color: #a9b8b1; font-size: 18px; }
.suplo-command form { display: grid; grid-template-columns: 1fr auto; align-items: stretch; border: 1px solid var(--suplo-accent); background: #070a0f; box-shadow: 0 0 40px rgba(118,255,200,.07); }
.suplo-command input { min-width: 0; min-height: 72px; border: 0; padding: 0 22px; outline: 0; background: transparent; color: #fff; font: 18px var(--suplo-sans); }
.suplo-command input::placeholder { color: #789087; }
.suplo-command button { min-width: 135px; border: 0; border-left: 1px solid var(--suplo-accent); padding: 0 20px; background: var(--suplo-accent); color: var(--suplo-dark); font: 700 12px var(--suplo-mono); }
.suplo-search-suggestions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.suplo-search-suggestions span { width: 100%; color: #8fa198; font: 12px var(--suplo-mono); }
.suplo-search-suggestions a { min-height: 42px; display: inline-flex; align-items: center; border: 1px solid var(--suplo-line-strong); padding: 0 12px; color: #b7c5bf; font: 11px var(--suplo-mono); }
.suplo-search-suggestions a:hover { border-color: var(--suplo-accent); color: var(--suplo-accent); }
.suplo-search-note { margin: 0; color: #768b82; font: 12px/1.6 var(--suplo-mono); }
.suplo-search-context { padding: 24px 30px; border-bottom: 1px solid var(--suplo-line); background: rgba(118,255,200,.035); }
.suplo-search-context strong { color: var(--suplo-accent); font: 13px var(--suplo-mono); }
.suplo-search-context p { max-width: 850px; margin: 8px 0 0; color: #9eafa7; font-size: 14px; }
.suplo-search-context a { display: inline-flex; margin-top: 12px; border-bottom: 1px solid currentColor; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-search-context--need { border-left: 3px solid var(--suplo-accent); background: linear-gradient(90deg, rgba(118,255,200,.1), rgba(118,255,200,.025)); }
.suplo-search-context__actions { display: flex; flex-wrap: wrap; gap: 6px 24px; }

/* Potrzeby */
.suplo-needs-main, .suplo-need-landing { max-width: var(--suplo-max); margin: 0 auto; border-inline: 1px solid var(--suplo-line); }
.suplo-needs-hero { min-height: 500px; display: grid; grid-template-columns: 1.2fr .8fr; gap: 70px; align-items: end; padding: 80px clamp(24px, 6vw, 110px); border-bottom: 1px solid var(--suplo-line); background-image: radial-gradient(circle at 78% 40%, rgba(118,255,200,.12), transparent 28%), linear-gradient(rgba(118,255,200,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(118,255,200,.035) 1px, transparent 1px); background-size: auto, 36px 36px, 36px 36px; }
.suplo-needs-hero span, .suplo-need-hero span, .suplo-need-products header span, .suplo-related-needs > header span { color: var(--suplo-accent); font: 12px var(--suplo-mono); letter-spacing: .06em; }
.suplo-needs-hero h1 { margin: 34px 0 0; font-size: clamp(58px, 7vw, 112px); line-height: .86; letter-spacing: -.07em; }
.suplo-needs-hero h1 em { color: var(--suplo-accent); font-style: normal; }
.suplo-needs-hero > p { max-width: 650px; margin: 0; color: #b7c5bf; font-size: 20px; line-height: 1.72; }
.suplo-needs-index { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.suplo-need-index-card { min-height: 380px; display: flex; flex-direction: column; padding: 30px; border-right: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); background: var(--suplo-panel); }
.suplo-need-index-card:hover { background: linear-gradient(145deg, rgba(118,255,200,.09), var(--suplo-panel) 55%); }
.suplo-need-index-card header { display: flex; justify-content: space-between; gap: 14px; color: var(--suplo-accent); font: 11px var(--suplo-mono); }
.suplo-need-index-card header b { color: var(--suplo-muted); font-weight: 400; }
.suplo-need-index-card h2 { margin: 60px 0 18px; font-size: 30px; line-height: 1.04; letter-spacing: -.035em; }
.suplo-need-index-card p { margin: 0; color: #9eafa7; font-size: 15px; }
.suplo-need-index-card > strong { margin-top: auto; padding-top: 30px; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-needs-disclaimer { display: grid; grid-template-columns: .35fr 1fr; gap: 30px; padding: 36px clamp(24px, 6vw, 110px); background: rgba(118,255,200,.035); }
.suplo-needs-disclaimer strong { color: var(--suplo-accent); font: 13px var(--suplo-mono); text-transform: uppercase; }
.suplo-needs-disclaimer p { max-width: 900px; margin: 0; color: #aebdb6; }

.suplo-need-hero { min-height: 470px; display: grid; grid-template-columns: 1fr 260px; align-items: end; gap: 60px; padding: 70px clamp(24px, 6vw, 110px); border-bottom: 1px solid var(--suplo-line); background-image: radial-gradient(circle at 85% 30%, rgba(118,255,200,.14), transparent 25%), linear-gradient(rgba(118,255,200,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(118,255,200,.03) 1px, transparent 1px); background-size: auto, 36px 36px, 36px 36px; }
.suplo-need-hero > div > a { display: inline-block; margin-bottom: 46px; color: #9aada4; font: 12px var(--suplo-mono); }
.suplo-need-hero > div > span { display: block; }
.suplo-need-hero h1 { max-width: 1000px; margin: 24px 0 0; font-size: clamp(58px, 7vw, 108px); line-height: .88; letter-spacing: -.07em; }
.suplo-need-hero aside { border: 1px solid var(--suplo-line-strong); padding: 24px; background: rgba(7,10,15,.82); }
.suplo-need-hero aside b { display: block; color: var(--suplo-accent); font: 52px/.9 var(--suplo-mono); }
.suplo-need-hero aside span { display: block; margin-top: 16px; color: #c3cec9; font: 15px/1.5 var(--suplo-sans); }
.suplo-need-hero aside small { display: block; margin-top: 14px; color: var(--suplo-muted); font: 11px/1.5 var(--suplo-mono); }
.suplo-need-layout { display: grid; grid-template-columns: minmax(0, 920px) 240px; justify-content: center; gap: 80px; padding: 70px 28px 100px; }
.suplo-need-content { font-size: 18px; }
.suplo-need-content .suplo-need-lead { color: #c7d2cd; font-size: 22px; line-height: 1.7; }
.suplo-need-content h2 { margin: 58px 0 16px; font-size: clamp(32px, 3.3vw, 48px); line-height: 1.05; letter-spacing: -.035em; }
.suplo-need-content p, .suplo-need-content li { color: #aebdb6; }
.suplo-need-checklist { display: grid; gap: 1px; margin: 28px 0; padding: 1px; background: var(--suplo-line); counter-reset: need-check; list-style: none; }
.suplo-need-checklist li { min-height: 84px; display: grid; grid-template-columns: 54px 1fr; align-items: center; gap: 15px; padding: 16px 20px; background: var(--suplo-panel); counter-increment: need-check; }
.suplo-need-checklist li::before { content: counter(need-check, decimal-leading-zero); color: var(--suplo-accent); font: 18px var(--suplo-mono); }
.suplo-need-caution { margin: 26px 0; border-left: 3px solid #ffce76; padding: 23px 26px; background: rgba(255,206,118,.045); }
.suplo-need-caution strong { color: #ffce76; font: 12px var(--suplo-mono); text-transform: uppercase; }
.suplo-need-caution p { margin: 8px 0 0; }
.suplo-need-sources { padding-left: 20px; }
.suplo-need-sources a { color: var(--suplo-accent); text-decoration: underline; }
.suplo-need-side { height: max-content; display: grid; position: sticky; top: 100px; border: 1px solid var(--suplo-line); }
.suplo-need-side strong, .suplo-need-side a { min-height: 52px; display: flex; align-items: center; padding: 0 16px; border-bottom: 1px solid var(--suplo-line); }
.suplo-need-side strong { color: var(--suplo-accent); font: 11px var(--suplo-mono); }
.suplo-need-side a { color: #aebdb6; font: 13px var(--suplo-mono); }
.suplo-need-side a:hover { color: var(--suplo-accent); }
.suplo-need-products { border-top: 1px solid var(--suplo-line); }
.suplo-need-products > header { display: flex; align-items: end; justify-content: space-between; gap: 36px; padding: 62px clamp(24px, 5vw, 80px) 34px; }
.suplo-need-products > header h2, .suplo-related-needs h2 { margin: 16px 0 10px; font-size: clamp(38px, 5vw, 68px); line-height: .95; letter-spacing: -.05em; }
.suplo-need-products > header p { max-width: 700px; margin: 0; color: #9eafa7; }
.suplo-need-product-group { border-top: 1px solid var(--suplo-line); }
.suplo-need-product-group > header { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; padding: 26px clamp(24px, 3vw, 48px); background: #080c11; }
.suplo-need-product-group > header h3 { margin: 0; font-size: 25px; }
.suplo-need-product-group > header span { color: var(--suplo-muted); font: 12px var(--suplo-mono); }
.suplo-related-needs { border-top: 1px solid var(--suplo-line); }
.suplo-related-needs > header { padding: 64px clamp(24px, 5vw, 80px) 36px; }
.suplo-related-needs > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.suplo-related-needs > div a { min-height: 120px; display: grid; grid-template-columns: 1fr auto; align-content: center; gap: 10px; padding: 22px; border-right: 1px solid var(--suplo-line); border-top: 1px solid var(--suplo-line); }
.suplo-related-needs > div span { grid-column: 1 / -1; color: var(--suplo-accent); font: 11px var(--suplo-mono); }
.suplo-related-needs > div b { font-size: 18px; }
.suplo-related-needs > div a:hover { background: rgba(118,255,200,.045); color: var(--suplo-accent); }

.suplo-pathways { border-inline: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); }
.suplo-pathways > header, .suplo-guides-intro { display: grid; grid-template-columns: .72fr 1fr; gap: 24px 70px; padding: 68px clamp(22px, 5vw, 80px); }
.suplo-pathways > header span, .suplo-guides-intro span { color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-pathways h2, .suplo-guides-intro h2 { margin: 0; font-size: clamp(42px, 5vw, 72px); line-height: .95; letter-spacing: -.055em; }
.suplo-pathways > header p, .suplo-guides-intro p { max-width: 650px; margin: 0; color: #a9b8b1; font-size: 18px; }
.suplo-pathways > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--suplo-line); }
.suplo-pathways > div > a { min-height: 250px; display: flex; flex-direction: column; padding: 28px; border-right: 1px solid var(--suplo-line); background: var(--suplo-panel); }
.suplo-pathways > div > a:hover { background: var(--suplo-panel-2); box-shadow: inset 0 0 0 1px var(--suplo-accent); }
.suplo-pathways a > span { color: var(--suplo-accent); font: 22px var(--suplo-mono); }
.suplo-pathways a > strong { margin: 50px 0 10px; font-size: 23px; }
.suplo-pathways a > small { color: #9eafa7; font: 14px/1.6 var(--suplo-sans); }
.suplo-pathways a > b { margin-top: auto; color: var(--suplo-accent); font: 12px var(--suplo-mono); }

.suplo-category-hub { border-inline: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); }
.suplo-category-hub > header { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 50px; padding: 64px clamp(22px, 5vw, 80px); }
.suplo-category-hub > header span { grid-column: 1 / -1; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-category-hub h2 { margin: 0; font-size: clamp(42px, 5vw, 72px); line-height: .95; letter-spacing: -.055em; }
.suplo-category-hub > header p { max-width: 480px; margin: 0; align-self: end; color: var(--suplo-muted); }
.suplo-category-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--suplo-line); }
.suplo-category-grid > a { min-height: 235px; display: flex; flex-direction: column; padding: 24px; border-right: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); background: var(--suplo-panel); }
.suplo-category-grid > a:hover { background: var(--suplo-panel-2); box-shadow: inset 0 0 0 1px var(--suplo-accent); }
.suplo-category-grid span { color: var(--suplo-accent); font: 22px var(--suplo-mono); }
.suplo-category-grid h3 { margin: 35px 0 8px; font-size: 24px; line-height: 1.05; }
.suplo-category-grid p { margin: 0; color: #9eb0a8; font-size: 15px; line-height: 1.55; }
.suplo-category-grid small { margin-top: auto; color: var(--suplo-accent); font: 12px var(--suplo-mono); }

.suplo-explorer { display: grid; grid-template-columns: 220px 1fr; border-inline: 1px solid var(--suplo-line); }
.suplo-explorer > aside { padding: 28px 15px; border-right: 1px solid var(--suplo-line); }
.suplo-explorer > aside > span, .suplo-mini-status > span { color: var(--suplo-muted); font: 12px var(--suplo-mono); }
.suplo-explorer > aside > a { width: 100%; min-height: 60px; display: grid; grid-template-columns: 28px 1fr auto; align-items: center; border-bottom: 1px solid var(--suplo-line); color: #9bada5; font: 12px var(--suplo-mono); }
.suplo-explorer > aside > a.active, .suplo-explorer > aside > a:hover { color: var(--suplo-accent); }
.suplo-explorer > aside > a em { font-style: normal; }
.suplo-mini-status { margin-top: 42px; border: 1px solid var(--suplo-line); padding: 15px; }
.suplo-mini-status b { display: block; margin: 9px 0; color: var(--suplo-accent); font: 22px var(--suplo-mono); }
.suplo-mini-status small { color: #8fa39a; font: 12px var(--suplo-mono); }
.suplo-database > header { min-height: 66px; display: flex; align-items: center; gap: 22px; padding: 0 20px; border-bottom: 1px solid var(--suplo-line); font: 12px var(--suplo-mono); }
.suplo-database > header b { color: var(--suplo-accent); }
.suplo-database > header a { margin-left: auto; border: 1px solid #31463e; padding: 9px; color: #9badA5; }
.suplo-product-grid, ul.products { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 !important; padding: 0 !important; list-style: none; }
.suplo-product-grid::before, .suplo-product-grid::after, ul.products::before, ul.products::after { display: none !important; content: none !important; }
.suplo-formula-card, ul.products li.product.suplo-formula-card { width: auto !important; min-height: 510px; display: flex; flex-direction: column; float: none !important; margin: 0 !important; border-right: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); background: var(--suplo-panel); }
.suplo-card-code { min-height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 0 14px; border-bottom: 1px solid var(--suplo-line); color: #8da097; font: 12px var(--suplo-mono); }
.suplo-card-code span:last-child { color: var(--suplo-accent); }
.suplo-product-visual { min-height: 278px; display: block; padding: 14px; border-bottom: 1px solid var(--suplo-line); background: radial-gradient(circle at 50% 45%, #17342d, #090d12 68%); overflow: hidden; }
.suplo-image-plate { width: 100%; height: 250px; display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); place-items: center; overflow: hidden; border: 1px solid rgba(238,244,240,.72); border-radius: 14px; background: linear-gradient(145deg, #ffffff 0%, #f2f6f3 72%, #dce8e1 100%); box-shadow: 0 18px 34px rgba(0,0,0,.28), inset 0 0 0 1px rgba(10,35,27,.04); }
/* Constrain the grid item, including Woo's higher-specificity height:auto. */
.suplo-product-visual img, .woocommerce ul.products li.product .suplo-product-visual img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; margin: 0; box-sizing: border-box; object-fit: contain; object-position: center; padding: 16px; }
.suplo-product-visual:hover img { transform: none; }
.suplo-product-placeholder { width: 118px; height: 170px; display: grid; place-items: center; position: relative; border: 1px solid #4f7063; border-radius: 8px 8px 16px 16px; background: linear-gradient(145deg, #f2f7f4, #bad8cb); color: #12382d; box-shadow: 0 24px 50px rgba(0,0,0,.35); }
.suplo-product-placeholder::before { content: ""; width: 74px; height: 24px; position: absolute; top: -14px; border-radius: 5px 5px 2px 2px; background: #121b18; }
.suplo-product-placeholder b { font-size: 40px; }
.suplo-product-copy { padding: 18px; }
.suplo-product-copy > small { color: #91a49b; font: 12px var(--suplo-mono); text-transform: uppercase; }
.suplo-product-copy h3 { margin: 8px 0 18px; font-size: 20px; line-height: 1.15; }
.suplo-product-copy p { display: flex; justify-content: space-between; gap: 12px; margin: 0; border-top: 1px solid #1e2b26; padding: 10px 0; color: #8fa198; font: 12px var(--suplo-mono); }
.suplo-product-copy p b { color: #aab9b2; }
.suplo-formula-card > footer { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px; margin-top: auto; padding: 16px; border-top: 1px solid var(--suplo-line); }
.suplo-formula-card > footer strong { color: var(--suplo-accent); font-size: 19px; }
.suplo-formula-card > footer .suplo-outline-button { justify-self: end; }
.suplo-empty-state { min-height: 420px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(34px, 7vw, 100px); background-image: linear-gradient(rgba(118,255,200,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(118,255,200,.035) 1px, transparent 1px); background-size: 36px 36px; }
.suplo-empty-state > span { color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-empty-state h1, .suplo-empty-state h2 { max-width: 900px; margin: 22px 0; font-size: clamp(42px, 6vw, 76px); line-height: .95; letter-spacing: -.055em; }
.suplo-empty-state p { max-width: 680px; margin: 0 0 30px; color: var(--suplo-muted); }

.suplo-routine { min-height: 650px; display: grid; grid-template-columns: 90px .75fr 1.25fr; border: 1px solid var(--suplo-line); border-top: 0; }
.suplo-section-code { padding: 26px 15px; border-right: 1px solid var(--suplo-line); }
.suplo-section-code span { color: var(--suplo-accent); font: 11px var(--suplo-mono); writing-mode: vertical-rl; }
.suplo-section-code i { width: 1px; height: 180px; display: block; margin: 30px auto; background: var(--suplo-line); }
.suplo-routine-copy { display: flex; flex-direction: column; justify-content: center; padding: 5vw; border-right: 1px solid var(--suplo-line); }
.suplo-routine h2, .suplo-knowledge h2, .suplo-launch-note h2 { margin: 0; font-size: clamp(48px, 5vw, 78px); line-height: .9; letter-spacing: -.065em; }
.suplo-routine-copy p { color: #a4b4ad; font-size: 18px; line-height: 1.7; }
.suplo-routine-copy a { width: max-content; margin-top: 25px; border-bottom: 1px solid var(--suplo-accent); padding: 8px 0; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-info-matrix { display: grid; grid-template-columns: repeat(3, 1fr); background-image: linear-gradient(rgba(118,255,200,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(118,255,200,.04) 1px, transparent 1px); background-size: 35px 35px; }
.suplo-info-matrix article { min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 26px; border-right: 1px solid var(--suplo-line); }
.suplo-info-matrix span { color: var(--suplo-accent); font: 40px var(--suplo-mono); }
.suplo-info-matrix b { margin: 50px 0 10px; font: 15px var(--suplo-mono); }
.suplo-info-matrix p { color: #9eafa7; font-size: 16px; }

.suplo-knowledge { display: grid; grid-template-columns: 90px 1fr; border-inline: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); }
.suplo-knowledge > .suplo-section-code { grid-row: 1 / 3; }
.suplo-knowledge > header { display: flex; align-items: end; justify-content: space-between; gap: 50px; padding: 90px 5vw; }
.suplo-knowledge > header p { max-width: 480px; color: #a4b4ad; font-size: 18px; }
.suplo-knowledge-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--suplo-line); }
.suplo-knowledge-grid article { padding: 26px; border-right: 1px solid var(--suplo-line); }
.suplo-knowledge-grid article > span { color: #91a49b; font: 12px var(--suplo-mono); }
.suplo-knowledge-grid article > div { height: 245px; display: grid; place-items: center; position: relative; margin: 22px 0; border: 1px solid var(--suplo-line); background: radial-gradient(circle, #142a24, #090d12 70%); }
.suplo-knowledge-grid article > div i { width: 125px; height: 125px; position: absolute; border: 1px solid #324a40; border-radius: 50%; }
.suplo-knowledge-grid article > div i:nth-child(2) { width: 185px; height: 185px; }
.suplo-knowledge-grid article > div b { z-index: 2; color: var(--suplo-accent); font-size: 44px; }
.suplo-knowledge-grid h3 { min-height: 54px; font-size: 23px; line-height: 1.15; }
.suplo-knowledge-grid p { min-height: 74px; color: #9eafa7; font-size: 16px; }
.suplo-knowledge-grid article > a { border-bottom: 1px solid var(--suplo-accent); padding: 7px 0; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-disabled-link { color: var(--suplo-dim) !important; }
.suplo-launch-note { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 8vw; padding: 100px 7vw; border-inline: 1px solid var(--suplo-line); background: var(--suplo-panel-2); }
.suplo-launch-note > div > span { color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-launch-note p { color: #a4b4ad; font-size: 18px; line-height: 1.7; }

.suplo-footer { min-height: 160px; display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; align-items: center; gap: 40px; max-width: var(--suplo-max); margin: 0 auto; border: 1px solid var(--suplo-line); padding: 30px; color: #95a79f; font: 13px/1.65 var(--suplo-mono); }
.suplo-footer > div { display: flex; flex-direction: column; }
.suplo-footer b { color: var(--suplo-text); }
.suplo-footer nav { display: flex; flex-direction: column; gap: 6px; }
.suplo-footer nav a:hover, .suplo-footer > a { color: var(--suplo-accent); }

.suplo-content-main, .suplo-page-shell { max-width: 1500px; min-height: 65vh; margin: 0 auto; border-inline: 1px solid var(--suplo-line); }
.suplo-page-header { padding: 90px clamp(22px, 6vw, 90px) 60px; border-bottom: 1px solid var(--suplo-line); background-image: linear-gradient(rgba(118,255,200,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(118,255,200,.03) 1px, transparent 1px); background-size: 36px 36px; }
.suplo-page-header span { color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-page-header h1 { margin: 22px 0 0; font-size: clamp(48px, 7vw, 96px); line-height: .92; letter-spacing: -.065em; }
.suplo-entry-content { max-width: 920px; margin: 0 auto; padding: 60px 25px 100px; font-size: 18px; }
.suplo-entry-content a { color: var(--suplo-accent); text-decoration: underline; }
.suplo-entry-content > p:first-child, .suplo-legal-lead { color: #c4d0cb; font-size: 21px; line-height: 1.7; }
.suplo-entry-content h2 { margin: 56px 0 16px; font-size: clamp(30px, 3vw, 43px); line-height: 1.08; letter-spacing: -.03em; }
.suplo-entry-content h3 { margin: 34px 0 10px; font-size: 23px; line-height: 1.2; }
.suplo-entry-content li { margin: 8px 0; }
.suplo-entry-content hr { margin: 48px 0; border: 0; border-top: 1px solid var(--suplo-line); }
.suplo-info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 32px 0; border: 1px solid var(--suplo-line); background: var(--suplo-line); }
.suplo-info-card { min-height: 150px; padding: 24px; background: var(--suplo-panel); }
.suplo-info-card small { display: block; margin-bottom: 10px; color: var(--suplo-accent); font: 12px var(--suplo-mono); text-transform: uppercase; }
.suplo-info-card strong { display: block; margin-bottom: 6px; color: var(--suplo-text); font-size: 20px; }
.suplo-info-card p { margin: 0; color: #a9b8b1; }
.suplo-status-note, .suplo-legal-note { margin: 28px 0; border-left: 3px solid var(--suplo-accent); padding: 20px 22px; background: rgba(118,255,200,.045); }
.suplo-status-note strong, .suplo-legal-note strong { color: var(--suplo-accent); }
.suplo-legal-meta { color: var(--suplo-muted); font: 13px/1.7 var(--suplo-mono); }
.suplo-legal-table { width: 100%; margin: 24px 0; border-collapse: collapse; }
.suplo-legal-table th, .suplo-legal-table td { border: 1px solid var(--suplo-line); padding: 14px 16px; text-align: left; vertical-align: top; }
.suplo-legal-table th { width: 32%; color: var(--suplo-accent); font: 12px var(--suplo-mono); text-transform: uppercase; }
.suplo-form-template { margin: 28px 0; border: 1px solid var(--suplo-line-strong); padding: 28px; background: #0b1016; }
.suplo-form-template p { margin: 12px 0; }
.suplo-form-line { display: block; min-height: 30px; margin-top: 6px; border-bottom: 1px dotted #708078; }
.suplo-faq details { border-top: 1px solid var(--suplo-line); padding: 18px 0; }
.suplo-faq details:last-child { border-bottom: 1px solid var(--suplo-line); }
.suplo-faq summary { cursor: pointer; color: var(--suplo-text); font-weight: 700; font-size: 19px; }
.suplo-faq details[open] summary { color: var(--suplo-accent); }
.suplo-faq details p { color: #adbbb5; }
.suplo-article-meta { margin: 28px 0 0; color: #9aada4; font: 13px var(--suplo-mono); }
.suplo-knowledge-article .suplo-page-header h1 { max-width: 1150px; }
.suplo-knowledge-article .suplo-entry-content > p:first-child { color: #c4d0cb; font-size: 21px; line-height: 1.7; }
.suplo-knowledge-article .suplo-entry-content h2 { margin: 54px 0 14px; font-size: clamp(28px, 3vw, 42px); line-height: 1.1; letter-spacing: -.025em; }
.suplo-knowledge-note { margin: 60px 0 30px; border: 1px solid var(--suplo-line-strong); padding: 24px; background: var(--suplo-panel-2); }
.suplo-knowledge-note strong { color: var(--suplo-accent); font: 13px var(--suplo-mono); text-transform: uppercase; }
.suplo-knowledge-note p { margin: 10px 0 0; color: #aebdb6; }
.suplo-article-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.suplo-article-card { min-height: 330px; padding: 30px; border-right: 1px solid var(--suplo-line); border-bottom: 1px solid var(--suplo-line); }
.suplo-article-card small { color: var(--suplo-accent); font-family: var(--suplo-mono); }
.suplo-article-card h2 { font-size: 28px; line-height: 1.1; }
.suplo-article-card p { color: var(--suplo-muted); }
.suplo-article-card > a { min-height: 100%; display: flex; flex-direction: column; }
.suplo-article-card > a::after { content: "CZYTAJ  →"; margin-top: auto; padding-top: 24px; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-guides-intro { border-bottom: 1px solid var(--suplo-line); }

/* WooCommerce */
.woocommerce .woocommerce-breadcrumb, .woocommerce .woocommerce-result-count, .woocommerce .woocommerce-ordering, .woocommerce-notices-wrapper, .woocommerce-products-header { margin: 0; padding: 20px 30px; border-bottom: 1px solid var(--suplo-line); color: #9eafa7; font: 12px/1.6 var(--suplo-mono); }
.woocommerce-products-header__title { margin: 30px 0 10px; color: var(--suplo-text); font: 700 clamp(46px, 6vw, 80px)/.9 var(--suplo-sans); letter-spacing: -.06em; }
.suplo-category-rail { display: flex; gap: 8px; overflow-x: auto; padding: 14px 20px; border-bottom: 1px solid var(--suplo-line); scrollbar-width: thin; }
.suplo-category-rail a { min-height: 44px; display: inline-flex; flex: 0 0 auto; align-items: center; gap: 9px; border: 1px solid var(--suplo-line-strong); padding: 0 13px; color: #9eafa7; font: 12px var(--suplo-mono); }
.suplo-category-rail a:hover, .suplo-category-rail a.is-active { border-color: var(--suplo-accent); color: var(--suplo-accent); }
.suplo-category-rail span { color: var(--suplo-dim); }
.woocommerce .woocommerce-ordering select { min-height: 44px; border: 1px solid var(--suplo-line-strong); padding: 0 12px; background: var(--suplo-panel); color: var(--suplo-text); }
.woocommerce div.product { padding: 50px clamp(20px, 5vw, 80px) 100px; }
.woocommerce div.product div.images, .woocommerce div.product div.summary { margin-bottom: 50px; }
.woocommerce div.product .product_title { font-size: clamp(42px, 5vw, 74px); line-height: .95; letter-spacing: -.06em; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--suplo-accent); font-size: 28px; }
.woocommerce div.product .woocommerce-product-gallery { padding: 16px; border: 1px solid var(--suplo-line); background: radial-gradient(circle at 50% 45%, #17342d, #090d12 68%); }
.woocommerce div.product .woocommerce-product-gallery__wrapper { overflow: hidden; border: 1px solid rgba(238,244,240,.72); border-radius: 18px; background: linear-gradient(145deg, #ffffff 0%, #f2f6f3 72%, #dce8e1 100%); box-shadow: 0 22px 46px rgba(0,0,0,.3); }
.woocommerce div.product .woocommerce-product-gallery__image { display: grid; place-items: center; background: transparent; }
.woocommerce div.product .woocommerce-product-gallery__image img { width: 100%; max-height: 640px; box-sizing: border-box; object-fit: contain; padding: clamp(18px, 4vw, 42px); }
.woocommerce div.product .woocommerce-product-details__short-description { max-width: 720px; color: #b8c5bf; font-size: 18px; line-height: 1.7; }
.suplo-product-eyebrow { margin: 0 0 18px; color: var(--suplo-accent); font: 12px var(--suplo-mono); letter-spacing: .06em; }
.suplo-product-meta { margin-top: 30px; border-block: 1px solid var(--suplo-line); }
.suplo-product-meta p { display: grid; grid-template-columns: 140px 1fr; gap: 18px; margin: 0; padding: 14px 0; border-bottom: 1px solid var(--suplo-line); font-size: 15px; }
.suplo-product-meta p:last-child { border-bottom: 0; }
.suplo-product-meta span { color: #91a49b; font-family: var(--suplo-mono); }
.suplo-product-meta b { color: var(--suplo-text); font-weight: 600; }
.suplo-product-meta a { color: var(--suplo-accent); }
.suplo-archive-intro { max-width: 760px; padding: 0 30px 28px; color: #adbbb5; font-size: 17px; }
.suplo-department-intro { border-bottom: 1px solid var(--suplo-line); background: #080c11; }
.suplo-department-intro > header { display: grid; grid-template-columns: .7fr 1fr; gap: 24px 70px; padding: 62px clamp(22px, 5vw, 80px); }
.suplo-department-intro > header span { color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-department-intro > header h2 { margin: 0; font-size: clamp(38px, 4.7vw, 68px); line-height: .95; letter-spacing: -.05em; }
.suplo-department-intro > header p { max-width: 700px; margin: 0; color: #b2c0ba; font-size: 18px; line-height: 1.72; }
.suplo-department-links { padding: 20px clamp(22px, 5vw, 80px); border-top: 1px solid var(--suplo-line); }
.suplo-department-links > strong { display: block; margin-bottom: 12px; color: #8fa198; font: 12px var(--suplo-mono); }
.suplo-department-links > div { display: flex; flex-wrap: wrap; gap: 9px; }
.suplo-department-links a { min-height: 44px; display: inline-flex; align-items: center; gap: 10px; border: 1px solid var(--suplo-line-strong); padding: 0 13px; color: #b5c2bc; font: 12px var(--suplo-mono); }
.suplo-department-links a:hover { border-color: var(--suplo-accent); color: var(--suplo-accent); }
.suplo-department-links a span { color: var(--suplo-dim); }
.suplo-department-checks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--suplo-line); }
.suplo-department-checks article { min-height: 210px; padding: 25px; border-right: 1px solid var(--suplo-line); }
.suplo-department-checks span { color: var(--suplo-accent); font: 20px var(--suplo-mono); }
.suplo-department-checks h3 { margin: 32px 0 8px; font-size: 21px; }
.suplo-department-checks p { margin: 0; color: #9eafa7; font-size: 15px; }
.suplo-department-footer { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: 24px clamp(22px, 5vw, 80px); border-top: 1px solid var(--suplo-line); }
.suplo-department-footer > div p { max-width: 900px; margin: 8px 0 0; color: #9eafa7; font-size: 14px; }
.suplo-department-footer > div strong, .suplo-department-footer nav > strong { display: block; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.suplo-department-footer nav { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: flex-end; }
.suplo-department-footer nav > strong { width: 100%; text-align: right; }
.suplo-department-footer nav a { border-bottom: 1px solid var(--suplo-accent); padding: 7px 0; color: var(--suplo-accent); font: 12px var(--suplo-mono); }
.woocommerce button.button, .woocommerce a.button, .woocommerce input.button, .wp-element-button { min-height: 48px; border: 1px solid var(--suplo-accent) !important; border-radius: 0 !important; padding: 0 18px !important; background: transparent !important; color: var(--suplo-accent) !important; font: 700 12px var(--suplo-mono) !important; }
.woocommerce button.button:hover, .woocommerce a.button:hover { background: var(--suplo-accent) !important; color: var(--suplo-dark) !important; }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce .quantity .qty { min-height: 46px; border: 1px solid var(--suplo-line-strong); border-radius: 0; padding: 10px 12px; background: var(--suplo-panel); color: var(--suplo-text); }
.woocommerce table.shop_table { border: 1px solid var(--suplo-line); border-radius: 0; color: var(--suplo-text); }
.woocommerce table.shop_table td, .woocommerce table.shop_table th { border-color: var(--suplo-line); padding: 16px; }
.woocommerce-info, .woocommerce-message, .woocommerce-error { border-top-color: var(--suplo-accent); background: var(--suplo-panel-2); color: var(--suplo-text); }
.woocommerce-info::before, .woocommerce-message::before { color: var(--suplo-accent); }
.woocommerce-cart .cart-collaterals, .woocommerce-checkout form.checkout, .woocommerce-account .woocommerce { padding: 30px; }
.woocommerce-tabs, .related.products, .up-sells { clear: both; padding-top: 40px; }
.woocommerce-tabs ul.tabs li { border-color: var(--suplo-line) !important; background: var(--suplo-panel) !important; }
.woocommerce-tabs ul.tabs li a { padding: 14px 18px !important; color: #aebcb6 !important; font-size: 15px !important; }
.woocommerce-tabs ul.tabs li.active a { color: var(--suplo-accent) !important; }
.woocommerce-tabs .panel { max-width: 1100px; color: #c2cec9; font-size: 17px; line-height: 1.75; }
.woocommerce-tabs .panel h2, .woocommerce-tabs .panel h3 { color: var(--suplo-text); }
.woocommerce table.shop_attributes { border-top: 1px solid var(--suplo-line); }
.woocommerce table.shop_attributes th, .woocommerce table.shop_attributes td { padding: 16px 18px; border-color: var(--suplo-line); background: transparent !important; font-size: 16px; line-height: 1.55; }
.woocommerce table.shop_attributes th { width: 230px; color: #9fb0a8; font-family: var(--suplo-mono); font-weight: 400; }
.woocommerce table.shop_attributes td { color: var(--suplo-text); }

/* Cart, checkout, account and order flow */
.suplo-commerce-flow-page .suplo-entry-content { max-width: 1320px; }
.suplo-commerce-flow { margin: 0 0 28px; border: 1px solid var(--suplo-line-strong); background: linear-gradient(135deg, rgba(118,255,200,.055), transparent 58%), var(--suplo-panel); }
.suplo-commerce-flow > header { display: grid; grid-template-columns: 180px 1fr; gap: 28px; align-items: start; padding: 28px; }
.suplo-commerce-flow > header > span, .suplo-order-status > span { color: var(--suplo-accent); font: 12px/1.6 var(--suplo-mono); letter-spacing: .05em; }
.suplo-commerce-flow h2 { margin: 0 0 8px; font-size: clamp(28px, 3vw, 42px); }
.suplo-commerce-flow header p { max-width: 760px; margin: 0; color: #aebdb6; font-size: 17px; }
.suplo-commerce-flow ol { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; padding: 0; border-top: 1px solid var(--suplo-line); list-style: none; }
.suplo-commerce-flow li { min-height: 76px; display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 8px; margin: 0; padding: 14px 20px; border-right: 1px solid var(--suplo-line); color: #82968d; }
.suplo-commerce-flow li:last-child { border-right: 0; }
.suplo-commerce-flow li b { color: var(--suplo-dim); font: 15px var(--suplo-mono); }
.suplo-commerce-flow li span { font-size: 15px; font-weight: 700; }
.suplo-commerce-flow li.is-active { background: rgba(118,255,200,.035); color: var(--suplo-text); }
.suplo-commerce-flow li.is-active b { color: var(--suplo-accent); }
.suplo-commerce-flow__paused { margin: 0 !important; border-top: 1px solid var(--suplo-line); padding: 16px 20px; color: #aebdb6 !important; font: 14px/1.7 var(--suplo-mono) !important; }
.suplo-commerce-flow__paused strong { margin-right: 12px; color: var(--suplo-accent); }

.suplo-commerce-flow-page .wc-block-cart,
.suplo-commerce-flow-page .wc-block-checkout { color: var(--suplo-text); font-size: 16px; }
.suplo-commerce-flow-page .wc-block-components-main,
.suplo-commerce-flow-page .wc-block-components-sidebar { border-color: var(--suplo-line) !important; }
.suplo-commerce-flow-page .wc-block-components-sidebar { padding: 24px !important; background: var(--suplo-panel-2); }
.suplo-commerce-flow-page .wc-block-components-title,
.suplo-commerce-flow-page .wc-block-components-checkout-step__title,
.suplo-commerce-flow-page .wc-block-components-order-summary__button-text { color: var(--suplo-text); font-size: 20px !important; }
.suplo-commerce-flow-page .wc-block-components-checkout-step__description,
.suplo-commerce-flow-page .wc-block-components-product-metadata,
.suplo-commerce-flow-page .wc-block-components-totals-item__description { color: #9fb0a8; font-size: 14px; }
.suplo-commerce-flow-page .wc-block-components-text-input input,
.suplo-commerce-flow-page .wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input,
.suplo-commerce-flow-page .wc-block-components-address-form select,
.suplo-commerce-flow-page .wc-block-components-textarea { min-height: 54px; border: 1px solid var(--suplo-line-strong) !important; border-radius: 0 !important; background: #0b1214 !important; color: var(--suplo-text) !important; font-size: 16px !important; }
.suplo-commerce-flow-page .wc-block-components-text-input label,
.suplo-commerce-flow-page .wc-block-components-checkbox__label,
.suplo-commerce-flow-page .wc-block-components-radio-control__label { color: #c4d0cb !important; font-size: 15px !important; }
.suplo-commerce-flow-page .wc-block-components-button { min-height: 54px; border: 1px solid var(--suplo-accent) !important; border-radius: 0 !important; background: var(--suplo-accent) !important; color: var(--suplo-dark) !important; font: 700 13px var(--suplo-mono) !important; }
.suplo-commerce-flow-page .wc-block-components-button:hover { background: transparent !important; color: var(--suplo-accent) !important; }
.suplo-commerce-flow-page .wc-block-cart-items,
.suplo-commerce-flow-page .wc-block-components-totals-wrapper,
.suplo-commerce-flow-page .wc-block-components-order-summary-item { border-color: var(--suplo-line) !important; }
.suplo-commerce-flow-page .wc-block-cart-item__image,
.suplo-commerce-flow-page .wc-block-components-order-summary-item__image { overflow: hidden; border: 1px solid #d7e2dc; border-radius: 10px; padding: 8px; background: #f5f8f6; }
.suplo-commerce-flow-page .wc-block-components-product-name { color: var(--suplo-text) !important; font-size: 17px !important; font-weight: 700; text-decoration: none !important; }
.suplo-commerce-flow-page .wc-block-formatted-money-amount { color: var(--suplo-accent); }
.suplo-commerce-flow-page .wc-block-cart__empty-cart__title { color: var(--suplo-text); font-size: clamp(30px, 4vw, 52px); }
.suplo-commerce-flow-page .wp-block-separator { border-color: var(--suplo-line); }
.suplo-commerce-flow-page .woocommerce-MyAccount-navigation ul { margin: 0 0 30px; padding: 0; border: 1px solid var(--suplo-line); list-style: none; }
.suplo-commerce-flow-page .woocommerce-MyAccount-navigation li { margin: 0; border-bottom: 1px solid var(--suplo-line); }
.suplo-commerce-flow-page .woocommerce-MyAccount-navigation li:last-child { border-bottom: 0; }
.suplo-commerce-flow-page .woocommerce-MyAccount-navigation a { min-height: 48px; display: flex; align-items: center; padding: 0 16px; color: #b7c5bf; font: 13px var(--suplo-mono); text-decoration: none; }
.suplo-commerce-flow-page .woocommerce-MyAccount-navigation .is-active a { background: rgba(118,255,200,.055); color: var(--suplo-accent); }
.suplo-order-status { margin: 0 0 28px; border: 1px solid var(--suplo-line-strong); padding: 22px; background: var(--suplo-panel); }
.suplo-order-status ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 16px 0 0; padding: 0; background: var(--suplo-line); list-style: none; }
.suplo-order-status li { margin: 0; padding: 16px; background: var(--suplo-bg); color: var(--suplo-muted); font-size: 14px; }
.suplo-order-status li.is-active { background: rgba(118,255,200,.055); color: var(--suplo-text); }

/* Dwa kontrolowane warianty prezentacji zdjęć do porównania z białym tłem źródłowym. */

@media (max-width: 1200px) {
  .suplo-hero { grid-template-columns: 1fr 1fr; }
  .suplo-live-panel { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--suplo-line); border-left: 0; }
  .suplo-live-panel > span { display: none; }
  .suplo-live-panel p { margin: 0; }
  .suplo-product-grid, ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .suplo-routine { grid-template-columns: 70px 1fr; }
  .suplo-info-matrix { grid-column: 1 / -1; min-height: 360px; border-top: 1px solid var(--suplo-line); }
  .suplo-needs-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .suplo-need-layout { grid-template-columns: minmax(0, 820px); }
  .suplo-need-side { display: none; }
}

@media (max-width: 900px) {
  body.admin-bar .suplo-topbar { top: 46px; }
  .suplo-topbar { gap: 10px; padding: 8px 12px; }
  .suplo-system-status { display: none; }
  .suplo-menu-toggle { display: block; }
  .suplo-nav { display: none; width: 100%; position: absolute; left: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; border-bottom: 1px solid var(--suplo-line); background: var(--suplo-bg); }
  .suplo-nav.is-open { display: flex; }
  .suplo-nav a { min-height: 56px; padding: 0 20px; border-top: 1px solid var(--suplo-line); }
  .suplo-category-menu { width: 100%; }
  .suplo-category-menu summary { min-height: 56px; padding: 0 20px; border-top: 1px solid var(--suplo-line); }
  .suplo-mega-menu { grid-template-columns: 1fr 1fr; position: static; max-height: 55vh; overflow-y: auto; border-inline: 0; padding: 8px; box-shadow: none; }
  .suplo-mega-menu a { min-height: 80px; padding: 10px; }
  .suplo-search-link { display: none; }
  .suplo-hero, .suplo-hero > *, .suplo-main, .suplo-commerce-main { min-width: 0; }
  .suplo-hero { grid-template-columns: minmax(0, 1fr); }
  .suplo-hero-copy { min-height: 650px; padding: 70px 22px; border-right: 0; }
  .suplo-hero h1 { font-size: clamp(52px, 13vw, 76px); }
  .suplo-orbital { min-height: 580px; border-top: 1px solid var(--suplo-line); }
  .suplo-live-panel { grid-template-columns: 1fr 1fr; }
  .suplo-command { grid-template-columns: 1fr; gap: 22px; }
  .suplo-command > header { grid-row: auto; }
  .suplo-pathways > header, .suplo-department-intro > header, .suplo-guides-intro { grid-template-columns: 1fr; }
  .suplo-pathways > div, .suplo-department-checks { grid-template-columns: 1fr; }
  .suplo-department-footer { grid-template-columns: 1fr; }
  .suplo-department-footer nav { justify-content: flex-start; }
  .suplo-department-footer nav > strong { text-align: left; }
  .suplo-category-hub > header { grid-template-columns: 1fr; }
  .suplo-category-hub > header span { grid-column: 1; }
  .suplo-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .suplo-explorer { grid-template-columns: 1fr; }
  .suplo-explorer > aside { display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--suplo-line); padding: 0; }
  .suplo-explorer > aside > span, .suplo-mini-status { display: none; }
  .suplo-explorer > aside > a { min-width: 160px; padding: 0 12px; border-right: 1px solid var(--suplo-line); }
  .suplo-knowledge { grid-template-columns: 60px 1fr; }
  .suplo-knowledge > header { align-items: flex-start; flex-direction: column; padding: 70px 25px; }
  .suplo-knowledge-grid { grid-template-columns: 1fr; }
  .suplo-launch-note { grid-template-columns: 1fr; padding: 80px 25px; }
  .suplo-footer { grid-template-columns: 1fr 1fr; }
  .suplo-footer p { grid-column: 1 / -1; }
  .suplo-article-grid { grid-template-columns: 1fr; }
  .suplo-needs-hero, .suplo-need-hero { grid-template-columns: 1fr; align-items: start; }
  .suplo-need-hero aside { max-width: 300px; }
  .suplo-related-needs > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .suplo-commerce-flow > header { grid-template-columns: 1fr; gap: 8px; }
}

@media (max-width: 560px) {
  .suplo-logo small { display: none; }
  .suplo-logo { min-width: 0; grid-template-rows: 1fr; }
  .suplo-logo > span { grid-row: 1; }
  .suplo-actions { align-items: stretch; flex-direction: column; }
  .suplo-solid-button { width: 100%; }
  .suplo-privacy { max-width: 100%; line-height: 1.9; overflow-wrap: anywhere; }
  .suplo-orbital { min-height: 500px; }
  .suplo-radar { width: 235px; height: 235px; }
  .suplo-radar::before { width: 170px; height: 170px; }
  .suplo-radar::after { width: 90px; height: 90px; }
  .suplo-radar > small { bottom: 58px; }
  .suplo-node { min-width: 110px; }
  .suplo-node-0, .suplo-node-2, .suplo-node-4, .suplo-node-6 { left: 2%; }
  .suplo-node-1, .suplo-node-3, .suplo-node-5, .suplo-node-7 { right: 2%; }
  .suplo-node-0, .suplo-node-1 { top: 3%; }
  .suplo-node-2, .suplo-node-3 { top: 27%; }
  .suplo-node-4, .suplo-node-5 { top: auto; bottom: 27%; }
  .suplo-node-6, .suplo-node-7 { bottom: 3%; }
  .suplo-command { min-height: 0; padding: 52px 20px; }
  .suplo-command form { grid-template-columns: 1fr; }
  .suplo-command input { min-height: 64px; border-bottom: 1px solid var(--suplo-accent); padding: 0 14px; font-size: 16px; }
  .suplo-command button { min-height: 52px; border-left: 0; }
  .suplo-pathways > header, .suplo-department-intro > header, .suplo-guides-intro { padding: 48px 20px; }
  .suplo-pathways > div > a, .suplo-department-checks article { min-height: 0; }
  .suplo-pathways a > strong { margin-top: 28px; }
  .suplo-mega-menu, .suplo-category-grid { grid-template-columns: 1fr; }
  .suplo-category-hub > header { padding: 52px 20px; }
  .suplo-product-grid, ul.products { grid-template-columns: 1fr; }
  .suplo-routine { grid-template-columns: 50px 1fr; }
  .suplo-routine-copy { padding: 60px 20px; }
  .suplo-info-matrix { grid-template-columns: 1fr; }
  .suplo-info-matrix article { min-height: 250px; border-bottom: 1px solid var(--suplo-line); }
  .suplo-routine h2, .suplo-knowledge h2, .suplo-launch-note h2 { font-size: 44px; }
  .suplo-knowledge { grid-template-columns: 50px 1fr; }
  .suplo-knowledge-grid article { padding: 20px; }
  .suplo-footer { grid-template-columns: 1fr; align-items: flex-start; }
  .suplo-entry-content { padding: 42px 20px 72px; font-size: 17px; }
  .suplo-entry-content > p:first-child, .suplo-legal-lead { font-size: 19px; }
  .suplo-info-grid { grid-template-columns: 1fr; }
  .suplo-info-card { min-height: 0; }
  .suplo-legal-table, .suplo-legal-table tbody, .suplo-legal-table tr, .suplo-legal-table th, .suplo-legal-table td { display: block; width: auto; }
  .suplo-legal-table th { border-bottom: 0; }
  .suplo-formula-card > footer { grid-template-columns: 1fr; }
  .suplo-formula-card > footer .suplo-outline-button { justify-self: stretch; }
  .woocommerce div.product { padding-inline: 16px; }
  .woocommerce div.product .product_title { font-size: clamp(38px, 12vw, 54px); }
  .suplo-product-meta p { grid-template-columns: 1fr; gap: 5px; }
  .woocommerce-tabs ul.tabs { display: grid; gap: 6px; padding: 0 !important; }
  .woocommerce-tabs ul.tabs li { width: 100%; margin: 0 !important; }
  .woocommerce table.shop_attributes th { width: 38%; }
  .suplo-needs-hero, .suplo-need-hero { min-height: 0; gap: 36px; padding: 58px 20px; }
  .suplo-needs-hero h1, .suplo-need-hero h1 { font-size: clamp(52px, 15vw, 74px); overflow-wrap: anywhere; }
  .suplo-needs-hero > p { font-size: 18px; }
  .suplo-needs-index, .suplo-related-needs > div { grid-template-columns: 1fr; }
  .suplo-need-index-card { min-height: 320px; }
  .suplo-needs-disclaimer { grid-template-columns: 1fr; padding: 30px 20px; }
  .suplo-need-layout { padding: 44px 20px 72px; }
  .suplo-need-content { font-size: 17px; }
  .suplo-need-content .suplo-need-lead { font-size: 20px; }
  .suplo-need-products > header { align-items: stretch; flex-direction: column; padding: 50px 20px 28px; }
  .suplo-need-products > header .suplo-outline-button { width: 100%; }
  .suplo-need-product-group > header { align-items: flex-start; flex-direction: column; gap: 5px; padding: 22px 20px; }
  .suplo-commerce-flow-page .suplo-entry-content { padding-inline: 14px; }
  .suplo-commerce-flow > header { padding: 22px 18px; }
  .suplo-commerce-flow ol, .suplo-order-status ol { grid-template-columns: 1fr; }
  .suplo-commerce-flow li { min-height: 58px; border-right: 0; border-bottom: 1px solid var(--suplo-line); }
  .suplo-commerce-flow li:last-child { border-bottom: 0; }
  .suplo-commerce-flow__paused { padding: 16px 18px; }
  .suplo-commerce-flow__paused strong { display: block; margin: 0 0 5px; }
  .suplo-commerce-flow-page .wc-block-components-sidebar { padding: 18px !important; }
}

@media print {
  .suplo-topbar, .suplo-footer, .suplo-page-header { display: none !important; }
  body, .suplo-content-main, .suplo-entry-content, .suplo-form-template { background: #fff !important; color: #000 !important; }
  .suplo-content-main { border: 0; }
  .suplo-entry-content { max-width: none; padding: 0; }
  .suplo-form-template { border: 1px solid #000; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}