:root {
  color-scheme: dark;
  --bg: #07101d;
  --bg-soft: #0b1626;
  --surface: #0e1b2d;
  --surface-2: #122238;
  --surface-3: #182b43;
  --line: rgba(151, 177, 211, .16);
  --line-strong: rgba(151, 177, 211, .28);
  --text: #eff6ff;
  --muted: #9aadc4;
  --muted-2: #71849b;
  --primary: #57e3c2;
  --primary-strong: #25c7a5;
  --primary-dark: #0b5f53;
  --blue: #61a8ff;
  --good: #5ae6b7;
  --warn: #f6c764;
  --bad: #ff7a8a;
  --info: #75b6ff;
  --shadow: 0 22px 70px rgba(0, 0, 0, .34);
  --radius: 20px;
  --radius-sm: 12px;
  --max: 1480px;
  --font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #eef4f8;
  --bg-soft: #f8fbfd;
  --surface: #ffffff;
  --surface-2: #f3f7fa;
  --surface-3: #e9f0f5;
  --line: rgba(23, 51, 78, .12);
  --line-strong: rgba(23, 51, 78, .22);
  --text: #102235;
  --muted: #536a80;
  --muted-2: #71879b;
  --primary: #0aa88c;
  --primary-strong: #087a68;
  --primary-dark: #d7f6ee;
  --blue: #176dc1;
  --good: #0b9b74;
  --warn: #b97800;
  --bad: #cf3e54;
  --info: #276fba;
  --shadow: 0 22px 70px rgba(45, 66, 86, .14);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font); line-height: 1.55; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
svg { width: 1.2em; height: 1.2em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.is-hidden { display: none !important; }
.skip-link { position: fixed; left: 12px; top: 12px; z-index: 999; transform: translateY(-160%); padding: 10px 14px; background: var(--primary); color: #05251f; border-radius: 9px; font-weight: 800; }
.skip-link:focus { transform: none; }

.app-shell { min-height: 100vh; overflow: clip; }
.topbar { position: sticky; top: 0; z-index: 50; height: 76px; display: flex; align-items: center; gap: 36px; padding: 0 max(24px, calc((100vw - var(--max)) / 2)); background: color-mix(in srgb, var(--bg) 88%, transparent); border-bottom: 1px solid var(--line); backdrop-filter: blur(20px); }
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; }
.brand > span:last-child { display: grid; line-height: 1; }
.brand strong { font-size: 18px; letter-spacing: .18em; }
.brand small { margin-top: 5px; color: var(--muted); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.brand-mark { width: 37px; height: 37px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; padding: 7px; border-radius: 11px; background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 22%, var(--surface)), var(--surface-2)); border: 1px solid color-mix(in srgb, var(--primary) 38%, transparent); box-shadow: inset 0 0 20px color-mix(in srgb, var(--primary) 12%, transparent); }
.brand-mark i { align-self: end; display: block; border-radius: 2px; background: var(--primary); }
.brand-mark i:nth-child(1) { height: 45%; opacity: .58; }
.brand-mark i:nth-child(2) { height: 100%; }
.brand-mark i:nth-child(3) { height: 72%; opacity: .82; }
.main-nav { display: flex; align-items: stretch; align-self: stretch; gap: 30px; }
.main-nav a { position: relative; display: flex; align-items: center; color: var(--muted); font-size: 14px; font-weight: 650; }
.main-nav a:hover, .main-nav a.is-active { color: var(--text); }
.main-nav a.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--primary); }
.top-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.icon-button, .view-controls button { width: 40px; height: 40px; display: grid; place-items: center; color: var(--muted); background: var(--surface); border: 1px solid var(--line); border-radius: 10px; cursor: pointer; }
.icon-button:hover, .view-controls button:hover, .view-controls button.is-active { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 44%, transparent); }
.button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 17px; border: 1px solid transparent; border-radius: 10px; font-size: 13px; font-weight: 800; cursor: pointer; transition: .2s ease; }
.button:disabled { cursor: wait; opacity: .6; }
.button-primary { color: #04251e; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 72%, #fff)); box-shadow: 0 10px 28px color-mix(in srgb, var(--primary) 20%, transparent); }
.button-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 34px color-mix(in srgb, var(--primary) 28%, transparent); }
.button-ghost { color: var(--text); background: var(--surface); border-color: var(--line); }
.button-ghost:hover { border-color: var(--line-strong); background: var(--surface-2); }

.hero { position: relative; min-height: 620px; display: grid; place-items: center; padding: 76px 24px 84px; background: radial-gradient(circle at 50% 20%, color-mix(in srgb, var(--primary) 12%, transparent), transparent 34%), radial-gradient(circle at 12% 80%, color-mix(in srgb, var(--blue) 9%, transparent), transparent 28%), linear-gradient(180deg, var(--bg), color-mix(in srgb, var(--bg-soft) 84%, var(--bg))); border-bottom: 1px solid var(--line); }
.hero::after { content: ""; position: absolute; inset: auto 0 0; height: 120px; background: linear-gradient(transparent, var(--bg)); pointer-events: none; }
.hero-grid { position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 48px 48px; mask-image: radial-gradient(circle at center, #000 0, transparent 72%); }
.hero-content { position: relative; z-index: 2; width: min(1020px, 100%); text-align: center; }
.eyebrow, .section-kicker { display: inline-flex; align-items: center; gap: 8px; color: var(--primary); font-size: 11px; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.pulse-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 5px color-mix(in srgb, var(--primary) 14%, transparent), 0 0 18px var(--primary); }
.hero h1 { max-width: 900px; margin: 18px auto 18px; font-size: clamp(42px, 5.4vw, 72px); line-height: 1.05; letter-spacing: -.045em; }
.hero h1 em { color: var(--primary); font-style: normal; }
.hero > .hero-content > p { max-width: 780px; margin: 0 auto; color: var(--muted); font-size: 18px; }
.scan-bar { position: relative; width: min(930px, 100%); min-height: 76px; margin: 38px auto 0; display: flex; align-items: center; gap: 12px; padding: 10px 10px 10px 16px; text-align: left; background: color-mix(in srgb, var(--surface) 94%, transparent); border: 1px solid var(--line-strong); border-radius: 16px; box-shadow: var(--shadow); backdrop-filter: blur(16px); }
.scan-bar:focus-within { border-color: color-mix(in srgb, var(--primary) 52%, transparent); box-shadow: var(--shadow), 0 0 0 3px color-mix(in srgb, var(--primary) 10%, transparent); }
.scan-bar.has-error { animation: shake .28s linear 2; border-color: var(--bad); }
@keyframes shake { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
.scan-tool-icon { width: 45px; height: 45px; flex: 0 0 auto; display: grid; place-items: center; color: var(--primary); background: color-mix(in srgb, var(--primary) 10%, var(--surface-2)); border: 1px solid color-mix(in srgb, var(--primary) 24%, transparent); border-radius: 11px; font-weight: 900; }
.scan-input-wrap { flex: 1 1 280px; min-width: 140px; display: grid; }
.scan-input-wrap label, .selector-wrap label { color: var(--muted-2); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.scan-input-wrap input, .selector-wrap input { width: 100%; min-width: 0; padding: 4px 0 0; color: var(--text); background: transparent; border: 0; outline: none; font-size: 17px; font-weight: 650; }
.scan-input-wrap input::placeholder, .selector-wrap input::placeholder { color: var(--muted-2); opacity: .75; }
.selector-wrap { width: 180px; padding-left: 14px; border-left: 1px solid var(--line); display: grid; }
.scan-submit { min-height: 56px; padding-inline: 23px; border-radius: 12px; }
.scan-consent { margin: 12px auto 0 !important; color: var(--muted-2) !important; font-size: 12px !important; }
.hero-metrics { width: min(850px, 100%); margin: 48px auto 0; display: grid; grid-template-columns: repeat(4, 1fr); }
.hero-metrics div { display: grid; gap: 4px; padding: 0 20px; border-right: 1px solid var(--line); }
.hero-metrics div:last-child { border-right: 0; }
.hero-metrics strong { font-size: 24px; letter-spacing: -.04em; }
.hero-metrics span { color: var(--muted); font-size: 12px; }

.workspace { width: min(var(--max), calc(100% - 48px)); margin: 0 auto; display: grid; grid-template-columns: 245px minmax(0, 1fr); gap: 42px; padding: 82px 0 110px; }
.tool-sidebar { min-width: 0; }
.sidebar-sticky { position: sticky; top: 100px; }
.sidebar-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; color: var(--text); font-size: 13px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.count-badge { min-width: 28px; height: 24px; display: grid; place-items: center; padding: 0 7px; color: var(--primary); background: color-mix(in srgb, var(--primary) 10%, transparent); border-radius: 7px; font-size: 11px; }
.tool-search { height: 43px; display: flex; align-items: center; gap: 9px; padding: 0 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.tool-search svg { color: var(--muted-2); }
.tool-search input { width: 100%; min-width: 0; color: var(--text); background: transparent; border: 0; outline: 0; font-size: 13px; }
.category-list { display: grid; gap: 3px; margin-top: 14px; }
.category-button { min-height: 40px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; color: var(--muted); background: transparent; border: 1px solid transparent; border-radius: 9px; text-align: left; cursor: pointer; }
.category-button:hover { color: var(--text); background: var(--surface); }
.category-button.is-active { color: var(--primary); background: color-mix(in srgb, var(--primary) 8%, var(--surface)); border-color: color-mix(in srgb, var(--primary) 18%, transparent); }
.category-button span { font-size: 13px; font-weight: 650; }
.category-button b { color: var(--muted-2); font-size: 11px; }
.trust-panel { margin-top: 28px; padding: 18px; background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 7%, var(--surface)), var(--surface)); border: 1px solid var(--line); border-radius: 14px; }
.trust-label { color: var(--muted-2); font-size: 9px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.source-logos { display: flex; flex-wrap: wrap; gap: 6px; margin: 11px 0; }
.source-logos span { padding: 4px 7px; color: var(--text); background: var(--surface-3); border-radius: 5px; font-size: 9px; font-weight: 900; letter-spacing: .06em; }
.trust-panel p { margin: 0; color: var(--muted); font-size: 11px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.section-heading h2, .result-toolbar h2, .platform-section h2, .api-section h2 { margin: 6px 0 8px; font-size: clamp(28px, 3vw, 42px); line-height: 1.1; letter-spacing: -.035em; }
.section-heading p { margin: 0; color: var(--muted); }
.view-controls { display: flex; gap: 7px; }
.view-controls button { width: 37px; height: 37px; }
.tool-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.tool-card { position: relative; min-height: 255px; display: flex; flex-direction: column; padding: 22px; background: linear-gradient(145deg, var(--surface), color-mix(in srgb, var(--surface-2) 65%, var(--surface))); border: 1px solid var(--line); border-radius: 16px; cursor: pointer; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; outline: none; }
.tool-card:hover, .tool-card:focus-visible { transform: translateY(-3px); border-color: color-mix(in srgb, var(--primary) 32%, var(--line)); box-shadow: 0 18px 45px rgba(0, 0, 0, .18); }
.tool-card.is-selected { border-color: color-mix(in srgb, var(--primary) 58%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 18%, transparent), 0 14px 40px color-mix(in srgb, var(--primary) 7%, transparent); }
.tool-card.is-selected::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(circle at 0 0, color-mix(in srgb, var(--primary) 9%, transparent), transparent 44%); pointer-events: none; }
.tool-card-top { position: relative; display: flex; align-items: flex-start; justify-content: space-between; }
.tool-icon { min-width: 45px; height: 45px; display: grid; place-items: center; padding: 0 8px; color: var(--primary); background: color-mix(in srgb, var(--primary) 9%, var(--surface-2)); border: 1px solid color-mix(in srgb, var(--primary) 17%, transparent); border-radius: 11px; font-size: 15px; font-weight: 900; letter-spacing: -.04em; }
.tool-badge { padding: 4px 7px; color: var(--primary); background: color-mix(in srgb, var(--primary) 8%, transparent); border: 1px solid color-mix(in srgb, var(--primary) 15%, transparent); border-radius: 6px; font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.tool-card-copy { position: relative; margin-top: 22px; }
.tool-category { color: var(--muted-2); font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.tool-card h3 { margin: 5px 0 8px; font-size: 17px; line-height: 1.25; }
.tool-card p { margin: 0; color: var(--muted); font-size: 12.5px; }
.tool-card-footer { position: relative; margin-top: auto; padding-top: 18px; display: flex; align-items: center; justify-content: space-between; color: var(--muted-2); border-top: 1px solid var(--line); font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.tool-card:hover .tool-card-footer, .tool-card.is-selected .tool-card-footer { color: var(--primary); }
.tool-grid.is-list { grid-template-columns: 1fr; }
.tool-grid.is-list .tool-card { min-height: 132px; display: grid; grid-template-columns: 55px minmax(0, 1fr) 170px; align-items: center; gap: 20px; }
.tool-grid.is-list .tool-card-top { display: contents; }
.tool-grid.is-list .tool-badge { position: absolute; right: 22px; top: 18px; }
.tool-grid.is-list .tool-card-copy { margin: 0; }
.tool-grid.is-list .tool-card-footer { margin: 0; padding: 0; border: 0; }
.empty-state { grid-column: 1 / -1; min-height: 180px; display: grid; place-content: center; text-align: center; background: var(--surface); border: 1px dashed var(--line-strong); border-radius: 16px; }
.empty-state p { margin: 4px 0 0; color: var(--muted); }

.result-section { width: min(var(--max), calc(100% - 48px)); margin: 0 auto 110px; padding-top: 85px; scroll-margin-top: 70px; }
.result-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 25px; }
.result-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.scan-progress { min-height: 230px; display: grid; grid-template-columns: 90px minmax(0, 1fr); align-items: center; gap: 25px; padding: 45px; background: var(--surface); border: 1px solid var(--line); border-radius: 20px; overflow: hidden; }
.scan-progress strong { display: block; font-size: 20px; }
.scan-progress p { margin: 6px 0 0; color: var(--muted); }
.progress-orbit { position: relative; width: 72px; height: 72px; border: 1px solid var(--line-strong); border-radius: 50%; animation: orbit 2s linear infinite; }
.progress-orbit::before, .progress-orbit::after { content: ""; position: absolute; border: 1px solid var(--line); border-radius: 50%; }
.progress-orbit::before { inset: 9px; }
.progress-orbit::after { inset: 22px; background: color-mix(in srgb, var(--primary) 13%, transparent); }
.progress-orbit span { position: absolute; left: 50%; top: -4px; width: 9px; height: 9px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 15px var(--primary); }
.progress-orbit i { position: absolute; right: 4px; bottom: 8px; width: 6px; height: 6px; border-radius: 50%; background: var(--blue); }
@keyframes orbit { to { transform: rotate(360deg); } }
.progress-line { grid-column: 1 / -1; height: 3px; background: var(--surface-3); border-radius: 4px; overflow: hidden; }
.progress-line span { display: block; width: 35%; height: 100%; background: linear-gradient(90deg, transparent, var(--primary), transparent); animation: progress 1.5s ease-in-out infinite; }
@keyframes progress { from { transform: translateX(-120%); } to { transform: translateX(400%); } }
.result-hero { display: grid; grid-template-columns: minmax(330px, .85fr) 1.6fr; gap: 16px; }
.score-card, .summary-card, .finding, .module-strip, .report-disclaimer, .error-panel { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; }
.score-card { min-height: 190px; display: flex; align-items: center; gap: 24px; padding: 28px; }
.score-ring { width: 126px; height: 126px; flex: 0 0 auto; display: grid; place-items: center; position: relative; }
.score-ring > svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.score-ring circle { fill: none; stroke-width: 8; }
.score-track { stroke: var(--surface-3); }
.score-value { stroke: var(--primary); stroke-linecap: round; }
.score-ring div { position: relative; z-index: 1; display: grid; text-align: center; line-height: 1; }
.score-ring strong { font-size: 38px; letter-spacing: -.07em; }
.score-ring span { margin-top: 5px; color: var(--muted); font-size: 11px; }
.score-copy h3 { margin: 12px 0 5px; font-size: 20px; overflow-wrap: anywhere; }
.score-copy p { margin: 0; color: var(--muted); font-size: 12px; }
.grade { display: inline-flex; min-width: 42px; height: 27px; align-items: center; justify-content: center; padding: 0 8px; color: #03221b; background: var(--primary); border-radius: 7px; font-weight: 900; }
.summary-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.summary-card { position: relative; width: 100%; min-height: 87px; display: flex; align-items: center; gap: 14px; padding: 16px 44px 16px 16px; color: var(--text); text-align: left; cursor: pointer; transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.summary-card:hover, .summary-card:focus-visible { transform: translateY(-2px); background: var(--surface-2); border-color: var(--line-strong); outline: none; }
.summary-card.is-active { border-color: color-mix(in srgb, var(--primary) 48%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 8%, transparent); }
.summary-arrow { position: absolute; right: 15px; width: 17px; color: var(--muted-2); transition: transform .18s ease; }
.summary-card:hover .summary-arrow, .summary-card.is-active .summary-arrow { color: var(--primary); transform: translateX(3px); }
.status-icon { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; }
.status-icon svg { width: 18px; }
.status-icon.good { color: var(--good); background: color-mix(in srgb, var(--good) 11%, transparent); }
.status-icon.warn { color: var(--warn); background: color-mix(in srgb, var(--warn) 11%, transparent); }
.status-icon.bad { color: var(--bad); background: color-mix(in srgb, var(--bad) 11%, transparent); }
.status-icon.info { color: var(--info); background: color-mix(in srgb, var(--info) 11%, transparent); }
.summary-card > div { display: grid; grid-template-columns: auto 1fr; column-gap: 8px; align-items: baseline; }
.summary-card strong { font-size: 22px; }
.summary-card span { font-weight: 800; font-size: 12px; }
.summary-card small { grid-column: 1 / -1; color: var(--muted); font-size: 10px; }
.module-strip { margin-top: 16px; display: grid; grid-template-columns: repeat(5, 1fr); padding: 8px; }
.module-score { min-height: 70px; display: grid; grid-template-columns: 1fr auto; align-content: center; padding: 10px 18px; border-right: 1px solid var(--line); }
.module-score:last-child { border-right: 0; }
.module-score span { grid-column: 1 / -1; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .09em; }
.module-score strong { font-size: 24px; }
.module-score em { align-self: center; color: var(--primary); font-style: normal; font-weight: 900; }
.finding-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 42px 0 16px; }
.finding-toolbar h3 { margin: 0 0 4px; font-size: 22px; }
.finding-toolbar p { margin: 0; color: var(--muted); font-size: 12px; }
.finding-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.finding-filters button { min-height: 34px; padding: 0 12px; color: var(--muted); background: var(--surface); border: 1px solid var(--line); border-radius: 8px; cursor: pointer; font-size: 11px; font-weight: 800; }
.finding-filters button:hover, .finding-filters button.is-active { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 35%, transparent); }
.finding-list { display: grid; gap: 8px; scroll-margin-top: 95px; }
.filtered-empty { padding: 34px; text-align: center; background: var(--surface); border: 1px dashed var(--line-strong); border-radius: 16px; }
.filtered-empty strong { display: block; }
.filtered-empty p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.finding { overflow: hidden; scroll-margin-top: 100px; transition: border-color .2s ease, box-shadow .2s ease; }
.finding:focus { outline: none; }
.finding.is-targeted { border-color: color-mix(in srgb, var(--primary) 64%, transparent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 10%, transparent), 0 16px 42px rgba(0, 0, 0, .18); }
.finding-summary { width: 100%; min-height: 93px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto 24px; align-items: center; gap: 15px; padding: 17px 20px; color: var(--text); background: transparent; border: 0; text-align: left; cursor: pointer; }
.finding-summary:hover { background: color-mix(in srgb, var(--surface-2) 55%, transparent); }
.finding-main { min-width: 0; }
.finding-main small { display: block; color: var(--muted-2); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.finding-main strong { display: block; margin-top: 3px; font-size: 14px; }
.finding-main p { margin: 3px 0 0; color: var(--muted); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.severity { padding: 4px 8px; border-radius: 6px; font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .06em; }
.severity-critical { color: var(--bad); background: color-mix(in srgb, var(--bad) 11%, transparent); }
.severity-high { color: #ff9e77; background: color-mix(in srgb, #ff9e77 11%, transparent); }
.severity-medium { color: var(--warn); background: color-mix(in srgb, var(--warn) 11%, transparent); }
.severity-low, .severity-info { color: var(--info); background: color-mix(in srgb, var(--info) 10%, transparent); }
.chevron { color: var(--muted-2); transition: transform .2s ease; }
.finding-summary[aria-expanded="true"] .chevron { transform: rotate(180deg); }
.finding-details { display: none; border-top: 1px solid var(--line); }
.finding-details.is-open { display: block; }
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 22px 74px 25px; background: color-mix(in srgb, var(--surface-2) 45%, transparent); }
.detail-grid > div > span { display: block; margin-bottom: 8px; color: var(--muted-2); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.detail-grid pre { max-height: 260px; margin: 0; padding: 13px; overflow: auto; color: color-mix(in srgb, var(--text) 84%, var(--primary)); background: var(--bg); border: 1px solid var(--line); border-radius: 9px; white-space: pre-wrap; overflow-wrap: anywhere; font: 11px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace; }
.detail-grid p { margin: 0; color: var(--muted); font-size: 12px; }
.detail-grid small { display: block; margin-top: 12px; color: var(--primary); font-size: 10px; }
.report-disclaimer { margin-top: 16px; padding: 18px 20px; display: flex; gap: 20px; align-items: baseline; }
.report-disclaimer strong { min-width: max-content; font-size: 11px; text-transform: uppercase; letter-spacing: .09em; }
.report-disclaimer p { margin: 0; color: var(--muted); font-size: 11px; }
.error-panel { min-height: 160px; display: flex; align-items: center; gap: 18px; padding: 28px; }
.error-panel strong { display: block; font-size: 18px; }
.error-panel p { margin: 5px 0; color: var(--bad); }
.error-panel small { color: var(--muted); }

body.has-modal { overflow: hidden; }
.modal { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 20px; }
.modal-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; background: rgba(2, 8, 16, .76); border: 0; cursor: pointer; backdrop-filter: blur(8px); }
.modal-card { position: relative; z-index: 1; width: min(540px, 100%); padding: 34px; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 20px; box-shadow: 0 32px 100px rgba(0, 0, 0, .48); }
.modal-card h2 { margin: 10px 45px 8px 0; font-size: 27px; letter-spacing: -.03em; }
.modal-card > p { margin: 0 0 25px; color: var(--muted); font-size: 13px; }
.modal-close { position: absolute; top: 18px; right: 18px; width: 38px; height: 38px; display: grid; place-items: center; color: var(--muted); background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px; cursor: pointer; }
.modal-close:hover { color: var(--text); border-color: var(--line-strong); }
.modal-field { display: grid; gap: 8px; }
.modal-field span { color: var(--muted-2); font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.modal-field input { width: 100%; min-height: 52px; padding: 0 15px; color: var(--text); background: var(--bg); border: 1px solid var(--line-strong); border-radius: 11px; outline: none; }
.modal-field input:focus { border-color: color-mix(in srgb, var(--primary) 58%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 10%, transparent); }
.modal-note { margin: 10px 0 0 !important; color: var(--muted-2) !important; font-size: 10px !important; }
.form-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.modal-status { margin-top: 16px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; font-size: 12px; }
.modal-status.is-loading { color: var(--info); background: color-mix(in srgb, var(--info) 8%, transparent); }
.modal-status.is-success { color: var(--good); background: color-mix(in srgb, var(--good) 8%, transparent); border-color: color-mix(in srgb, var(--good) 26%, transparent); }
.modal-status.is-error { color: var(--bad); background: color-mix(in srgb, var(--bad) 8%, transparent); border-color: color-mix(in srgb, var(--bad) 26%, transparent); }
.modal-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 24px; }

.platform-section { width: min(var(--max), calc(100% - 48px)); min-height: 570px; margin: 0 auto 110px; display: grid; grid-template-columns: 1.05fr .95fr; gap: 70px; align-items: center; padding: 60px; background: linear-gradient(135deg, color-mix(in srgb, var(--surface) 96%, var(--primary)), var(--surface)); border: 1px solid var(--line); border-radius: 28px; overflow: hidden; }
.platform-copy > p { max-width: 680px; color: var(--muted); }
.platform-points { margin-top: 32px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.platform-points div { display: grid; grid-template-columns: 30px 1fr; column-gap: 11px; }
.platform-points span { grid-row: 1 / 3; color: var(--primary); font-size: 11px; font-weight: 900; }
.platform-points strong { font-size: 13px; }
.platform-points p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.platform-visual { position: relative; min-height: 420px; display: grid; place-items: center; }
.radar { position: relative; width: min(350px, 80vw); aspect-ratio: 1; border: 1px solid var(--line-strong); border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 52px, var(--line) 53px 54px), conic-gradient(from 0deg, color-mix(in srgb, var(--primary) 16%, transparent), transparent 24%); animation: radar 7s linear infinite; }
.radar::before, .radar::after { content: ""; position: absolute; background: var(--line); }
.radar::before { width: 1px; inset: 0 auto 0 50%; }
.radar::after { height: 1px; inset: 50% 0 auto; }
.radar span, .radar i, .radar b, .radar em { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 14px var(--primary); }
.radar span { left: 28%; top: 36%; }
.radar i { right: 22%; top: 25%; }
.radar b { left: 42%; bottom: 18%; }
.radar em { right: 32%; bottom: 38%; }
@keyframes radar { to { transform: rotate(360deg); } }
.floating-card { position: absolute; display: grid; gap: 2px; padding: 14px 16px; background: color-mix(in srgb, var(--surface) 92%, transparent); border: 1px solid var(--line-strong); border-radius: 12px; box-shadow: var(--shadow); backdrop-filter: blur(14px); }
.floating-card small { color: var(--muted-2); font-size: 8px; letter-spacing: .1em; }
.floating-card strong { font-size: 16px; }
.floating-card span { color: var(--muted); font-size: 9px; }
.card-a { left: 0; top: 18%; }
.card-a strong { color: var(--primary); font-size: 32px; }
.card-b { right: 0; top: 30%; }
.card-c { left: 16%; bottom: 10%; }
.mini-status { width: 7px; height: 7px; border-radius: 50%; }
.mini-status.good { background: var(--good); box-shadow: 0 0 10px var(--good); }
.mini-status.warn { background: var(--warn); box-shadow: 0 0 10px var(--warn); }
.api-section { width: min(var(--max), calc(100% - 48px)); margin: 0 auto 110px; display: grid; grid-template-columns: 1fr .9fr; gap: 50px; align-items: center; padding: 48px 55px; background: var(--surface); border: 1px solid var(--line); border-radius: 22px; }
.api-section p { color: var(--muted); }
.api-section pre { margin: 0; padding: 24px; color: var(--primary); background: var(--bg); border: 1px solid var(--line); border-radius: 14px; overflow: auto; font: 13px/1.7 ui-monospace, SFMono-Regular, Menlo, monospace; }
.footer { min-height: 120px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 35px; padding: 25px max(24px, calc((100vw - var(--max)) / 2)); border-top: 1px solid var(--line); }
.footer p { max-width: 700px; margin: 0; color: var(--muted); font-size: 11px; }
.footer > span { color: var(--muted-2); font-size: 11px; }

@media (max-width: 1180px) {
  .main-nav { display: none; }
  .tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .result-hero { grid-template-columns: 1fr; }
  .score-card { min-height: 170px; }
  .platform-section { grid-template-columns: 1fr; }
  .platform-visual { min-height: 360px; }
}

@media (max-width: 900px) {
  .topbar { height: 68px; padding-inline: 18px; }
  .top-actions .button { display: none; }
  .hero { min-height: auto; padding: 62px 18px 72px; }
  .hero h1 { font-size: clamp(38px, 8vw, 58px); }
  .scan-bar { flex-wrap: wrap; padding: 12px; }
  .scan-input-wrap { flex-basis: calc(100% - 65px); }
  .selector-wrap { width: calc(100% - 65px); margin-left: 57px; padding: 8px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .scan-submit { width: 100%; }
  .hero-metrics { grid-template-columns: repeat(2, 1fr); row-gap: 24px; }
  .hero-metrics div:nth-child(2) { border-right: 0; }
  .workspace { width: min(100% - 30px, var(--max)); grid-template-columns: 1fr; padding-top: 55px; }
  .sidebar-sticky { position: static; }
  .category-list { display: flex; overflow-x: auto; padding-bottom: 6px; }
  .category-button { min-width: max-content; }
  .trust-panel { display: none; }
  .result-section, .platform-section, .api-section { width: calc(100% - 30px); }
  .result-toolbar, .finding-toolbar { align-items: flex-start; flex-direction: column; }
  .module-strip { grid-template-columns: repeat(3, 1fr); }
  .module-score { border-bottom: 1px solid var(--line); }
  .detail-grid { padding: 22px; }
  .platform-section { padding: 40px 28px; }
  .api-section { grid-template-columns: 1fr; padding: 36px 28px; }
  .footer { grid-template-columns: 1fr; gap: 12px; text-align: center; justify-items: center; }
}

@media (max-width: 650px) {
  .brand small { display: none; }
  .hero h1 { font-size: 38px; }
  .hero > .hero-content > p { font-size: 15px; }
  .hero-metrics { margin-top: 34px; }
  .hero-metrics div { padding-inline: 8px; }
  .section-heading { align-items: flex-start; }
  .view-controls { display: none; }
  .tool-grid { grid-template-columns: 1fr; }
  .tool-card { min-height: 220px; }
  .result-actions { width: 100%; }
  .result-actions .button { flex: 1 1 auto; }
  .modal-card { padding: 28px 22px 22px; }
  .modal-actions { flex-direction: column-reverse; }
  .modal-actions .button { width: 100%; }
  .score-card { align-items: flex-start; flex-direction: column; }
  .summary-cards { grid-template-columns: 1fr; }
  .module-strip { grid-template-columns: repeat(2, 1fr); }
  .module-score:nth-child(even) { border-right: 0; }
  .finding-summary { grid-template-columns: 36px minmax(0, 1fr) 20px; padding: 15px; }
  .severity { grid-column: 2; justify-self: start; }
  .chevron { grid-column: 3; grid-row: 1; }
  .finding-main p { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .detail-grid { grid-template-columns: 1fr; }
  .report-disclaimer { align-items: flex-start; flex-direction: column; gap: 5px; }
  .platform-points { grid-template-columns: 1fr; }
  .platform-visual { min-height: 300px; transform: scale(.86); margin-inline: -30px; }
  .api-section pre { font-size: 11px; }
}

@media print {
  :root { color-scheme: light; --bg: #fff; --surface: #fff; --surface-2: #f5f5f5; --surface-3: #eee; --text: #111; --muted: #555; --muted-2: #666; --line: #ddd; --line-strong: #bbb; }
  .topbar, .hero, .workspace, .platform-section, .api-section, .footer, .result-actions, .finding-filters, .modal { display: none !important; }
  .result-section { width: 100%; margin: 0; padding: 0; }
  .finding-details { display: block !important; }
  .finding { break-inside: avoid; }
  .result-hero { grid-template-columns: 1fr; }
}

/* v1.2 — baza wiedzy i SEO landing pages */
.knowledge-section { width:min(var(--max),calc(100% - 48px)); margin:20px auto 110px; }
.knowledge-heading { max-width:760px; margin-bottom:34px; }
.knowledge-heading h2 { margin:8px 0 12px; font-size:clamp(30px,4vw,48px); }
.knowledge-heading p { color:var(--muted); font-size:17px; }
.knowledge-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.knowledge-card { display:flex; min-height:260px; padding:28px; flex-direction:column; color:var(--text); text-decoration:none; background:var(--surface); border:1px solid var(--line); border-radius:18px; transition:.2s ease; }
.knowledge-card:hover { transform:translateY(-4px); border-color:var(--primary); box-shadow:0 20px 45px rgba(0,0,0,.12); }
.knowledge-card span { color:var(--primary); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.knowledge-card h3 { margin:18px 0 10px; font-size:22px; line-height:1.25; }
.knowledge-card p { margin:0 0 22px; color:var(--muted); line-height:1.65; }
.knowledge-card strong { margin-top:auto; color:var(--primary); }
.article-page { width:min(920px,calc(100% - 36px)); margin:0 auto; padding:120px 0 90px; }
.breadcrumbs { display:flex; gap:9px; flex-wrap:wrap; margin-bottom:38px; color:var(--muted); font-size:13px; }
.breadcrumbs a { color:var(--primary); text-decoration:none; }
.article-header h1 { max-width:980px; margin:12px 0 22px; font-size:clamp(34px,3.4vw,54px); line-height:1.08; letter-spacing:-.03em; text-wrap:balance; }
.article-lead { max-width:820px; font-size:21px; line-height:1.7; color:var(--muted); }
.article-meta { margin-top:22px; color:var(--muted-2); font-size:13px; }
.article-body { max-width:780px; margin-top:56px; }
.article-body section { margin:0 0 42px; }
.article-body h2 { margin:0 0 14px; font-size:30px; }
.article-body p { color:var(--muted); font-size:18px; line-height:1.8; }
.article-cta { display:flex; gap:25px; align-items:center; justify-content:space-between; margin-top:65px; padding:30px; background:var(--surface); border:1px solid var(--line); border-radius:18px; }
.article-cta p { margin:6px 0 0; font-size:15px; }
@media(max-width:1000px){.knowledge-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:650px){.knowledge-section{width:calc(100% - 30px)}.knowledge-grid{grid-template-columns:1fr}.article-page{padding-top:95px}.article-header h1{font-size:clamp(32px,9vw,42px);line-height:1.1}.article-lead{font-size:18px}.article-body p{font-size:16px}.article-cta{align-items:flex-start;flex-direction:column}.article-cta .button{width:100%}}

/* CYBEROCENA 1.3 — vivid enterprise interface */
:root{--brand:#1268f3;--brand2:#14c8d4;--violet:#7546f5;--ink:#0d1838;--muted:#64708d;--line:#dfe7f4;--surface:#fff;--soft:#f5f8fe;--green:#13aa5b;--orange:#ff8a00;--red:#f2385a;--shadow:0 16px 44px rgba(33,71,132,.12)}
html{scroll-behavior:smooth}body{background:linear-gradient(180deg,#f9fbff 0,#f4f8ff 36%,#fff 100%);color:var(--ink)}
.app-shell{max-width:none}.topbar{height:78px;padding:0 clamp(24px,4vw,72px);background:rgba(255,255,255,.93);backdrop-filter:blur(16px);border-bottom:1px solid #e4ebf6;position:sticky;top:0;z-index:40}
.brand strong{font-size:29px;letter-spacing:-1.2px;color:#122044}.brand small{color:#76819c;font-size:10px}.brand-mark{width:40px;height:44px;background:linear-gradient(145deg,#1b74f6,#13c6d2);clip-path:polygon(50% 0,94% 18%,87% 76%,50% 100%,13% 76%,6% 18%);display:grid;place-items:center}.brand-mark:after{content:'G';font-weight:900;color:#fff;font-size:23px}.brand-mark i{display:none}
.main-nav{gap:30px}.main-nav a{color:#17203e;font-weight:700;font-size:14px;padding:29px 0 24px}.main-nav a:after{height:3px;background:linear-gradient(90deg,var(--brand),var(--brand2));border-radius:3px}.header-cta{box-shadow:0 8px 20px rgba(18,104,243,.25)}
.hero{min-height:520px;margin:0;padding:64px clamp(28px,5vw,84px) 46px;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);align-items:center;overflow:hidden;background:radial-gradient(circle at 73% 13%,rgba(122,96,255,.18),transparent 26%),radial-gradient(circle at 90% 60%,rgba(24,208,221,.21),transparent 32%),linear-gradient(120deg,#fff 20%,#edf5ff 67%,#dffaff);border-bottom:0}
.hero:before{content:'';position:absolute;right:-10%;top:-45%;width:62%;height:150%;background:repeating-radial-gradient(ellipse at center,transparent 0 29px,rgba(69,123,246,.065) 30px 31px);transform:rotate(-16deg)}
.hero-content{max-width:790px;z-index:2}.eyebrow{display:inline-flex;background:#e9f4ff;color:#1268f3;border:1px solid #cfe4ff;border-radius:999px;padding:8px 13px;font-weight:800}.pulse-dot{background:#17bd6b;box-shadow:0 0 0 5px rgba(23,189,107,.13)}
.hero h1{font-size:clamp(48px,5.2vw,78px);line-height:1.02;letter-spacing:-3.2px;margin:22px 0 20px;color:#111a3b}.hero h1 span{color:#247cf4}.hero h1 em{font-style:normal;background:linear-gradient(90deg,#6d4bf6,#0bc1c9);-webkit-background-clip:text;color:transparent}.hero p{font-size:18px;line-height:1.65;color:#5b6682;max-width:720px}
.scan-bar{margin-top:29px;background:#fff;border:2px solid #b8d1f7;border-radius:14px;padding:7px;box-shadow:0 17px 38px rgba(41,95,170,.14);max-width:850px}.scan-tool-icon{background:#edf5ff;color:#247cf4;border-radius:10px}.scan-input-wrap label,.selector-wrap label{color:#7f8ba6}.scan-input-wrap input{font-size:16px}.scan-submit{min-height:57px;border-radius:10px;background:linear-gradient(135deg,#2079f7,#0756df);box-shadow:0 10px 20px rgba(13,93,228,.27)}
.scan-examples{display:flex;gap:8px;align-items:center;margin:12px 0 0;color:#7c87a1;font-size:13px}.scan-examples button{border:0;border-radius:999px;background:#eaf3ff;color:#236edf;padding:6px 10px;cursor:pointer}.hero-trust{display:flex;gap:25px;margin-top:20px;font-size:13px;color:#43506d}.hero-trust span:before{color:#16aa5c}.scan-consent{font-size:11px!important;margin-top:13px!important}
.hero-visual{position:relative;height:430px;z-index:2}.security-platform{position:absolute;left:50%;top:50%;transform:translate(-50%,-42%);width:320px;height:205px;border-radius:45% 45% 20% 20%;background:linear-gradient(145deg,#2ec8e0,#0871fa 50%,#2143bd);box-shadow:0 45px 50px rgba(24,91,196,.28),inset 0 0 0 10px rgba(255,255,255,.22);transform-style:preserve-3d}.security-platform:after{content:'';position:absolute;inset:22px;border:2px solid rgba(255,255,255,.52);border-radius:32%;box-shadow:inset 0 0 36px rgba(0,220,255,.48)}.shield-core{position:absolute;z-index:4;left:50%;top:-87px;transform:translateX(-50%);width:150px;height:180px;clip-path:polygon(50% 0,94% 18%,84% 72%,50% 100%,16% 72%,6% 18%);background:linear-gradient(145deg,#2b80ff,#09d0cf);box-shadow:0 20px 50px rgba(19,96,236,.4);display:grid;place-items:center}.shield-core:before{content:'';position:absolute;inset:10px;clip-path:inherit;border:4px solid rgba(255,255,255,.35)}.shield-core span{font-size:72px;color:#fff;font-weight:900}.security-platform i,.security-platform b{position:absolute;inset:45px;border:1px solid rgba(255,255,255,.33);border-radius:50%;animation:pulseRing 2.5s infinite}.security-platform b{inset:80px;animation-delay:.6s}@keyframes pulseRing{50%{transform:scale(1.15);opacity:.35}}
.float-stat{position:absolute;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);padding:16px 18px;border:1px solid rgba(255,255,255,.9);border-radius:14px;box-shadow:var(--shadow);min-width:145px}.float-stat small,.float-stat span{display:block;color:#75809a;font-size:11px}.float-stat strong{display:block;font-size:26px;margin:5px 0}.stat-a{left:6%;top:12%}.stat-a strong{color:#13944d}.stat-b{right:3%;top:13%}.stat-b strong{color:#16a881}.stat-c{right:0;bottom:9%}.stat-c strong{color:#10814a}
.feature-strip{position:relative;z-index:4;margin:-28px clamp(28px,4vw,70px) 34px;display:grid;grid-template-columns:repeat(7,1fr);gap:12px}.feature-strip button{display:flex;gap:12px;align-items:center;text-align:left;border:1px solid #e2e9f4;background:#fff;padding:16px;border-radius:13px;box-shadow:0 10px 28px rgba(31,71,127,.1);cursor:pointer;min-width:0;transition:.2s}.feature-strip button:hover{transform:translateY(-4px);box-shadow:0 18px 35px rgba(31,71,127,.16)}.feature-strip div{min-width:0}.feature-strip strong,.feature-strip b,.feature-strip small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.feature-strip strong{font-size:13px}.feature-strip b{font-size:13px;color:#236de1;margin:3px 0}.feature-strip small{font-size:10px;color:#8792aa}.feature-icon{width:45px;height:45px;display:grid;place-items:center;color:#fff;border-radius:12px;font-weight:900;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}.fi-green{background:linear-gradient(145deg,#25cf68,#079243)}.fi-blue{background:linear-gradient(145deg,#26a3ff,#075de5)}.fi-purple{background:linear-gradient(145deg,#a260ff,#6632e4)}.fi-orange{background:linear-gradient(145deg,#ffb11d,#f87500)}.fi-teal{background:linear-gradient(145deg,#34cbd0,#0799a8)}.fi-red{background:linear-gradient(145deg,#ff6d83,#ed294e)}.fi-violet{background:linear-gradient(145deg,#8d62ff,#6434de)}
.workspace{margin:0 clamp(28px,4vw,70px) 80px;border:0;gap:22px;background:transparent}.tool-sidebar,.tool-content{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.tool-sidebar{overflow:hidden}.sidebar-sticky{padding:24px}.sidebar-heading{font-size:17px;color:#182342}.tool-search{background:#f5f8fd;border:1px solid #e1e8f3}.category-button{border-radius:10px;color:#53617d}.category-button:hover,.category-button.is-active{background:#edf5ff;color:#1268f3}.category-button.is-active{box-shadow:inset 3px 0 #1268f3}.trust-panel{background:linear-gradient(145deg,#f4f8ff,#eefcfd);border:1px solid #dceafb;border-radius:14px}.tool-content{padding:30px}.section-kicker{color:#1670e9;font-weight:800}.section-heading h2,.knowledge-heading h2,.platform-copy h2,.api-section h2{color:#121c3c;letter-spacing:-1.4px}.tool-grid{gap:15px}.tool-card{border:1px solid #e2e9f4;border-radius:14px;background:linear-gradient(150deg,#fff,#f8fbff);box-shadow:0 7px 18px rgba(32,72,128,.06)}.tool-card:hover{transform:translateY(-4px);border-color:#b9d4ff;box-shadow:0 17px 30px rgba(32,89,171,.14)}.tool-card.is-selected{border-color:#4593ff;box-shadow:0 0 0 3px rgba(44,130,246,.11),0 17px 30px rgba(32,89,171,.14)}.tool-icon{border-radius:12px;background:linear-gradient(145deg,#eaf4ff,#e8fdfd);color:#1268f3}.tool-badge{background:#eee8ff;color:#7043e9}.tool-card h3{color:#182342}.tool-card-footer{color:#176ae4}
.result-section{margin:0 clamp(28px,4vw,70px) 80px;background:#f7faff;border:1px solid #dce6f4;border-radius:20px;padding:28px;box-shadow:var(--shadow)}.result-toolbar{background:#fff;border:1px solid #e1e8f3;border-radius:15px;padding:20px}.result-hero{gap:16px}.score-card,.summary-card,.module-score,.finding{background:#fff;border-color:#e0e8f3;box-shadow:0 8px 22px rgba(35,74,128,.07)}.summary-card{border-radius:13px}.summary-card[data-summary-filter=bad]{border-color:#ffc5ce}.summary-card[data-summary-filter=warn]{border-color:#ffd8a4}.summary-card[data-summary-filter=good]{border-color:#bdebd1}.summary-card[data-summary-filter=info]{border-color:#c6dcff}.summary-card:hover{transform:translateY(-3px)}.finding{border-radius:13px;overflow:hidden}.finding[data-status=bad]{border-left:4px solid var(--red)}.finding[data-status=warn]{border-left:4px solid var(--orange)}.finding[data-status=good]{border-left:4px solid var(--green)}.finding[data-status=info]{border-left:4px solid var(--brand)}.finding-summary{padding:19px}.finding-filters button.is-active{background:#166ff0;color:#fff}
.knowledge-section{margin:0 clamp(28px,4vw,70px) 80px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:42px;box-shadow:var(--shadow)}.knowledge-grid{gap:16px}.knowledge-card{border:1px solid #e2e9f4;border-radius:16px;background:linear-gradient(145deg,#fff,#f8fbff);position:relative;overflow:hidden}.knowledge-card:before{content:'';position:absolute;right:-28px;top:-30px;width:90px;height:90px;border-radius:50%;background:linear-gradient(145deg,rgba(29,112,244,.15),rgba(21,204,209,.12))}.knowledge-card:hover{transform:translateY(-5px);border-color:#b9d4ff;box-shadow:0 18px 35px rgba(30,79,150,.13)}
.platform-section{margin:0 clamp(28px,4vw,70px) 80px;border-radius:24px;background:linear-gradient(135deg,#081d48,#073678 58%,#085c96);box-shadow:0 28px 55px rgba(4,34,89,.25)}.platform-copy h2,.platform-copy p,.platform-points strong,.platform-points p{color:#fff}.platform-points div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);border-radius:14px}.platform-points span{color:#39d4d8}.api-section{margin:0 clamp(28px,4vw,70px) 80px;border-radius:20px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow)}.api-section pre{background:#081d48;border-radius:15px}
.footer{background:#061a3e;color:#d9e5fa;padding:44px clamp(28px,4vw,70px);border-top:0}.footer p{color:#aabbd6}.footer .brand strong{color:#fff}
.button-primary{background:linear-gradient(135deg,#2080fa,#0758df);border:0}.button-ghost{background:#fff;border-color:#dbe5f4;color:#155fd4}
@media(max-width:1200px){.feature-strip{grid-template-columns:repeat(4,1fr)}.hero{grid-template-columns:1fr .75fr}.hero h1{font-size:56px}.main-nav{gap:18px}.main-nav a{font-size:13px}}
@media(max-width:900px){.topbar{padding:0 20px}.main-nav{display:none}.header-cta{display:none}.hero{grid-template-columns:1fr;padding:45px 22px 70px}.hero-visual{display:none}.feature-strip{margin:-37px 18px 28px;grid-template-columns:repeat(2,1fr)}.workspace,.result-section,.knowledge-section,.platform-section,.api-section{margin-left:18px;margin-right:18px}.workspace{grid-template-columns:1fr}.tool-sidebar{position:static}.category-list{display:flex;overflow:auto;gap:7px}.category-button{min-width:max-content}.knowledge-section{padding:28px}}
@media(max-width:560px){.brand strong{font-size:24px}.topbar{height:66px}.hero h1{font-size:42px;letter-spacing:-2px}.hero p{font-size:16px}.scan-bar{display:grid;grid-template-columns:48px 1fr}.scan-submit{grid-column:1/-1}.feature-strip{grid-template-columns:1fr}.feature-strip button:nth-child(n+5){display:none}.tool-content{padding:20px}.knowledge-section{padding:22px}.result-section{padding:15px}.hero-trust{flex-wrap:wrap;gap:10px 18px}}

/* CYBEROCENA 1.5 — widescreen cyber dashboard */
:root{
  --bg:#031126;--bg-soft:#061a36;--surface:#081d38;--surface-2:#0c2748;--surface-3:#10345b;
  --line:rgba(112,166,235,.20);--line-strong:rgba(112,166,235,.38);--text:#f4f8ff;--muted:#9cb0cd;--muted-2:#7087a8;
  --primary:#15d2c2;--primary-strong:#08b7a9;--blue:#2f7dff;--good:#4fe2a2;--warn:#ffbe46;--bad:#ff5e76;--info:#55a8ff;
  --shadow:0 22px 60px rgba(0,0,0,.30);--max:1840px;--radius:18px;
}
:root[data-theme="light"]{--bg:#031126;--bg-soft:#061a36;--surface:#081d38;--surface-2:#0c2748;--surface-3:#10345b;--line:rgba(112,166,235,.20);--line-strong:rgba(112,166,235,.38);--text:#f4f8ff;--muted:#9cb0cd;--muted-2:#7087a8;--primary:#15d2c2;--primary-strong:#08b7a9;--blue:#2f7dff;--good:#4fe2a2;--warn:#ffbe46;--bad:#ff5e76;--info:#55a8ff}
body{background:radial-gradient(circle at 75% 0,rgba(25,90,255,.16),transparent 30%),linear-gradient(180deg,#031126 0,#04162e 54%,#031126 100%);color:var(--text)}
.topbar{height:68px;padding:0 max(34px,calc((100vw - var(--max))/2));background:rgba(2,13,32,.88);border-bottom:1px solid rgba(89,143,218,.18);box-shadow:0 10px 30px rgba(0,0,0,.18)}
.brand strong{font-size:24px;letter-spacing:-.5px;color:#fff}.brand small{color:#8499b7}.brand-mark{width:38px;height:42px;background:linear-gradient(145deg,#307aff,#08d2cf);filter:drop-shadow(0 8px 18px rgba(24,116,255,.35))}.brand-mark:after{content:'G'}
.main-nav a{color:#b7c6dc;padding:25px 0 21px}.main-nav a:hover,.main-nav a.is-active{color:#fff}.main-nav a.is-active:after{background:linear-gradient(90deg,#16dfc9,#2a7bff)}
.icon-button,.view-controls button{background:#071a33;border-color:var(--line);color:#9db0ca}.button-primary{color:#fff;background:linear-gradient(135deg,#2d84ff,#0756df);box-shadow:0 12px 30px rgba(22,94,238,.38)}.button-ghost{background:#071a33;border-color:var(--line);color:#dce8fa}
.hero{min-height:500px;margin:0;padding:48px max(34px,calc((100vw - var(--max))/2)) 46px;grid-template-columns:minmax(540px,.95fr) minmax(560px,1.05fr);gap:50px;background:radial-gradient(circle at 75% 38%,rgba(19,103,255,.28),transparent 25%),radial-gradient(circle at 93% 20%,rgba(17,206,205,.14),transparent 24%),linear-gradient(110deg,#031126 0,#06224a 57%,#041b3a 100%);border-bottom:1px solid rgba(92,153,233,.18)}
.hero:before{right:-4%;top:-60%;width:62%;height:190%;opacity:.5;background:repeating-radial-gradient(ellipse at center,transparent 0 39px,rgba(70,135,246,.12) 40px 41px)}
.hero:after{height:64px;background:linear-gradient(transparent,#031126)}
.hero-content{width:auto;max-width:820px;text-align:left}.eyebrow{padding:7px 12px;background:rgba(10,42,81,.78);border-color:rgba(54,132,255,.35);color:#7bb3ff}
.hero h1{max-width:850px;margin:16px 0 14px;font-size:clamp(50px,4.7vw,78px);color:#fff}.hero h1 span{background:linear-gradient(90deg,#4b8fff,#23b9f4);-webkit-background-clip:text;color:transparent}.hero h1 em{background:linear-gradient(90deg,#47d4f0,#1ce0bd);-webkit-background-clip:text;color:transparent}
.hero > .hero-content > p{margin:0;max-width:720px;color:#b2c2d9;font-size:16px}.scan-bar{width:100%;max-width:960px;min-height:74px;margin:26px 0 0;padding:8px;background:rgba(5,25,53,.90);border:1px solid rgba(84,150,239,.45);border-radius:13px;box-shadow:0 20px 52px rgba(0,0,0,.32),inset 0 0 0 1px rgba(255,255,255,.02)}
.scan-tool-icon{background:linear-gradient(145deg,#0a315c,#0d2545);border-color:rgba(63,145,255,.32);color:#5ca8ff}.scan-input-wrap label,.selector-wrap label,.scan-test-wrap label{color:#7890b0;font-size:9px;text-transform:uppercase;letter-spacing:.11em;font-weight:850}.scan-input-wrap input,.selector-wrap input{color:#fff}.scan-input-wrap input::placeholder,.selector-wrap input::placeholder{color:#8aa0bd}.scan-test-wrap{min-width:245px;display:grid;padding:0 12px;border-left:1px solid var(--line)}.scan-test-wrap select{height:35px;padding:0 34px 0 0;color:#eaf2ff;background:transparent;border:0;outline:0;font-weight:750;appearance:auto;cursor:pointer}.scan-test-wrap select option,.scan-test-wrap select optgroup{color:#102039;background:#fff}.selector-wrap{border-left:1px solid var(--line);padding-left:12px}.scan-submit{min-height:56px;white-space:nowrap;padding:0 22px}.scan-examples{justify-content:flex-start;color:#7f96b5}.scan-examples button{background:rgba(28,89,173,.22);color:#83b5ff;border:1px solid rgba(60,132,232,.18)}.hero-trust{justify-content:flex-start;color:#b3c3d8}.scan-consent{color:#7188a8!important}.hero-visual{height:400px;min-width:560px}.security-platform{width:410px;height:250px;background:linear-gradient(145deg,#0f63da,#083c9b 55%,#072b72);box-shadow:0 45px 80px rgba(0,48,139,.48),inset 0 0 0 8px rgba(66,152,255,.16)}.shield-core{top:-76px;width:132px;height:160px;background:linear-gradient(145deg,#226fff,#0ed2c4)}.shield-core span{font-size:60px}.float-stat{background:rgba(8,30,61,.78);border:1px solid rgba(94,158,241,.26);box-shadow:0 20px 45px rgba(0,0,0,.28);color:#fff}.float-stat small,.float-stat span{color:#91a8c7}.float-stat strong{color:#4fe2a2}.stat-a{left:1%;top:15%}.stat-b{right:1%;top:10%}.stat-c{right:6%;bottom:3%}
.feature-strip{margin:-21px max(34px,calc((100vw - var(--max))/2)) 16px;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}.feature-strip button{min-height:72px;padding:12px 14px;background:linear-gradient(145deg,rgba(9,32,62,.96),rgba(6,24,48,.96));border-color:rgba(91,152,229,.20);box-shadow:0 14px 32px rgba(0,0,0,.22);color:#fff}.feature-strip button:hover{transform:translateY(-3px);border-color:rgba(81,156,255,.48);box-shadow:0 20px 38px rgba(0,0,0,.30)}.feature-strip b{color:#55a8ff}.feature-strip small{color:#8198b6}.feature-icon{width:40px;height:40px;border-radius:10px}
.workspace{width:auto;margin:0 max(34px,calc((100vw - var(--max))/2)) 48px;padding:0;display:grid;grid-template-columns:220px minmax(620px,1fr) 345px;gap:12px;align-items:start}.tool-sidebar,.tool-content,.workspace-rail .rail-panel{background:linear-gradient(155deg,rgba(8,31,61,.98),rgba(5,24,48,.98));border:1px solid rgba(91,152,229,.20);border-radius:14px;box-shadow:0 16px 34px rgba(0,0,0,.20)}.sidebar-sticky{padding:18px}.sidebar-heading{color:#fff}.tool-search{background:#06172e;border-color:var(--line)}.tool-search input{color:#fff}.category-button{color:#9fb1ca}.category-button:hover,.category-button.is-active{background:linear-gradient(90deg,rgba(25,104,245,.95),rgba(20,87,218,.88));color:#fff}.category-button.is-active{box-shadow:none}.trust-panel{display:none}.tool-content{padding:20px}.section-kicker{color:#65a8ff}.section-heading{margin-bottom:14px}.section-heading h2,.knowledge-heading h2,.platform-copy h2,.api-section h2{color:#fff;letter-spacing:-1px}.section-heading p{color:#8ea4c1}.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.tool-card{min-height:196px;padding:15px;background:linear-gradient(145deg,rgba(12,42,78,.96),rgba(7,27,53,.96));border-color:rgba(94,156,234,.17);box-shadow:none}.tool-card:hover{transform:translateY(-3px);border-color:rgba(83,160,255,.52);box-shadow:0 18px 32px rgba(0,0,0,.23)}.tool-card.is-selected{border-color:#2d82ff;box-shadow:0 0 0 2px rgba(45,130,255,.15)}.tool-icon{background:linear-gradient(145deg,#164c93,#0a2e5d);color:#63adff}.tool-card h3{color:#fff;font-size:15px}.tool-card p{color:#91a6c3;font-size:11px}.tool-card-footer{color:#6baeff;border-color:var(--line)}.tool-category{color:#6682a7}.tool-badge{background:#6c3df0;color:#fff}.all-tools-link{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:10px;padding:9px;border:1px solid rgba(50,125,255,.45);border-radius:8px;color:#dce9ff;font-size:12px;font-weight:800}.all-tools-link:hover{background:rgba(36,110,238,.14)}
.workspace-rail{display:grid;gap:12px}.workspace-rail .rail-panel{padding:16px}.rail-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;color:#dce9fb;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.rail-heading a{color:#5ba3ff;font-size:10px;text-transform:none;letter-spacing:0}.rail-tool{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 0;color:#fff;background:transparent;border:0;border-bottom:1px solid var(--line);text-align:left;cursor:pointer}.rail-tool:last-child{border-bottom:0}.rail-tool:hover strong{color:#66afff}.rail-tool span:nth-child(2){min-width:0}.rail-tool strong,.rail-tool small{display:block}.rail-tool strong{font-size:12px}.rail-tool small{margin-top:2px;color:#7f96b6;font-size:9px}.rail-tool b{padding:3px 6px;border-radius:5px;background:#6838ef;color:#fff;font-size:8px;text-transform:uppercase}.rail-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;font-weight:900}.rail-icon.blue{background:#1268f3}.rail-icon.cyan{background:#08aaa8}.rail-icon.red{background:#ef4b67}.rail-icon.green{background:#17a96a}.source-chip-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.source-chip-grid span{padding:8px;border:1px solid var(--line);border-radius:8px;color:#a8bee0;background:#06172f;text-align:center;font-size:10px;font-weight:800}.rail-sources p{margin:11px 0 0;color:#8198b6;font-size:10px}.rail-knowledge a{display:block;padding:10px 0;border-bottom:1px solid var(--line)}.rail-knowledge a:last-child{border-bottom:0}.rail-knowledge strong,.rail-knowledge small{display:block}.rail-knowledge strong{font-size:11px;color:#edf5ff}.rail-knowledge small{margin-top:2px;color:#7890b0;font-size:9px}
.result-section,.knowledge-section,.platform-section,.api-section{width:auto;margin-left:max(34px,calc((100vw - var(--max))/2));margin-right:max(34px,calc((100vw - var(--max))/2))}.result-section{background:#06172f;border-color:var(--line)}.result-toolbar,.score-card,.summary-card,.module-score,.finding{background:#081d38;border-color:var(--line);box-shadow:none}.finding-toolbar p,.finding-main p,.detail-grid p,.report-disclaimer p{color:#91a6c3}.knowledge-section{padding:30px;background:#06172f;border-color:var(--line)}.knowledge-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.knowledge-card{min-height:215px;padding:22px;background:linear-gradient(145deg,#0a2444,#071a33);border-color:var(--line)}.knowledge-card h3{color:#fff;font-size:18px}.knowledge-card p{color:#91a6c3;font-size:13px}.platform-section{background:linear-gradient(135deg,#061c3c,#073575 58%,#075981)}.api-section{background:#071a33;border-color:var(--line)}.footer{background:#020c1d;color:#d9e5fa}
@media(min-width:1900px){.hero{grid-template-columns:minmax(620px,.9fr) minmax(720px,1.1fr)}.hero h1{font-size:82px}.hero-visual{height:430px}.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1450px){.workspace{grid-template-columns:210px minmax(0,1fr)}.workspace-rail{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero{grid-template-columns:1fr .85fr}.scan-test-wrap{min-width:210px}}
@media(max-width:1100px){.hero{grid-template-columns:1fr;padding-bottom:76px}.hero-visual{display:none}.feature-strip{grid-template-columns:repeat(4,1fr)}.workspace{grid-template-columns:1fr}.workspace-rail{grid-template-columns:1fr 1fr}.tool-sidebar{position:static}.category-list{display:flex;overflow:auto;gap:7px}.category-button{min-width:max-content}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.topbar{padding:0 18px}.hero{padding:38px 18px 70px}.hero h1{font-size:44px}.scan-bar{display:grid;grid-template-columns:44px minmax(0,1fr)}.scan-test-wrap{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);padding:8px 6px 0}.selector-wrap{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);padding:8px 6px 0}.scan-submit{grid-column:1/-1}.feature-strip{margin:-34px 18px 20px;grid-template-columns:repeat(2,1fr)}.workspace,.result-section,.knowledge-section,.platform-section,.api-section{margin-left:18px;margin-right:18px}.workspace-rail{grid-template-columns:1fr}.tool-grid,.knowledge-grid{grid-template-columns:1fr}.tool-content{padding:16px}}

/* CYBEROCENA 1.7 — implementation of the approved widescreen mockup */
:root{
  --max: 1840px;
  --bg:#020b1b;--surface:#071a34;--surface-2:#0a2344;--surface-3:#0b2b53;
  --text:#f4f8ff;--muted:#95a8c3;--muted-2:#6f86a8;--line:rgba(91,151,229,.19);
  --line-strong:rgba(76,153,255,.38);--primary:#20d6bc;--blue:#2f7cff;
}
html{background:#020b1b}.app-shell{background:radial-gradient(circle at 62% 12%,rgba(24,99,255,.14),transparent 29%),#020b1b;color:#f4f8ff}
.topbar{height:60px;background:rgba(2,9,24,.94);border-bottom:1px solid rgba(86,139,221,.18);backdrop-filter:blur(18px);padding-inline:max(34px,calc((100vw - var(--max))/2))}
.brand strong{color:#fff}.brand small{color:#7e91ad}.main-nav a{color:#dbe6f8}.main-nav a.is-active{color:#fff}.main-nav a.is-active:after{background:linear-gradient(90deg,#21d7bf,#357cff)}
.hero{min-height:475px;padding:44px max(34px,calc((100vw - var(--max))/2)) 62px;grid-template-columns:minmax(610px,.92fr) minmax(690px,1.08fr);gap:28px;background:radial-gradient(circle at 71% 44%,rgba(17,99,255,.24),transparent 28%),linear-gradient(110deg,#020b1b,#041b3d 58%,#03142d);overflow:hidden}
.hero:before{content:"";position:absolute;inset:-25% -12% -20% 45%;background:repeating-radial-gradient(ellipse at center,transparent 0 52px,rgba(65,137,250,.09) 53px 54px);transform:rotate(-10deg);pointer-events:none}
.hero-content{z-index:4;max-width:760px}.hero h1{font-size:clamp(54px,4.6vw,82px);line-height:.98;margin:14px 0 17px}.hero > .hero-content > p{max-width:650px;font-size:15px;line-height:1.55}
.scan-bar{max-width:900px;min-height:68px;margin-top:24px}.scan-test-wrap{min-width:210px}.scan-submit{min-height:52px}
.hero-dashboard{position:relative;min-width:690px;height:390px;z-index:3;perspective:1100px}.cyber-globe{position:absolute;left:2%;top:18%;width:430px;height:300px;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(23,121,255,.19),rgba(3,19,48,.02) 62%),repeating-radial-gradient(circle at 50% 50%,transparent 0 38px,rgba(43,125,240,.16) 39px 40px);border:1px solid rgba(45,132,255,.2);box-shadow:0 0 70px rgba(17,86,225,.28)}
.cyber-globe:before,.cyber-globe:after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(42,126,240,.17);transform:rotate(24deg) scaleY(.45)}.cyber-globe:after{transform:rotate(-30deg) scaleX(.42)}
.cyber-globe span,.cyber-globe i,.cyber-globe b{position:absolute;width:7px;height:7px;border-radius:50%;background:#2b88ff;box-shadow:0 0 14px #2b88ff}.cyber-globe span{left:22%;top:38%}.cyber-globe i{right:19%;top:27%}.cyber-globe b{left:46%;bottom:21%}
.domain-console{position:absolute;right:14%;top:6%;width:292px;height:335px;padding:20px;background:linear-gradient(155deg,rgba(16,65,145,.92),rgba(5,26,64,.93));border:1px solid rgba(80,155,255,.44);border-radius:18px;box-shadow:0 30px 70px rgba(0,31,111,.55),inset 0 0 45px rgba(45,119,255,.12);transform:rotateY(-8deg) rotateX(2deg)}
.domain-console:after{content:"";position:absolute;inset:8px;border:1px solid rgba(104,173,255,.12);border-radius:13px;pointer-events:none}.console-top small,.console-top strong{display:block}.console-top small{color:#8da8d1;font-size:10px}.console-top strong{margin-top:3px;font-size:18px}.console-score{display:grid;place-items:center;margin:7px 0}.console-ring{width:92px;height:92px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(#20d8b7 0 78%,rgba(74,139,255,.15) 78%);box-shadow:0 0 30px rgba(27,213,182,.23)}.console-ring:before{content:"";width:68px;height:68px;border-radius:50%;background:#0b3269;box-shadow:inset 0 0 20px rgba(54,145,255,.38)}.console-ring span{position:absolute;font-size:33px;color:#8dffd5}.console-summary{position:relative;z-index:2;padding:12px;background:rgba(2,16,40,.42);border:1px solid rgba(94,157,244,.15);border-radius:10px}.console-summary>strong{font-size:11px}.console-summary p{display:flex;justify-content:space-between;margin:7px 0;color:#9bb0cf;font-size:9px}.console-summary b{color:#fff}.console-chart{height:35px;margin-top:9px;position:relative;overflow:hidden;background:linear-gradient(180deg,transparent,rgba(24,101,245,.14))}.console-chart:before{content:"";position:absolute;left:0;right:0;bottom:8px;height:2px;background:linear-gradient(135deg,transparent 3%,#2884ff 4% 8%,transparent 9% 15%,#28a8ff 16% 24%,transparent 25% 31%,#3e77ff 32% 46%,transparent 47% 51%,#1de0c1 52% 65%,transparent 66% 73%,#2982ff 74% 86%,transparent 87%);filter:drop-shadow(0 0 5px #2d8bff)}
.float-stat{position:absolute;z-index:7;min-width:128px;padding:15px;background:rgba(8,28,61,.82);border:1px solid rgba(88,157,248,.34);border-radius:13px;box-shadow:0 22px 48px rgba(0,0,0,.34);backdrop-filter:blur(14px)}.float-stat small,.float-stat strong,.float-stat span{display:block}.float-stat small{color:#8fa7ca;font-size:9px}.float-stat strong{margin:7px 0 3px;color:#45e6a3;font-size:24px}.float-stat span{color:#91a5c2;font-size:9px}.stat-a{left:21%;top:15%}.stat-b{right:1%;top:17%}.stat-c{right:5%;bottom:1%}
.feature-strip{position:relative;z-index:8;margin:-22px max(34px,calc((100vw - var(--max))/2)) 14px}.feature-strip button{min-height:68px}
.platform-section{min-height:365px;margin-bottom:10px;padding:28px 52px;grid-template-columns:1.03fr .97fr;gap:38px;background:radial-gradient(circle at 73% 50%,rgba(11,173,173,.12),transparent 27%),linear-gradient(135deg,#04142d,#071f42 58%,#052640);border-color:rgba(49,142,230,.25);border-radius:16px}.platform-copy h2{font-size:clamp(34px,3.1vw,52px);max-width:740px;line-height:1.05}.platform-copy>p{font-size:13px;line-height:1.5}.platform-points{margin-top:20px;gap:15px 28px}.platform-points div{padding:11px 8px;background:transparent!important;border:0!important}.platform-points span{font-size:13px;border:1px solid rgba(32,214,188,.5);border-radius:5px;padding:3px 5px;height:max-content}.platform-points strong{font-size:13px}.platform-points p{font-size:10px!important}.platform-visual{min-height:300px}.radar{width:300px;height:300px;border-color:rgba(57,217,200,.35);background:repeating-radial-gradient(circle,transparent 0 43px,rgba(54,195,188,.22) 44px 45px),conic-gradient(from 210deg,rgba(27,231,195,.35),transparent 20%)}.card-a{left:5%;top:8%}.card-b{right:4%;top:18%}.card-c{left:18%;bottom:4%}
.trust-metrics{width:auto;margin:0 max(34px,calc((100vw - var(--max))/2)) 26px;display:grid;grid-template-columns:minmax(540px,1fr) repeat(3,220px);gap:10px}.trust-logos,.metric-card{min-height:74px;display:flex;align-items:center;background:linear-gradient(145deg,rgba(8,28,55,.96),rgba(4,20,42,.96));border:1px solid rgba(91,151,229,.18);border-radius:12px}.trust-logos{gap:28px;padding:15px 25px;color:#778ba7}.trust-logos span{max-width:120px;font-size:11px}.trust-logos b{font-size:18px;opacity:.78;letter-spacing:.03em}.metric-card{gap:13px;padding:14px 19px}.metric-icon{width:38px;height:38px;display:grid;place-items:center;color:#5ca1ff;border:1px solid rgba(75,143,239,.32);border-radius:10px;font-size:21px}.metric-card strong,.metric-card small{display:block}.metric-card strong{color:#63a7ff;font-size:18px}.metric-card small{margin-top:3px;color:#8195b2;font-size:9px}
.api-section{margin-top:45px}
@media(max-width:1500px){.hero{grid-template-columns:1fr .85fr}.hero-dashboard{min-width:560px;transform:scale(.9);transform-origin:right center}.trust-metrics{grid-template-columns:1fr repeat(3,190px)}.trust-logos{gap:18px}.trust-logos b{font-size:15px}}
@media(max-width:1180px){.hero-dashboard{display:none}.hero{grid-template-columns:1fr}.trust-metrics{grid-template-columns:1fr 1fr}.trust-logos{grid-column:1/-1;overflow:auto}.platform-section{grid-template-columns:1fr}.platform-visual{min-height:330px}}
@media(max-width:700px){.trust-metrics{grid-template-columns:1fr}.trust-logos{display:none}.platform-section{padding:30px 22px}.platform-copy h2{font-size:34px}.platform-points{grid-template-columns:1fr}}

/* v1.8 — osobne katalogi narzędzi i bazy wiedzy */
.listing-page{max-width:1840px;margin:0 auto;padding:48px 34px 80px}.listing-hero{padding:44px 0 34px;max-width:1050px}.listing-hero h1{font-size:clamp(2.7rem,5vw,5.4rem);line-height:1.02;margin:10px 0 18px;letter-spacing:-.045em}.listing-hero p{font-size:clamp(1.05rem,1.7vw,1.38rem);line-height:1.7;color:var(--muted);max-width:900px}.tools-catalog,.article-catalog{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.catalog-tool-card,.knowledge-card-full{display:flex;flex-direction:column;min-height:250px;padding:24px;border-radius:24px;background:linear-gradient(180deg,rgba(10,29,62,.94),rgba(4,17,39,.96));border:1px solid var(--line);box-shadow:0 18px 44px rgba(0,0,0,.24);transition:.2s ease}.catalog-tool-card:hover,.knowledge-card-full:hover{transform:translateY(-4px);border-color:rgba(82,147,255,.48)}.catalog-tool-card>span,.knowledge-card-full>span{color:#67e8c2;font-size:.78rem;letter-spacing:.11em;text-transform:uppercase;font-weight:800}.catalog-tool-card h2,.knowledge-card-full h2{font-size:1.45rem;line-height:1.22;margin:16px 0 10px}.catalog-tool-card p,.knowledge-card-full p{color:var(--muted);line-height:1.62;margin:0 0 22px}.catalog-tool-card strong,.knowledge-card-full strong{margin-top:auto;color:#8bc0ff}.knowledge-card-full{min-height:290px}.knowledge-card-full h2{font-size:1.6rem}.main-nav a.is-active{color:#fff;border-bottom:2px solid #4b86ff}
@media(max-width:1450px){.tools-catalog,.article-catalog{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1000px){.tools-catalog,.article-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.listing-page{padding-inline:22px}}
@media(max-width:650px){.tools-catalog,.article-catalog{grid-template-columns:1fr}.listing-page{padding:26px 14px 50px}.listing-hero{padding-top:28px}.listing-hero h1{font-size:clamp(2.25rem,11vw,3.2rem)}.catalog-tool-card,.knowledge-card-full{min-height:auto}.article-header h1{font-size:clamp(2rem,9vw,3rem)}}

/* v1.9 — counters and richer knowledge articles */
.trust-metrics-counters{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}
.trust-metrics-counters .metric-card{
  min-height:118px;
  padding:24px 28px;
  border-radius:20px;
  justify-content:flex-start;
  background:linear-gradient(145deg,rgba(11,31,68,.97),rgba(5,19,45,.98));
  border:1px solid rgba(84,145,255,.24);
  box-shadow:0 18px 42px rgba(0,0,0,.25);
}
.trust-metrics-counters .metric-card-primary{
  background:linear-gradient(145deg,rgba(17,50,104,.98),rgba(7,29,67,.98));
  border-color:rgba(76,151,255,.42);
}
.trust-metrics-counters .metric-icon{
  width:58px;height:58px;border-radius:17px;display:grid;place-items:center;
  flex:0 0 58px;font-size:28px;color:#5de5ff;background:rgba(25,82,159,.32);
  border:1px solid rgba(92,160,255,.28);
}
.trust-metrics-counters strong{font-size:clamp(1.65rem,2.4vw,2.35rem);line-height:1.1;color:#fff}
.trust-metrics-counters small{font-size:.92rem;color:#9fb3d7;margin-top:7px}

.article-page-wide{width:min(1740px,calc(100% - 56px));padding:112px 0 90px}
.article-header-premium{max-width:1080px;margin:0 auto 46px;text-align:center}
.article-header-premium .section-kicker{display:inline-flex}
.article-header-premium h1{
  max-width:1040px;margin:14px auto 20px;
  font-size:clamp(2.25rem,3vw,3.75rem);
  line-height:1.08;letter-spacing:-.035em;text-wrap:balance
}
.article-header-premium .article-lead{max-width:940px;margin-left:auto;margin-right:auto;font-size:clamp(1.05rem,1.45vw,1.3rem)}
.article-layout{display:grid;grid-template-columns:250px minmax(0,820px) 290px;gap:28px;justify-content:center;align-items:start}
.article-body-premium{max-width:none;margin:0;padding:34px 42px;background:linear-gradient(180deg,rgba(10,29,62,.92),rgba(5,18,42,.96));border:1px solid var(--line);border-radius:26px;box-shadow:0 20px 52px rgba(0,0,0,.23)}
.article-body-premium section{position:relative;margin:0;padding:0 0 42px 52px;border-left:1px solid rgba(90,154,255,.2)}
.article-body-premium section:last-of-type{padding-bottom:8px}
.article-body-premium section:before{content:'';position:absolute;left:-5px;top:11px;width:9px;height:9px;border-radius:50%;background:#38d8bd;box-shadow:0 0 0 6px rgba(56,216,189,.09),0 0 20px rgba(56,216,189,.38)}
.article-body-premium .section-number{position:absolute;left:18px;top:2px;color:#4db8ff;font-size:.78rem;font-weight:800;letter-spacing:.08em}
.article-body-premium h2{margin:0 0 14px;font-size:clamp(1.55rem,2vw,2rem);line-height:1.2;color:#f5f8ff}
.article-body-premium p{margin:0;color:#aebfdd;font-size:1.05rem;line-height:1.85}
.article-side{display:grid;gap:18px}
.article-side-card{padding:22px;border-radius:20px;background:linear-gradient(180deg,rgba(10,29,62,.92),rgba(5,18,42,.95));border:1px solid var(--line);box-shadow:0 16px 38px rgba(0,0,0,.2)}
.sticky-card{position:sticky;top:102px}
.side-kicker{display:block;margin-bottom:16px;color:#54d9bf;font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;font-weight:800}
.article-toc{display:grid;gap:8px}
.article-toc a{display:grid;grid-template-columns:30px 1fr;gap:8px;padding:11px 10px;border-radius:12px;color:#c6d5ee;font-size:.9rem;line-height:1.35;transition:.18s ease}
.article-toc a:hover{background:rgba(48,111,218,.17);color:#fff}
.article-toc a span{color:#4aa8ff;font-weight:800}
.article-score-note strong{display:inline-block;margin-top:8px;color:#edf5ff}
.article-score-note p{display:inline;margin:0 0 0 6px;color:#95aacd;font-size:.88rem}
.test-promo-card{background:radial-gradient(circle at 90% 0,rgba(50,188,218,.18),transparent 42%),linear-gradient(145deg,rgba(12,41,83,.97),rgba(5,21,49,.98))}
.test-promo-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(145deg,#166fee,#24cbd1);color:#fff;font-size:28px;box-shadow:0 12px 25px rgba(20,106,225,.25)}
.test-promo-card h2{font-size:1.35rem;margin:18px 0 8px}
.test-promo-card p{color:#a8bbda;line-height:1.6;font-size:.92rem}
.test-promo-card .button{width:100%;margin-top:12px}
.related-articles{display:grid;gap:10px}
.related-articles a{display:block;padding:13px;border-radius:14px;background:rgba(8,25,57,.65);border:1px solid rgba(255,255,255,.06);transition:.18s ease}
.related-articles a:hover{transform:translateX(3px);border-color:rgba(74,148,255,.35)}
.related-articles small,.related-articles strong,.related-articles span{display:block}
.related-articles small{color:#55d9c0;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.related-articles strong{margin:6px 0 8px;color:#edf5ff;font-size:.92rem;line-height:1.35}
.related-articles span{color:#79b4ff;font-size:.82rem;font-weight:700}

@media(max-width:1280px){
  .article-layout{grid-template-columns:220px minmax(0,760px)}
  .article-side-right{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}
  .article-side-right .test-promo-card,.article-side-right .article-side-card{min-height:100%}
}
@media(max-width:900px){
  .trust-metrics-counters{grid-template-columns:1fr}
  .article-page-wide{width:min(100% - 30px,1740px);padding-top:92px}
  .article-layout{grid-template-columns:1fr}
  .article-side-left{grid-template-columns:1fr 1fr;grid-row:2}
  .sticky-card{position:static}
  .article-body-premium{grid-row:1;padding:28px 26px}
  .article-side-right{grid-template-columns:1fr 1fr;grid-row:3}
}
@media(max-width:620px){
  .article-header-premium h1{font-size:clamp(1.9rem,8.5vw,2.7rem);line-height:1.1}
  .article-header-premium{margin-bottom:28px}
  .article-side-left,.article-side-right{grid-template-columns:1fr}
  .article-body-premium{padding:24px 18px}
  .article-body-premium section{padding-left:38px}
  .article-body-premium .section-number{left:12px}
  .article-body-premium p{font-size:1rem;line-height:1.72}
  .article-cta{padding:22px}
}


/* v2.0 — animated counters, complete light theme and knowledge center footer */
.knowledge-section-actions{display:flex;justify-content:center;margin-top:28px}
.trust-metrics-counters .metric-card{position:relative;overflow:hidden}
.trust-metrics-counters .metric-card:after{content:"";position:absolute;inset:auto -20% -65% 25%;height:140px;background:radial-gradient(circle,color-mix(in srgb,var(--primary) 18%,transparent),transparent 70%);pointer-events:none}
.trust-metrics-counters strong{font-variant-numeric:tabular-nums;min-width:10ch;display:block}

.knowledge-footer-premium{width:min(var(--max),calc(100% - 48px));margin:28px auto 24px;padding:34px;display:grid;grid-template-columns:minmax(320px,.85fr) minmax(0,1.15fr);gap:38px;background:linear-gradient(135deg,color-mix(in srgb,var(--surface) 92%,var(--blue)),var(--surface));border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow)}
.knowledge-footer-intro h2{margin:10px 0 14px;font-size:clamp(1.8rem,3vw,3rem);line-height:1.08;letter-spacing:-.035em}.knowledge-footer-intro p{max-width:620px;margin:0 0 22px;color:var(--muted);line-height:1.7}.knowledge-footer-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.knowledge-footer-links>div{padding:20px;border-radius:18px;background:color-mix(in srgb,var(--surface-2) 82%,transparent);border:1px solid var(--line)}.knowledge-footer-links strong{display:block;margin-bottom:12px;color:var(--text)}.knowledge-footer-links a{display:block;padding:8px 0;color:var(--muted);font-size:.92rem;border-bottom:1px solid var(--line)}.knowledge-footer-links a:last-child{border-bottom:0}.knowledge-footer-links a:hover{color:var(--primary)}
.footer-premium{margin-top:0}

/* Comprehensive light theme overrides for legacy hard-coded dark panels */
:root[data-theme="light"] body{background:#f4f8fc;color:var(--text)}
:root[data-theme="light"] .app-shell{background:linear-gradient(180deg,#f7fbff,#edf4f9)}
:root[data-theme="light"] .topbar{background:rgba(250,253,255,.92);border-color:rgba(23,51,78,.12);box-shadow:0 8px 30px rgba(45,66,86,.08)}
:root[data-theme="light"] .hero{background:radial-gradient(circle at 50% 18%,rgba(10,168,140,.12),transparent 34%),radial-gradient(circle at 12% 80%,rgba(23,109,193,.09),transparent 28%),linear-gradient(180deg,#f8fbfd,#eef5f9)}
:root[data-theme="light"] .hero::after{background:linear-gradient(transparent,#eef4f8)}
:root[data-theme="light"] .hero-dashboard,:root[data-theme="light"] .domain-console,:root[data-theme="light"] .float-stat,:root[data-theme="light"] .platform-visual,:root[data-theme="light"] .floating-card{filter:saturate(.82)}
:root[data-theme="light"] .scan-bar,:root[data-theme="light"] .feature-strip,:root[data-theme="light"] .workspace,:root[data-theme="light"] .workspace-rail,:root[data-theme="light"] .tool-sidebar,:root[data-theme="light"] .tool-content,:root[data-theme="light"] .result-section,:root[data-theme="light"] .knowledge-section,:root[data-theme="light"] .api-section,:root[data-theme="light"] .platform-section,:root[data-theme="light"] .listing-page,:root[data-theme="light"] .article-page-wide{color:var(--text)}
:root[data-theme="light"] .feature-strip,:root[data-theme="light"] .workspace,:root[data-theme="light"] .result-section,:root[data-theme="light"] .knowledge-section,:root[data-theme="light"] .api-section{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
:root[data-theme="light"] .feature-strip button,:root[data-theme="light"] .tool-sidebar,:root[data-theme="light"] .tool-content,:root[data-theme="light"] .rail-panel,:root[data-theme="light"] .trust-panel,:root[data-theme="light"] .result-toolbar,:root[data-theme="light"] .score-card,:root[data-theme="light"] .summary-card,:root[data-theme="light"] .module-score,:root[data-theme="light"] .finding,:root[data-theme="light"] .knowledge-card,:root[data-theme="light"] .catalog-tool-card,:root[data-theme="light"] .knowledge-card-full,:root[data-theme="light"] .article-body-premium,:root[data-theme="light"] .article-side-card,:root[data-theme="light"] .metric-card,:root[data-theme="light"] .modal-card{background:linear-gradient(180deg,#fff,#f5f9fc)!important;border-color:var(--line)!important;box-shadow:0 16px 38px rgba(45,66,86,.1)!important;color:var(--text)}
:root[data-theme="light"] .scan-bar{background:#fff;border-color:var(--line);box-shadow:0 18px 40px rgba(45,66,86,.1)}
:root[data-theme="light"] .scan-input-wrap input,:root[data-theme="light"] .scan-test-wrap select,:root[data-theme="light"] .selector-wrap input,:root[data-theme="light"] .tool-search input,:root[data-theme="light"] .modal-field input{color:var(--text);background:transparent}
:root[data-theme="light"] .category-list button,:root[data-theme="light"] .source-chip-grid span,:root[data-theme="light"] .related-articles a,:root[data-theme="light"] .article-toc a:hover{background:#f0f6fa!important;color:var(--text);border-color:var(--line)}
:root[data-theme="light"] .category-list button.is-active{background:#dff5ef!important;color:#075d50}
:root[data-theme="light"] .tool-card,:root[data-theme="light"] .rail-list a{background:#f7fafc;border-color:var(--line);color:var(--text)}
:root[data-theme="light"] .tool-card h3,:root[data-theme="light"] .knowledge-card h3,:root[data-theme="light"] .catalog-tool-card h2,:root[data-theme="light"] .knowledge-card-full h2,:root[data-theme="light"] .article-body-premium h2,:root[data-theme="light"] .related-articles strong{color:var(--text)}
:root[data-theme="light"] .tool-card p,:root[data-theme="light"] .knowledge-card p,:root[data-theme="light"] .catalog-tool-card p,:root[data-theme="light"] .knowledge-card-full p,:root[data-theme="light"] .article-body-premium p,:root[data-theme="light"] .related-articles span,:root[data-theme="light"] .rail-list small,:root[data-theme="light"] .rail-sources p{color:var(--muted)}
:root[data-theme="light"] .platform-section{background:linear-gradient(135deg,#eaf7f4,#e6f2ff 58%,#edf8fb);border-color:var(--line);color:var(--text)}
:root[data-theme="light"] .platform-section p,:root[data-theme="light"] .platform-points p{color:var(--muted)}
:root[data-theme="light"] .footer{background:#e7eff5;color:#425b73;border-color:var(--line)}
:root[data-theme="light"] .knowledge-footer-premium{background:linear-gradient(135deg,#fff,#edf7fa);box-shadow:0 18px 45px rgba(45,66,86,.11)}
:root[data-theme="light"] .knowledge-footer-links>div{background:#f5f9fc}
:root[data-theme="light"] .listing-hero h1,:root[data-theme="light"] .article-header-premium h1{color:#102235}
:root[data-theme="light"] .article-header-premium .article-lead,:root[data-theme="light"] .listing-hero p{color:#536a80}
:root[data-theme="light"] .breadcrumbs{color:#61788d}

@media(max-width:1000px){.knowledge-footer-premium{grid-template-columns:1fr}.knowledge-footer-links{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.knowledge-footer-premium{width:calc(100% - 28px);padding:24px 18px}.knowledge-footer-links{grid-template-columns:1fr}.trust-metrics-counters strong{min-width:0}.knowledge-section-actions{margin-top:20px}}
:root[data-theme="light"] .trust-metrics-counters strong{color:#102235}
:root[data-theme="light"] .trust-metrics-counters small{color:#536a80}


/* Visitor intelligence */
.visitor-intelligence{max-width:1840px;margin:22px auto;padding:34px;border:1px solid var(--border);border-radius:28px;background:linear-gradient(145deg,var(--panel-strong),var(--panel));box-shadow:var(--shadow);}
.visitor-intro{max-width:900px}.visitor-intro h2{font-size:clamp(1.8rem,3vw,3.2rem);margin:.4rem 0 1rem}.visitor-intro p{color:var(--muted);line-height:1.7}
.visitor-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:26px}.visitor-card{min-width:0;padding:20px;border:1px solid var(--border);border-radius:20px;background:var(--card);overflow:hidden}.visitor-card span,.visitor-card small{display:block;color:var(--muted)}.visitor-card strong{display:block;margin:9px 0;font-size:clamp(1rem,1.4vw,1.45rem);overflow-wrap:anywhere}.visitor-online strong{color:var(--success);font-size:2.2rem}
.visitor-details{margin-top:18px;border:1px solid var(--border);border-radius:18px;background:var(--surface-soft)}.visitor-details summary{cursor:pointer;padding:16px 18px;font-weight:700}.visitor-details dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin:0;padding:0 18px 18px}.visitor-details dl div{padding:12px 0;border-top:1px solid var(--border)}.visitor-details dt{color:var(--muted);font-size:.84rem}.visitor-details dd{margin:5px 0 0;overflow-wrap:anywhere}
@media(max-width:1280px){.visitor-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.visitor-intelligence{margin:14px 12px;padding:20px;border-radius:22px}.visitor-grid{grid-template-columns:1fr}.visitor-details dl{grid-template-columns:1fr}.catalog-tool-card,.knowledge-card,.tool-card{min-width:0}.hero-form,.scan-form{grid-template-columns:1fr!important}.main-nav{max-height:calc(100vh - 72px);overflow:auto}.article-shell,.article-layout{grid-template-columns:1fr!important}.article-toc,.article-aside{position:static!important}.finding-card,.check-card{overflow-wrap:anywhere}.result-actions{display:grid;grid-template-columns:1fr 1fr}.footer,.footer-premium{padding-left:16px;padding-right:16px}}
@media(max-width:420px){.result-actions{grid-template-columns:1fr}.top-actions .header-cta{display:none}.brand strong{font-size:1.05rem}.brand small{display:none}.metric-card{padding:16px}.hero h1{font-size:clamp(2.25rem,12vw,3.2rem)}}


/* v3.1 — authoritative theme layer. Dark is the default; light is opt-in. */
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#edf3f7;
  --bg-soft:#f7fafc;
  --surface:#ffffff;
  --surface-2:#f3f7fa;
  --surface-3:#e8eff5;
  --line:rgba(31,57,82,.14);
  --line-strong:rgba(31,57,82,.26);
  --text:#11263a;
  --muted:#536b81;
  --muted-2:#70869a;
  --primary:#087f70;
  --primary-strong:#05685c;
  --primary-dark:#dff6f1;
  --blue:#145fae;
  --good:#087a5d;
  --warn:#9c6300;
  --bad:#b93349;
  --info:#1d65aa;
  --shadow:0 16px 42px rgba(37,61,84,.12);
  --panel:#ffffff;
  --panel-strong:#f8fbfd;
  --card:#ffffff;
  --border:rgba(31,57,82,.14);
  --surface-soft:#f2f6f9;
  --success:#087a5d;
}
:root[data-theme="light"] body{
  background:radial-gradient(circle at 78% 0,rgba(20,95,174,.09),transparent 29%),linear-gradient(180deg,#f8fbfd 0,#edf3f7 58%,#eaf1f5 100%)!important;
  color:var(--text)!important;
}
:root[data-theme="light"] .app-shell{background:transparent!important}
:root[data-theme="light"] .topbar{
  background:rgba(255,255,255,.94)!important;
  border-color:var(--line)!important;
  box-shadow:0 8px 28px rgba(37,61,84,.08)!important;
}
:root[data-theme="light"] .brand strong,
:root[data-theme="light"] .main-nav a:hover,
:root[data-theme="light"] .main-nav a.is-active{color:var(--text)!important}
:root[data-theme="light"] .brand small,
:root[data-theme="light"] .main-nav a{color:var(--muted)!important}
:root[data-theme="light"] .icon-button,
:root[data-theme="light"] .view-controls button,
:root[data-theme="light"] .button-ghost{
  background:#fff!important;color:var(--text)!important;border-color:var(--line)!important
}
:root[data-theme="light"] .button-primary{color:#fff!important}
:root[data-theme="light"] .hero{
  background:radial-gradient(circle at 74% 34%,rgba(20,95,174,.12),transparent 28%),radial-gradient(circle at 92% 20%,rgba(8,127,112,.09),transparent 24%),linear-gradient(112deg,#f9fcfe 0,#eef5fa 58%,#eaf3f8 100%)!important;
  border-color:var(--line)!important;
}
:root[data-theme="light"] .hero::after{background:linear-gradient(transparent,#edf3f7)!important}
:root[data-theme="light"] .hero h1{color:#10263a!important}
:root[data-theme="light"] .hero > .hero-content > p,
:root[data-theme="light"] .hero p,
:root[data-theme="light"] .hero-trust,
:root[data-theme="light"] .hero-examples{color:var(--muted)!important}
:root[data-theme="light"] .scan-bar,
:root[data-theme="light"] .feature-strip,
:root[data-theme="light"] .workspace,
:root[data-theme="light"] .tool-sidebar,
:root[data-theme="light"] .tool-content,
:root[data-theme="light"] .result-section,
:root[data-theme="light"] .knowledge-section,
:root[data-theme="light"] .api-section,
:root[data-theme="light"] .listing-page,
:root[data-theme="light"] .article-page-wide,
:root[data-theme="light"] .visitor-intelligence{
  background:#fff!important;color:var(--text)!important;border-color:var(--line)!important;box-shadow:var(--shadow)!important
}
:root[data-theme="light"] .scan-input-wrap,
:root[data-theme="light"] .scan-test-wrap,
:root[data-theme="light"] .selector-wrap,
:root[data-theme="light"] .tool-search,
:root[data-theme="light"] .modal-field,
:root[data-theme="light"] .visitor-details{
  background:#f7fafc!important;border-color:var(--line)!important
}
:root[data-theme="light"] input,
:root[data-theme="light"] select,
:root[data-theme="light"] textarea{color:var(--text)!important;background:transparent!important}
:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder{color:#7b8fa1!important}
:root[data-theme="light"] .feature-strip button,
:root[data-theme="light"] .tool-card,
:root[data-theme="light"] .rail-panel,
:root[data-theme="light"] .trust-panel,
:root[data-theme="light"] .result-toolbar,
:root[data-theme="light"] .score-card,
:root[data-theme="light"] .summary-card,
:root[data-theme="light"] .module-score,
:root[data-theme="light"] .finding,
:root[data-theme="light"] .knowledge-card,
:root[data-theme="light"] .catalog-tool-card,
:root[data-theme="light"] .knowledge-card-full,
:root[data-theme="light"] .article-body-premium,
:root[data-theme="light"] .article-side-card,
:root[data-theme="light"] .metric-card,
:root[data-theme="light"] .modal-card,
:root[data-theme="light"] .visitor-card,
:root[data-theme="light"] .knowledge-footer-links>div{
  background:linear-gradient(180deg,#fff,#f5f8fb)!important;
  color:var(--text)!important;
  border-color:var(--line)!important;
  box-shadow:0 10px 26px rgba(37,61,84,.08)!important;
}
:root[data-theme="light"] .tool-card h3,
:root[data-theme="light"] .knowledge-card h3,
:root[data-theme="light"] .catalog-tool-card h2,
:root[data-theme="light"] .knowledge-card-full h2,
:root[data-theme="light"] .article-body-premium h2,
:root[data-theme="light"] .article-body-premium h3,
:root[data-theme="light"] .related-articles strong,
:root[data-theme="light"] .visitor-card strong,
:root[data-theme="light"] .visitor-details dd,
:root[data-theme="light"] .trust-metrics-counters strong{color:var(--text)!important}
:root[data-theme="light"] .tool-card p,
:root[data-theme="light"] .knowledge-card p,
:root[data-theme="light"] .catalog-tool-card p,
:root[data-theme="light"] .knowledge-card-full p,
:root[data-theme="light"] .article-body-premium p,
:root[data-theme="light"] .related-articles span,
:root[data-theme="light"] .rail-list small,
:root[data-theme="light"] .rail-sources p,
:root[data-theme="light"] .visitor-card span,
:root[data-theme="light"] .visitor-card small,
:root[data-theme="light"] .visitor-details dt,
:root[data-theme="light"] .trust-metrics-counters small{color:var(--muted)!important}
:root[data-theme="light"] .category-list button,
:root[data-theme="light"] .source-chip-grid span,
:root[data-theme="light"] .related-articles a,
:root[data-theme="light"] .rail-list a,
:root[data-theme="light"] .article-toc a{
  background:#f4f8fb!important;color:var(--text)!important;border-color:var(--line)!important
}
:root[data-theme="light"] .category-list button.is-active,
:root[data-theme="light"] .article-toc a:hover{background:#ddf3ee!important;color:#075b50!important}
:root[data-theme="light"] .platform-section{
  background:linear-gradient(135deg,#e8f7f3,#e8f1fb 58%,#edf8fa)!important;
  color:var(--text)!important;border-color:var(--line)!important;box-shadow:var(--shadow)!important
}
:root[data-theme="light"] .platform-copy h2,
:root[data-theme="light"] .platform-points strong{color:var(--text)!important}
:root[data-theme="light"] .platform-copy p,
:root[data-theme="light"] .platform-points p{color:var(--muted)!important}
:root[data-theme="light"] .platform-points div{background:rgba(255,255,255,.72)!important;border-color:var(--line)!important}
:root[data-theme="light"] .api-section pre{background:#12263c!important;color:#eff6ff!important}
:root[data-theme="light"] .footer,
:root[data-theme="light"] .footer-premium{background:#dfe9f0!important;color:#40586d!important;border-color:var(--line)!important}
:root[data-theme="light"] .footer .brand strong,
:root[data-theme="light"] .footer-premium .brand strong{color:#10263a!important}
:root[data-theme="light"] .footer p,
:root[data-theme="light"] .footer-premium p{color:#536b81!important}
:root[data-theme="light"] .knowledge-footer-premium{
  background:linear-gradient(135deg,#fff,#edf6fa)!important;border-color:var(--line)!important;box-shadow:var(--shadow)!important
}
:root[data-theme="light"] .listing-hero h1,
:root[data-theme="light"] .article-header-premium h1{color:#10263a!important}
:root[data-theme="light"] .article-header-premium .article-lead,
:root[data-theme="light"] .listing-hero p,
:root[data-theme="light"] .breadcrumbs{color:var(--muted)!important}
:root[data-theme="light"] .finding-details,
:root[data-theme="light"] .detail-grid>div{background:#f7fafc!important;border-color:var(--line)!important;color:var(--text)!important}
:root[data-theme="light"] code,
:root[data-theme="light"] pre{color:#17314a}


/* v3.2 — premium light theme, contrast and dedicated SEO tool pages */
:root[data-theme="light"]{
  --bg:#eef3f8;--bg-soft:#f8fafc;--surface:#ffffff;--surface-2:#f4f7fb;--surface-3:#e7edf5;
  --line:rgba(15,42,68,.13);--line-strong:rgba(15,42,68,.25);--text:#0c2034;--muted:#4f657a;--muted-2:#687e92;
  --primary:#087b6d;--primary-strong:#05665a;--primary-dark:#d9f5ef;--blue:#155fa9;--good:#087657;--warn:#8a5900;--bad:#b52d45;--info:#1c61a5;
  --shadow:0 18px 50px rgba(23,45,68,.11);--panel:#fff;--panel-strong:#fff;--card:#fff;--border:rgba(15,42,68,.13);--surface-soft:#f4f7fb;--success:#087657;
}
:root[data-theme="light"] body{background:linear-gradient(180deg,#f8fafc 0,#eef3f8 45%,#e9eff5 100%)!important;color:#0c2034!important}
:root[data-theme="light"] .topbar{background:rgba(255,255,255,.95)!important;border-bottom-color:rgba(15,42,68,.12)!important;box-shadow:0 8px 30px rgba(23,45,68,.08)!important}
:root[data-theme="light"] .brand-mark{background:linear-gradient(145deg,#e0f6f1,#f3fbf9)!important;border-color:rgba(8,123,109,.26)!important;box-shadow:inset 0 0 18px rgba(8,123,109,.08)!important}
:root[data-theme="light"] .brand-mark i{background:#087b6d!important}
:root[data-theme="light"] .main-nav a{color:#526a80!important}:root[data-theme="light"] .main-nav a:hover,:root[data-theme="light"] .main-nav a.is-active{color:#0c2034!important}
:root[data-theme="light"] .hero{background:radial-gradient(circle at 76% 28%,rgba(21,95,169,.12),transparent 31%),radial-gradient(circle at 16% 66%,rgba(8,123,109,.10),transparent 28%),linear-gradient(180deg,#fbfdff,#eef4f9)!important}
:root[data-theme="light"] .hero-grid{opacity:.38!important}:root[data-theme="light"] .hero h1{color:#0b2035!important}:root[data-theme="light"] .hero h1 span{color:#155fa9!important}:root[data-theme="light"] .hero h1 em{color:#087b6d!important}
:root[data-theme="light"] .scan-bar{background:rgba(255,255,255,.98)!important;border-color:rgba(15,42,68,.20)!important;box-shadow:0 20px 54px rgba(23,45,68,.14)!important}
:root[data-theme="light"] .scan-input-wrap label,:root[data-theme="light"] .scan-test-wrap label,:root[data-theme="light"] .selector-wrap label{color:#5f7488!important}
:root[data-theme="light"] .scan-input-wrap input,:root[data-theme="light"] .scan-test-wrap select,:root[data-theme="light"] .selector-wrap input{color:#0c2034!important}
:root[data-theme="light"] select option{background:#fff;color:#0c2034}
:root[data-theme="light"] .button-primary{background:linear-gradient(135deg,#087b6d,#0b917f)!important;color:#fff!important;box-shadow:0 11px 28px rgba(8,123,109,.22)!important}
:root[data-theme="light"] .button-ghost,:root[data-theme="light"] .icon-button,:root[data-theme="light"] .view-controls button{background:#fff!important;color:#173149!important;border-color:rgba(15,42,68,.15)!important}
:root[data-theme="light"] .feature-strip,:root[data-theme="light"] .workspace,:root[data-theme="light"] .result-section,:root[data-theme="light"] .knowledge-section,:root[data-theme="light"] .api-section,:root[data-theme="light"] .visitor-intelligence{background:transparent!important;box-shadow:none!important}
:root[data-theme="light"] .feature-strip button,:root[data-theme="light"] .tool-card,:root[data-theme="light"] .catalog-tool-card,:root[data-theme="light"] .knowledge-card-full,:root[data-theme="light"] .knowledge-card,:root[data-theme="light"] .rail-panel,:root[data-theme="light"] .trust-panel,:root[data-theme="light"] .visitor-card,:root[data-theme="light"] .metric-card,:root[data-theme="light"] .summary-card,:root[data-theme="light"] .finding,:root[data-theme="light"] .article-side-card,:root[data-theme="light"] .article-body-premium,:root[data-theme="light"] .modal-card{background:#fff!important;border:1px solid rgba(15,42,68,.12)!important;box-shadow:0 12px 34px rgba(23,45,68,.08)!important;color:#0c2034!important}
:root[data-theme="light"] .feature-strip button:hover,:root[data-theme="light"] .tool-card:hover,:root[data-theme="light"] .catalog-tool-card:hover,:root[data-theme="light"] .knowledge-card-full:hover{border-color:rgba(8,123,109,.35)!important;box-shadow:0 18px 42px rgba(23,45,68,.13)!important;transform:translateY(-2px)}
:root[data-theme="light"] .tool-card.is-selected{background:linear-gradient(180deg,#f2fbf8,#fff)!important;border-color:rgba(8,123,109,.45)!important}
:root[data-theme="light"] .tool-search,:root[data-theme="light"] .category-list button,:root[data-theme="light"] .source-chip-grid span,:root[data-theme="light"] .article-toc a,:root[data-theme="light"] .related-articles a,:root[data-theme="light"] .visitor-details{background:#f4f7fb!important;border-color:rgba(15,42,68,.11)!important;color:#173149!important}
:root[data-theme="light"] .category-list button.is-active,:root[data-theme="light"] .article-toc a:hover{background:#dff3ee!important;color:#065e53!important;border-color:rgba(8,123,109,.24)!important}
:root[data-theme="light"] .platform-section{background:linear-gradient(135deg,#e5f5f1 0,#eaf2fb 58%,#eef8fa 100%)!important;border-color:rgba(15,42,68,.12)!important;color:#0c2034!important}
:root[data-theme="light"] .platform-visual{background:radial-gradient(circle at center,rgba(8,123,109,.14),transparent 55%)!important}
:root[data-theme="light"] .domain-console,:root[data-theme="light"] .float-stat{background:linear-gradient(160deg,#102b48,#0b2038)!important;color:#eff6ff!important;border-color:rgba(97,168,255,.28)!important;box-shadow:0 22px 52px rgba(13,37,64,.24)!important}
:root[data-theme="light"] .domain-console small,:root[data-theme="light"] .domain-console span,:root[data-theme="light"] .float-stat small,:root[data-theme="light"] .float-stat span{color:#b8cbe3!important}
:root[data-theme="light"] .domain-console strong,:root[data-theme="light"] .float-stat strong{color:#eff6ff!important}
:root[data-theme="light"] .listing-page,:root[data-theme="light"] .article-page-wide,:root[data-theme="light"] .tool-detail-page{background:transparent!important;box-shadow:none!important;color:#0c2034!important}
:root[data-theme="light"] .listing-hero,:root[data-theme="light"] .article-header-premium,:root[data-theme="light"] .tool-detail-hero{background:linear-gradient(135deg,#fff,#f0f6fa)!important;border-color:rgba(15,42,68,.12)!important;box-shadow:0 18px 46px rgba(23,45,68,.09)!important}
:root[data-theme="light"] .article-body-premium section{border-bottom-color:rgba(15,42,68,.10)!important}:root[data-theme="light"] .article-cta{background:linear-gradient(135deg,#e2f5f0,#edf5fb)!important;border-color:rgba(8,123,109,.20)!important}
:root[data-theme="light"] .finding-details,:root[data-theme="light"] .detail-grid>div,:root[data-theme="light"] .result-toolbar{background:#f4f7fb!important;border-color:rgba(15,42,68,.11)!important;color:#0c2034!important}
:root[data-theme="light"] .status-bad{color:#a91f39!important;background:#fdecef!important}:root[data-theme="light"] .status-warn{color:#7f5200!important;background:#fff4d8!important}:root[data-theme="light"] .status-good{color:#056b50!important;background:#e4f7f0!important}:root[data-theme="light"] .status-info{color:#155a9e!important;background:#e7f1fb!important}
:root[data-theme="light"] .knowledge-footer-premium{background:linear-gradient(135deg,#fff 0,#eaf5f8 100%)!important;border-color:rgba(15,42,68,.12)!important;box-shadow:0 18px 46px rgba(23,45,68,.10)!important}
:root[data-theme="light"] .footer,:root[data-theme="light"] .footer-premium{background:#dfe8f0!important;border-top:1px solid rgba(15,42,68,.12)!important;color:#3f566b!important}
:root[data-theme="light"] .footer .brand-mark{background:#f4fbf9!important}
:root[data-theme="light"] code:not(pre code){background:#e8eef4!important;color:#15314b!important;border:1px solid rgba(15,42,68,.10)!important}:root[data-theme="light"] pre{background:#10263e!important;color:#edf6ff!important;border-color:#284a68!important}
:root[data-theme="light"] :focus-visible{outline:3px solid rgba(8,123,109,.45)!important;outline-offset:3px}

.tool-detail-page{width:min(var(--max),calc(100% - 48px));margin:0 auto;padding:34px 0 88px}.tool-detail-hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:36px;margin-top:20px;padding:46px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(135deg,color-mix(in srgb,var(--surface) 94%,var(--blue)),var(--surface));box-shadow:var(--shadow)}.tool-detail-hero h1{max-width:900px;margin:12px 0 16px;font-size:clamp(2.4rem,5vw,5rem);line-height:1.02;letter-spacing:-.045em}.tool-detail-hero p{max-width:820px;color:var(--muted);font-size:1.12rem;line-height:1.7}.tool-detail-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.tool-detail-summary{align-self:stretch;padding:26px;border:1px solid var(--line);border-radius:22px;background:color-mix(in srgb,var(--surface-2) 88%,transparent)}.tool-detail-summary span{color:var(--primary);font-size:.76rem;font-weight:850;text-transform:uppercase;letter-spacing:.12em}.tool-detail-summary strong{display:block;margin:14px 0 10px;font-size:1.6rem}.tool-detail-summary p{margin:0;font-size:.98rem}.tool-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:20px}.tool-detail-grid article{padding:26px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:var(--shadow)}.tool-detail-grid article>span{color:var(--primary);font-weight:900}.tool-detail-grid h2{margin:12px 0 10px;font-size:1.25rem}.tool-detail-grid p{margin:0;color:var(--muted);line-height:1.65}
@media(max-width:1050px){.tool-detail-hero{grid-template-columns:1fr}.tool-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.tool-detail-page{width:calc(100% - 28px);padding-top:20px}.tool-detail-hero{padding:26px 20px}.tool-detail-grid{grid-template-columns:1fr}.tool-detail-hero h1{font-size:clamp(2.1rem,11vw,3.2rem)}}

/* v3.3 — compact browser trace panel near the top */
.browser-trace{max-width:1840px;margin:14px auto 18px;padding:18px 22px;border:1px solid var(--border);border-radius:22px;background:linear-gradient(145deg,var(--panel-strong),var(--panel));box-shadow:var(--shadow);position:relative;overflow:hidden}
.browser-trace:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 12% 0%,rgba(53,126,255,.12),transparent 30%),radial-gradient(circle at 90% 20%,rgba(36,212,187,.08),transparent 26%);pointer-events:none}
.browser-trace>*{position:relative;z-index:1}
.browser-trace-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}
.browser-trace-head h2{margin:.25rem 0 0;font-size:clamp(1.05rem,1.4vw,1.45rem);line-height:1.25}
.browser-trace-live{display:grid;grid-template-columns:auto auto;align-items:center;gap:4px 8px;min-width:132px;padding:10px 14px;border:1px solid var(--border);border-radius:16px;background:var(--card)}
.browser-trace-live .live-dot{width:9px;height:9px;border-radius:50%;background:var(--success);box-shadow:0 0 14px rgba(42,219,168,.75)}
.browser-trace-live strong{font-size:1.25rem}.browser-trace-live small{grid-column:1/-1;color:var(--muted);font-size:.75rem}
.browser-trace-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.browser-trace-summary>div{min-width:0;padding:12px 14px;border:1px solid var(--border);border-radius:15px;background:var(--card)}
.browser-trace-summary span,.browser-trace-detail-grid span{display:block;color:var(--muted);font-size:.72rem;letter-spacing:.04em;text-transform:uppercase}
.browser-trace-summary strong{display:block;margin-top:5px;font-size:.93rem;overflow-wrap:anywhere}.browser-trace-summary small{display:block;margin-top:3px;color:var(--muted);font-size:.72rem;overflow-wrap:anywhere}
.browser-trace-details{margin-top:12px;border-top:1px solid var(--border)}
.browser-trace-details summary{display:flex;justify-content:space-between;gap:16px;cursor:pointer;padding:13px 2px 2px;font-size:.85rem;font-weight:750;list-style:none}.browser-trace-details summary::-webkit-details-marker{display:none}.browser-trace-details summary span{color:var(--muted);font-size:.72rem;font-weight:500}
.browser-trace-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:12px}
.browser-trace-detail-grid>div{min-width:0;padding:11px 13px;border:1px solid var(--border);border-radius:14px;background:var(--surface-soft)}
.browser-trace-detail-grid>div.wide{grid-column:span 2}.browser-trace-detail-grid strong{display:block;margin-top:5px;font-size:.82rem;font-weight:650;overflow-wrap:anywhere;word-break:break-word}
.trace-action{margin-top:8px;padding:7px 10px;border:1px solid var(--border-strong);border-radius:10px;background:transparent;color:var(--accent);font:inherit;font-size:.75rem;font-weight:700;cursor:pointer}.trace-action:hover{background:var(--accent-soft)}
.browser-trace-note{margin:12px 0 0;color:var(--muted);font-size:.74rem;line-height:1.55}
@media(max-width:1180px){.browser-trace-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.browser-trace-detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.browser-trace{margin:10px 12px 14px;padding:15px;border-radius:18px}.browser-trace-head{align-items:flex-start}.browser-trace-live{min-width:106px;padding:8px 10px}.browser-trace-summary{grid-template-columns:1fr 1fr}.browser-trace-detail-grid{grid-template-columns:1fr 1fr}.browser-trace-detail-grid>div.wide{grid-column:1/-1}.browser-trace-details summary span{display:none}}
@media(max-width:460px){.browser-trace-head{display:block}.browser-trace-live{margin-top:10px;width:max-content}.browser-trace-summary,.browser-trace-detail-grid{grid-template-columns:1fr}.browser-trace-detail-grid>div.wide{grid-column:auto}}
:root[data-theme="light"] .browser-trace{background:linear-gradient(145deg,#ffffff,#f3f8fd);border-color:rgba(13,51,82,.13);box-shadow:0 14px 42px rgba(28,65,99,.09)}
:root[data-theme="light"] .browser-trace-live,:root[data-theme="light"] .browser-trace-summary>div{background:#fff;border-color:rgba(13,51,82,.12)}
:root[data-theme="light"] .browser-trace-detail-grid>div{background:#f5f8fc;border-color:rgba(13,51,82,.1)}
:root[data-theme="light"] .browser-trace-summary strong,:root[data-theme="light"] .browser-trace-detail-grid strong,:root[data-theme="light"] .browser-trace-head h2{color:#0b2238}

/* v3.4 — compact browser trace */
.browser-trace-top{max-width:1840px;margin:10px auto 14px;padding:11px 16px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(135deg,var(--panel-strong),var(--panel));box-shadow:0 10px 30px rgba(0,0,0,.12)}
.browser-trace-head{margin-bottom:9px}.browser-trace-title{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 12px}.browser-trace-title .section-kicker{margin:0}.browser-trace-head h2{margin:0;font-size:.82rem;color:var(--muted);font-weight:600}.browser-trace-live{padding:6px 10px;min-width:112px;border-radius:12px}.browser-trace-live strong{font-size:1rem}.browser-trace-live small{font-size:.66rem}
.browser-trace-summary{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.browser-trace-summary>div{padding:8px 10px;border-radius:12px}.browser-trace-summary span{font-size:.62rem}.browser-trace-summary strong{font-size:.82rem;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.browser-trace-summary small{font-size:.64rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trace-online-mobile{display:none}
.browser-trace-details{margin-top:8px}.browser-trace-details summary{align-items:center;padding:9px 2px 1px;font-size:.78rem}.browser-trace-details summary>span{color:var(--text);font-size:.78rem;font-weight:750}.browser-trace-details summary small{color:var(--muted);font-size:.67rem;font-weight:500}.browser-trace-details[open] summary{margin-bottom:6px}.browser-trace-detail-grid{margin-top:8px}
@media(max-width:900px){.browser-trace-top{margin:8px 12px 12px}.browser-trace-summary{display:flex;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:3px}.browser-trace-summary>div{flex:0 0 155px;scroll-snap-align:start}.browser-trace-live{display:none}.trace-online-mobile{display:block!important}.browser-trace-title h2{display:none}.browser-trace-details summary small{display:none}}
@media(max-width:460px){.browser-trace-top{padding:10px 12px}.browser-trace-head{display:block}.browser-trace-summary{grid-template-columns:none}.browser-trace-summary>div{flex-basis:142px}.browser-trace-details summary{padding-top:8px}}
:root[data-theme="light"] .browser-trace-top{background:linear-gradient(135deg,#ffffff,#f3f7fc);box-shadow:0 8px 24px rgba(23,45,68,.07)}

/* Longer SEO descriptions remain readable without making cards uneven */
.catalog-tool-card p{line-height:1.65;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}.catalog-tool-card{min-height:285px}.tool-card p{line-height:1.65}
@media(max-width:760px){.catalog-tool-card{min-height:auto}.catalog-tool-card p{-webkit-line-clamp:7}}


/* v3.5 — relocated browser trace and mobile-first hero corrections */
html,body{max-width:100%;overflow-x:hidden}
.hero-content,.scan-bar,.scan-input-wrap,.scan-test-wrap,.selector-wrap,.tool-content{min-width:0}
.connection-insight-section{width:min(var(--max),calc(100% - 48px));margin:0 auto 92px;padding:28px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 94%,transparent),color-mix(in srgb,var(--bg-soft) 88%,var(--surface)));box-shadow:var(--shadow)}
.connection-insight-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.8fr);column-gap:44px;align-items:end;margin-bottom:18px}
.connection-insight-copy .section-kicker{grid-column:1/-1;margin-bottom:6px}
.connection-insight-copy h2{margin:0;font-size:clamp(25px,3vw,38px);line-height:1.12;letter-spacing:-.035em}
.connection-insight-copy p{margin:0;color:var(--muted);line-height:1.65}
.browser-trace-embedded{max-width:none;margin:0;padding:14px 16px;border-radius:18px}
:root[data-theme="light"] .connection-insight-section{background:linear-gradient(145deg,#fff,#f3f8fc);border-color:rgba(15,42,68,.12);box-shadow:0 18px 46px rgba(23,45,68,.09)}

@media(max-width:760px){
  .topbar{height:62px;padding:0 14px;gap:12px}
  .brand{gap:9px}.brand-mark{width:34px;height:38px;padding:6px}.brand strong{font-size:20px;letter-spacing:-.35px}
  .icon-button{width:42px;height:42px}
  .hero{padding:26px 14px 52px;min-height:auto;overflow:hidden}
  .hero-content{width:100%;text-align:left}
  .hero .eyebrow{font-size:9px;letter-spacing:.11em}
  .hero h1{max-width:100%;margin:13px 0 16px;font-size:clamp(35px,10.5vw,46px);line-height:1.03;letter-spacing:-.045em;overflow-wrap:normal}
  .hero> .hero-content>p{max-width:100%;margin:0;font-size:15px;line-height:1.58}
  .scan-bar{width:100%;margin:25px 0 0;padding:10px;display:grid;grid-template-columns:42px minmax(0,1fr);gap:9px;border-radius:15px}
  .scan-tool-icon{width:42px;height:42px}
  .scan-input-wrap{grid-column:2;min-width:0;padding-right:2px}
  .scan-input-wrap input,.selector-wrap input{font-size:16px}
  .scan-test-wrap,.selector-wrap{grid-column:1/-1;width:100%;min-width:0;padding:10px 5px 0;border-left:0;border-top:1px solid var(--line)}
  .scan-test-wrap select{width:100%;min-width:0;height:38px;font-size:14px}
  .scan-submit{grid-column:1/-1;width:100%;min-height:52px;margin-top:2px}
  .scan-examples{display:flex!important;max-width:100%;margin:14px 0 0!important;padding:0 0 5px;gap:7px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;white-space:nowrap}
  .scan-examples::-webkit-scrollbar{display:none}.scan-examples>span{flex:0 0 auto}.scan-examples button{flex:0 0 auto}
  .hero-trust{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 14px!important;margin-top:15px!important;font-size:13px}
  .scan-consent{margin-top:14px!important;font-size:11px!important;line-height:1.5!important}
  .feature-strip{margin:-22px 12px 20px;grid-template-columns:1fr 1fr;gap:8px}
  .feature-strip button{min-width:0;min-height:74px;padding:10px}.feature-strip strong{font-size:12px}.feature-strip b,.feature-strip small{font-size:10px}
  .workspace{width:calc(100% - 24px);margin:0 12px;padding:46px 0 64px;gap:22px}
  .tool-content{padding:14px}.section-heading h2{font-size:29px}.section-heading p{font-size:14px;line-height:1.55}
  .connection-insight-section{width:calc(100% - 24px);margin:0 12px 64px;padding:18px 12px;border-radius:20px}
  .connection-insight-copy{display:block;margin-bottom:14px;padding:0 4px}.connection-insight-copy h2{font-size:25px;margin:6px 0 10px}.connection-insight-copy p{font-size:14px;line-height:1.55}
  .browser-trace-embedded{margin:0;padding:11px 10px}.browser-trace-title h2{display:none}.browser-trace-summary{display:flex;overflow-x:auto;padding-bottom:4px}.browser-trace-summary>div{flex:0 0 142px}.browser-trace-detail-grid{grid-template-columns:1fr}.browser-trace-detail-grid>div.wide{grid-column:auto}
}
@media(max-width:390px){
  .brand strong{font-size:18px}.hero h1{font-size:34px}.hero{padding-inline:12px}.feature-strip{grid-template-columns:1fr}.feature-strip button:nth-child(n+5){display:none}.hero-trust{grid-template-columns:1fr 1fr;font-size:12px}
}

/* v3.7 — czytelne karty CVE i oficjalne źródła */
.cve-results{margin:18px 0 22px;padding:22px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 96%,var(--primary)),var(--surface));box-shadow:var(--shadow)}
.cve-results-head{display:flex;justify-content:space-between;gap:28px;align-items:flex-start;margin-bottom:16px}.result-kicker{display:block;margin-bottom:6px;color:var(--primary);font-size:10px;font-weight:900;letter-spacing:.13em}.cve-results-head h3{margin:0 0 7px;font-size:22px}.cve-results-head p{max-width:780px;margin:0;color:var(--muted);font-size:13px;line-height:1.65}.cve-overview{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.cve-overview span{display:flex;align-items:center;gap:5px;padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:11px;white-space:nowrap}.cve-overview strong{color:var(--text);font-size:13px}.cve-overview .is-critical{border-color:color-mix(in srgb,#ff536d 40%,var(--line));color:#ff8b9c}.cve-overview .is-high{border-color:color-mix(in srgb,#ff9d42 40%,var(--line));color:#ffc079}
.cve-card-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.cve-card{position:relative;overflow:hidden;padding:17px;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--surface-2) 88%,transparent)}.cve-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--cve-color,#6f8aa8)}.cve-critical{--cve-color:#ff536d}.cve-high{--cve-color:#ff9d42}.cve-medium{--cve-color:#f0c84b}.cve-low{--cve-color:#58b7ff}.cve-unknown{--cve-color:#8799ad}.cve-card-top{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.cve-id-block{display:flex;gap:10px;min-width:0}.cve-severity-dot{width:10px;height:10px;flex:0 0 auto;margin-top:5px;border-radius:50%;background:var(--cve-color);box-shadow:0 0 16px color-mix(in srgb,var(--cve-color) 65%,transparent)}.cve-id{display:block;color:var(--text);font-size:15px;font-weight:900;letter-spacing:.015em;text-decoration:none}.cve-id:hover{text-decoration:underline;text-underline-offset:3px}.cve-id-block small{display:block;margin-top:4px;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.07em}.cvss-badge{min-width:62px;padding:7px 9px;border:1px solid color-mix(in srgb,var(--cve-color) 44%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--cve-color) 10%,var(--surface));text-align:center}.cvss-badge span{display:block;color:var(--muted);font-size:8px;font-weight:900;letter-spacing:.1em}.cvss-badge strong{display:block;margin-top:1px;color:var(--cve-color);font-size:18px}.cve-description{margin:13px 0 11px;color:var(--muted);font-size:12px;line-height:1.62}.cve-meta-row{display:flex;flex-wrap:wrap;gap:6px 12px;color:var(--muted-2);font-size:9px}.cve-meta-row span{overflow-wrap:anywhere}.cve-meta-row b{color:var(--text)}.cve-cwe-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}.cve-cwe-list span{padding:4px 7px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font-size:9px}.cve-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.cve-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font-size:10px;font-weight:800}.cve-link:hover{border-color:var(--primary);color:var(--primary)}.cve-link-primary{border-color:color-mix(in srgb,var(--primary) 45%,var(--line));background:color-mix(in srgb,var(--primary) 10%,var(--surface))}.cve-notice{margin-top:13px;padding:11px 13px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);color:var(--muted);font-size:10px;line-height:1.55}.cve-notice strong{color:var(--text)}
:root[data-theme="light"] .cve-results{background:linear-gradient(145deg,#fff,#f5f9fd);border-color:rgba(13,51,82,.12)}:root[data-theme="light"] .cve-card{background:#fff;border-color:rgba(13,51,82,.12);box-shadow:0 8px 22px rgba(19,55,91,.06)}:root[data-theme="light"] .cve-overview span,:root[data-theme="light"] .cve-notice,:root[data-theme="light"] .cve-cwe-list span,:root[data-theme="light"] .cve-link{background:#f5f8fc;border-color:rgba(13,51,82,.12)}
@media(max-width:900px){.cve-card-list{grid-template-columns:1fr}.cve-results-head{display:block}.cve-overview{justify-content:flex-start;margin-top:13px}}
@media(max-width:560px){.cve-results{padding:15px;margin-inline:0}.cve-results-head h3{font-size:18px}.cve-card{padding:14px}.cve-card-top{align-items:flex-start}.cve-actions{display:grid;grid-template-columns:1fr}.cve-link{width:100%}.cve-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.cve-overview span{justify-content:center;padding:7px 5px;font-size:9px}.cve-description{font-size:11px}}


/* v4.1 — UX fixes: smaller hero headline, mobile menu, scroll-top, select spacing */
.hero h1{font-size:clamp(38px,4.8vw,64px)!important;line-height:1.04!important}
.hero > .hero-content > p{max-width:720px}
.scan-test-wrap select{width:100%;max-width:100%}
@media (min-width:761px){
  .tool-select-open .hero{padding-bottom:320px!important}
}
@media (max-width:760px){
  .hero h1{font-size:clamp(31px,9.3vw,42px)!important;line-height:1.05!important}
  .hero > .hero-content > p{font-size:14px!important}
}

.nav-toggle{display:none;width:42px;height:42px;place-items:center;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);cursor:pointer}
.nav-toggle svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.nav-toggle:hover{border-color:color-mix(in srgb,var(--primary) 45%,transparent);color:var(--primary)}
.mobile-nav-overlay{position:fixed;inset:0;background:rgba(5,10,18,.46);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .22s ease;z-index:110}
.mobile-nav-drawer{position:fixed;top:0;right:0;bottom:0;width:min(360px,100vw);padding:18px 16px 22px;display:flex;flex-direction:column;gap:16px;background:var(--bg-soft);border-left:1px solid var(--line);box-shadow:-20px 0 48px rgba(0,0,0,.26);transform:translateX(100%);transition:transform .24s ease;z-index:111}
.mobile-nav-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.mobile-nav-close{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--text);cursor:pointer}
.mobile-nav-list{display:grid;gap:6px}
.mobile-nav-list a{display:flex;align-items:center;justify-content:space-between;padding:14px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--text);font-weight:700}
.mobile-nav-list a::after{content:'›';color:var(--muted)}
.mobile-nav-drawer .button{width:100%}
body.mobile-menu-open{overflow:hidden}
body.mobile-menu-open .mobile-nav-overlay{opacity:1;pointer-events:auto}
body.mobile-menu-open .mobile-nav-drawer{transform:translateX(0)}
@media (max-width:1100px){
  .nav-toggle{display:grid}
  .top-actions{gap:8px}
}
@media (min-width:1101px){
  .mobile-nav-overlay,.mobile-nav-drawer{display:none!important}
}

.scroll-top{position:fixed;right:18px;bottom:18px;width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface) 92%,transparent);color:var(--text);box-shadow:0 12px 30px rgba(0,0,0,.18);backdrop-filter:blur(10px);opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .2s ease, transform .2s ease, border-color .2s ease;z-index:70;cursor:pointer}
.scroll-top svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scroll-top.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.scroll-top:hover{color:var(--primary);border-color:color-mix(in srgb,var(--primary) 45%,transparent)}

:root[data-theme="light"] .mobile-nav-overlay{background:rgba(16,33,52,.22)}
:root[data-theme="light"] .mobile-nav-drawer{background:#f7fbff;border-left-color:rgba(15,42,68,.12);box-shadow:-20px 0 44px rgba(23,45,68,.14)}
:root[data-theme="light"] .mobile-nav-list a,:root[data-theme="light"] .mobile-nav-close,:root[data-theme="light"] .nav-toggle,:root[data-theme="light"] .scroll-top{background:#fff;border-color:rgba(15,42,68,.12);box-shadow:0 12px 28px rgba(23,45,68,.08)}


/* v4.2 — link do potwierdzonego publicznego pliku */
.finding-resource-link{margin-top:16px;padding:13px;border:1px solid color-mix(in srgb,var(--bad) 35%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--bad) 7%,var(--surface-2))}
.finding-resource-link>span{display:block;margin-bottom:8px;color:var(--muted-2);font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.finding-resource-link a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);text-decoration:none}
.finding-resource-link a:hover{border-color:var(--primary);color:var(--primary)}
.finding-resource-link b{min-width:0;overflow-wrap:anywhere;word-break:break-all;font:600 11px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace}
.finding-resource-link em{flex:0 0 auto;color:var(--primary);font-size:10px;font-style:normal;font-weight:900;white-space:nowrap}
.finding-resource-link small{display:block;margin-top:8px;color:var(--muted);font-size:9px;line-height:1.5}
@media(max-width:650px){.finding-resource-link a{align-items:flex-start;flex-direction:column}.finding-resource-link em{white-space:normal}}
:root[data-theme="light"] .finding-resource-link{background:#fff4f6;border-color:rgba(184,33,66,.2)}


/* v4.4 — prominent domain/IP input */
.scan-target-field{position:relative;padding:8px 12px 7px;border:1px solid color-mix(in srgb,var(--primary) 26%,var(--line));border-radius:12px;background:linear-gradient(145deg,color-mix(in srgb,var(--primary) 8%,var(--surface-2)),color-mix(in srgb,var(--surface) 94%,transparent));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--primary) 4%,transparent);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.scan-target-field:focus-within{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--surface));box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 13%,transparent),inset 0 0 24px color-mix(in srgb,var(--primary) 5%,transparent)}
.scan-target-field label{display:flex!important;align-items:center;gap:7px;color:color-mix(in srgb,var(--primary) 82%,var(--text))!important;font-size:10px!important;font-weight:900!important;letter-spacing:.09em!important}
.target-label-icon{width:18px;height:18px;display:inline-grid;place-items:center;flex:0 0 auto;border-radius:6px;background:color-mix(in srgb,var(--primary) 16%,transparent);color:var(--primary);font-size:12px}
.scan-target-field input{padding-top:5px!important;font-size:18px!important;font-weight:800!important;letter-spacing:-.01em}
.scan-target-field input::placeholder{color:color-mix(in srgb,var(--muted) 76%,transparent)!important;font-weight:650!important}
.target-input-hint{display:block;margin-top:4px;color:var(--muted);font-size:10px;line-height:1.35;font-weight:500}
.target-input-error{display:block;min-height:0;color:var(--bad);font-size:10px;font-weight:750;line-height:1.35}
.target-input-error:not(:empty){margin-top:4px}
.scan-bar.has-error .scan-target-field{border-color:var(--bad);box-shadow:0 0 0 4px color-mix(in srgb,var(--bad) 12%,transparent)}
:root[data-theme="light"] .scan-target-field{background:linear-gradient(145deg,#f4fbff,#fff);border-color:rgba(8,123,109,.28);box-shadow:0 8px 20px rgba(23,45,68,.05)}
:root[data-theme="light"] .scan-target-field:focus-within{background:#fff;border-color:#087b6d;box-shadow:0 0 0 4px rgba(8,123,109,.12),0 10px 24px rgba(23,45,68,.08)}
:root[data-theme="light"] .scan-target-field input{color:#0c2034!important}
:root[data-theme="light"] .scan-target-field input::placeholder{color:#73869b!important}
@media(max-width:760px){
  .scan-target-field{grid-column:2;padding:7px 9px 6px}
  .scan-target-field input{font-size:16px!important}
  .target-input-hint{font-size:9px}
}


/* v4.5 — clearer domain/IP input */
.scan-target-field{position:relative;padding:12px 14px 12px;border:1px solid color-mix(in srgb,var(--primary) 24%,var(--line));border-radius:16px;background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 9%,var(--surface-2)),color-mix(in srgb,var(--surface) 96%,transparent));box-shadow:0 10px 30px rgba(4,14,38,.18),inset 0 0 0 1px color-mix(in srgb,var(--primary) 5%,transparent);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.scan-target-field:focus-within{border-color:color-mix(in srgb,var(--accent) 55%,var(--primary));background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 13%,var(--surface-2)),color-mix(in srgb,var(--surface) 100%,transparent));box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 14%,transparent),0 16px 36px rgba(4,14,38,.22)}
.scan-target-head{display:grid;gap:4px;margin-bottom:10px}
.scan-target-step{display:inline-flex;align-items:center;justify-content:center;width:max-content;padding:4px 8px;border-radius:999px;background:color-mix(in srgb,var(--primary) 17%,transparent);color:var(--primary);font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.scan-target-title{display:block!important;margin:0!important;color:var(--text)!important;font-size:18px!important;line-height:1.15!important;font-weight:900!important;letter-spacing:-.02em!important}
.scan-target-subtitle{margin:0;color:color-mix(in srgb,var(--muted) 70%,var(--text));font-size:12px;line-height:1.45;font-weight:650}
.scan-target-entry{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--line) 86%,transparent);border-radius:14px;background:color-mix(in srgb,var(--surface) 90%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--primary) 3%,transparent)}
.scan-target-field .target-label-icon{width:42px;height:42px;display:inline-grid;place-items:center;flex:0 0 auto;border-radius:12px;background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 22%,transparent),color-mix(in srgb,var(--primary) 8%,transparent));color:var(--accent);font-size:20px;border:1px solid color-mix(in srgb,var(--primary) 18%,transparent)}
.scan-target-field input{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;font-size:19px!important;font-weight:850!important;letter-spacing:-.02em;min-height:42px}
.scan-target-field input::placeholder{color:color-mix(in srgb,var(--muted) 76%,transparent)!important;font-weight:700!important}
.target-input-hint{display:block;margin-top:8px;color:var(--muted);font-size:11px;line-height:1.5;font-weight:550}
.target-input-error{display:block;min-height:0;color:var(--bad);font-size:11px;font-weight:800;line-height:1.4}
.target-input-error:not(:empty){margin-top:7px}
.scan-bar.has-error .scan-target-field{border-color:var(--bad);box-shadow:0 0 0 4px color-mix(in srgb,var(--bad) 11%,transparent),0 10px 30px rgba(4,14,38,.18)}
.scan-bar.has-error .scan-target-entry{border-color:color-mix(in srgb,var(--bad) 42%,var(--line));background:color-mix(in srgb,var(--bad) 4%,var(--surface))}
:root[data-theme="light"] .scan-target-field{background:linear-gradient(180deg,#f1fbff,#fff);border-color:rgba(41,111,190,.2);box-shadow:0 12px 30px rgba(21,51,83,.08)}
:root[data-theme="light"] .scan-target-field:focus-within{background:#fff;border-color:#3177df;box-shadow:0 0 0 4px rgba(49,119,223,.12),0 14px 30px rgba(21,51,83,.1)}
:root[data-theme="light"] .scan-target-subtitle{color:#4f6782}
:root[data-theme="light"] .scan-target-entry{background:#fff;border-color:rgba(21,51,83,.12)}
:root[data-theme="light"] .scan-target-field .target-label-icon{background:linear-gradient(180deg,rgba(49,119,223,.12),rgba(34,196,164,.1));border-color:rgba(49,119,223,.12)}
:root[data-theme="light"] .scan-target-field input{color:#0d2034!important}
:root[data-theme="light"] .scan-target-field input::placeholder{color:#7890a8!important}
@media(max-width:980px){
  .scan-target-title{font-size:16px!important}
  .scan-target-subtitle{font-size:11px}
}
@media(max-width:760px){
  .scan-target-field{grid-column:2;padding:10px}
  .scan-target-head{margin-bottom:8px}
  .scan-target-step{font-size:9px;padding:3px 7px}
  .scan-target-title{font-size:15px!important}
  .scan-target-subtitle{font-size:10px}
  .scan-target-entry{padding:8px 10px;gap:9px}
  .scan-target-field .target-label-icon{width:38px;height:38px;font-size:17px;border-radius:11px}
  .scan-target-field input{font-size:16px!important;min-height:38px}
  .target-input-hint,.target-input-error{font-size:9.5px}
}


/* v4.6 — simplified clean target input */
.scan-target-field{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.scan-target-field:focus-within{border:0!important;background:transparent!important;box-shadow:none!important}
.scan-target-entry{min-height:58px;padding:8px 14px;border:1px solid color-mix(in srgb,var(--primary) 35%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--primary) 4%,transparent),0 8px 22px rgba(3,12,30,.14);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.scan-target-entry:focus-within{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 6%,var(--surface));box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 12%,transparent),0 10px 26px rgba(3,12,30,.18)}
.scan-target-field .target-label-icon{width:40px;height:40px;border-radius:11px;font-size:18px}
.scan-target-field input{font-size:17px!important;font-weight:750!important;letter-spacing:-.01em!important}
.scan-target-field input::placeholder{color:color-mix(in srgb,var(--muted) 82%,transparent)!important;font-weight:650!important}
.target-input-hint{margin:6px 2px 0!important;color:var(--muted)!important;font-size:10px!important;line-height:1.4!important}
.target-input-error:not(:empty){margin:5px 2px 0!important}
.scan-bar.has-error .scan-target-field{border:0!important;box-shadow:none!important}
.scan-bar.has-error .scan-target-entry{border-color:var(--bad)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--bad) 11%,transparent)!important}
:root[data-theme="light"] .scan-target-field{background:transparent!important;border:0!important;box-shadow:none!important}
:root[data-theme="light"] .scan-target-entry{background:#fff;border-color:rgba(49,119,223,.22);box-shadow:0 8px 20px rgba(21,51,83,.07)}
:root[data-theme="light"] .scan-target-entry:focus-within{border-color:#3177df;background:#fff;box-shadow:0 0 0 4px rgba(49,119,223,.11),0 10px 24px rgba(21,51,83,.09)}
@media(max-width:760px){
  .scan-target-field{grid-column:2!important;padding:0!important}
  .scan-target-entry{min-height:52px;padding:7px 10px}
  .scan-target-field .target-label-icon{width:36px;height:36px;font-size:16px}
  .scan-target-field input{font-size:15px!important;min-height:36px!important}
  .target-input-hint{font-size:9px!important}
}


/* v4.7 — longer and more distinctive domain/IP field */
.scan-bar{max-width:1045px}
.scan-target-field{flex:1 1 450px!important;min-width:320px!important}
.scan-target-entry{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid rgba(83,172,255,.24);border-radius:14px;background:linear-gradient(135deg,rgba(10,49,92,.88),rgba(8,88,118,.24) 55%,rgba(7,37,69,.96));box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 8px 20px rgba(5,17,37,.18);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.scan-target-field:focus-within .scan-target-entry{border-color:rgba(47,125,255,.55);background:linear-gradient(135deg,rgba(12,62,111,.96),rgba(16,102,132,.30) 55%,rgba(7,41,74,.98));box-shadow:0 0 0 4px rgba(47,125,255,.12),0 10px 24px rgba(7,20,41,.24)}
.scan-target-field .target-label-icon{width:44px;height:44px;border-radius:13px;background:linear-gradient(135deg,#1e6fff,#18cfc5);border:0;color:#fff;box-shadow:0 10px 24px rgba(24,106,245,.28)}
.scan-target-field input{min-height:46px!important;font-size:18px!important;font-weight:820!important}
.scan-target-field input::placeholder{color:#9bb4d1!important;opacity:1}
.target-input-hint{margin-top:8px;color:#88a0bd;font-size:11.5px}
:root[data-theme="light"] .scan-target-entry{background:linear-gradient(135deg,#eef7ff,#e8fbff 58%,#ffffff);border-color:rgba(49,119,223,.20);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 10px 24px rgba(22,52,84,.08)}
:root[data-theme="light"] .scan-target-field:focus-within .scan-target-entry{border-color:#3177df;background:linear-gradient(135deg,#f4fbff,#eaf7ff 55%,#ffffff);box-shadow:0 0 0 4px rgba(49,119,223,.12),0 12px 24px rgba(22,52,84,.10)}
:root[data-theme="light"] .scan-target-field input::placeholder{color:#6d86a0!important}
:root[data-theme="light"] .target-input-hint{color:#607892}
@media(max-width:1100px){.scan-bar{max-width:100%}.scan-target-field{flex-basis:380px!important;min-width:260px!important}}
@media(max-width:760px){
  .scan-target-field{grid-column:2!important;min-width:0!important}
  .scan-target-entry{padding:10px 11px;gap:10px;border-radius:13px}
  .scan-target-field .target-label-icon{width:40px;height:40px;border-radius:12px}
  .scan-target-field input{min-height:40px!important;font-size:16px!important}
  .target-input-hint{font-size:10px}
}


/* v4.8 — tool selector spacing + centered longer target field */
@media (min-width: 761px){
  .scan-bar{
    display:grid!important;
    grid-template-columns: 44px minmax(500px, 1.75fr) minmax(235px, 1fr) auto;
    align-items:center;
    gap:14px;
    max-width:1120px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:10px 12px!important;
  }
  .scan-tool-icon{width:44px;height:44px}
  .scan-target-field{
    width:100%;
    max-width:100%;
    min-width:420px!important;
    flex:none!important;
    justify-self:center;
  }
  .scan-target-entry{min-height:62px}
  .scan-target-field input{font-size:19px!important}
  .scan-test-wrap{
    min-width:0!important;
    width:100%;
    padding-left:16px!important;
  }
  .scan-test-wrap select{width:100%;min-width:0}
  .scan-submit{justify-self:end;min-width:184px}

  .tool-select-open .hero{
    padding-bottom:440px!important;
  }
  .tool-select-open .feature-strip{
    margin-top:18px!important;
  }
}

@media (min-width: 761px) and (max-width: 1180px){
  .scan-bar{grid-template-columns:44px minmax(380px,1.5fr) minmax(210px,1fr) auto;max-width:100%!important}
  .scan-target-field{min-width:320px!important}
}

@media (max-width: 760px){
  .scan-target-field{justify-self:stretch}
}


/* v4.9 — primary target field emphasis */
.scan-bar{
  position:relative;
  border-color:rgba(63,145,255,.62)!important;
  background:linear-gradient(135deg,rgba(5,25,53,.97),rgba(7,37,74,.96))!important;
  box-shadow:0 24px 64px rgba(0,0,0,.34),0 0 0 1px rgba(54,143,255,.10),0 0 38px rgba(33,123,255,.16)!important;
}
.scan-bar::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:15px;
  padding:1px;
  background:linear-gradient(115deg,rgba(55,138,255,.75),rgba(25,210,194,.48),rgba(55,138,255,.18));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}
.scan-target-entry{
  min-height:72px!important;
  padding:13px 16px!important;
  border:1px solid rgba(70,175,255,.46)!important;
  background:linear-gradient(135deg,rgba(13,67,122,.96),rgba(10,89,116,.52) 54%,rgba(7,45,84,.98))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 12px 28px rgba(2,12,31,.26)!important;
}
.scan-target-entry::after{
  content:"Wpisz domenę lub publiczny adres IP";
  position:absolute;
  left:72px;
  top:10px;
  color:#6fd8ff;
  font-size:9px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  pointer-events:none;
}
.scan-target-entry{position:relative;padding-top:24px!important}
.scan-target-field .target-label-icon{
  width:48px!important;
  height:48px!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#2f7dff,#15d2c2)!important;
  box-shadow:0 12px 28px rgba(26,118,246,.34)!important;
}
.scan-target-field input{
  min-height:44px!important;
  font-size:21px!important;
  color:#fff!important;
  font-weight:850!important;
}
.scan-target-field input::placeholder{
  color:#c6d9ef!important;
  opacity:.92!important;
  font-weight:760!important;
}
.target-input-hint{
  margin-top:9px!important;
  padding-left:3px;
  color:#9db3cf!important;
  font-size:11px!important;
}
.scan-target-field:focus-within .scan-target-entry{
  border-color:#4ca3ff!important;
  background:linear-gradient(135deg,rgba(16,78,139,.98),rgba(10,111,139,.58) 54%,rgba(8,52,94,.98))!important;
  box-shadow:0 0 0 5px rgba(47,125,255,.16),0 16px 34px rgba(0,14,42,.30)!important;
}
.scan-target-field:focus-within .target-label-icon{
  transform:scale(1.04);
}
:root[data-theme="light"] .scan-bar{
  background:linear-gradient(135deg,#edf7ff,#f5fcff)!important;
  border-color:rgba(49,119,223,.38)!important;
  box-shadow:0 24px 58px rgba(23,69,112,.14),0 0 0 1px rgba(49,119,223,.06),0 0 30px rgba(49,119,223,.12)!important;
}
:root[data-theme="light"] .scan-target-entry{
  background:linear-gradient(135deg,#eaf5ff,#e8fbff 55%,#fff)!important;
  border-color:rgba(49,119,223,.32)!important;
}
:root[data-theme="light"] .scan-target-entry::after{color:#1d6fbd}
:root[data-theme="light"] .scan-target-field input{color:#0b2742!important}
:root[data-theme="light"] .scan-target-field input::placeholder{color:#526d89!important}
:root[data-theme="light"] .target-input-hint{color:#607892!important}
@media(max-width:760px){
  .scan-bar{padding:11px!important}
  .scan-target-entry{min-height:64px!important;padding:22px 12px 10px!important}
  .scan-target-entry::after{left:62px;top:8px;font-size:8px}
  .scan-target-field .target-label-icon{width:42px!important;height:42px!important}
  .scan-target-field input{font-size:17px!important;min-height:38px!important}
  .target-input-hint{font-size:9.5px!important}
}


/* v5.0 — stable selector and simplified target field */
.tool-select-open .hero{padding-bottom:46px!important}
.tool-select-open .feature-strip{margin-top:-21px!important}
.scan-target-entry{
  min-height:68px!important;
  padding:12px 8px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.scan-target-entry::after{display:none!important;content:none!important}
.scan-target-field:focus-within .scan-target-entry{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.scan-target-field{
  padding:0 6px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.scan-target-field:focus-within{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.scan-target-field .target-label-icon{
  width:48px!important;
  height:48px!important;
  flex:0 0 48px!important;
}
.scan-target-field input{
  min-height:48px!important;
  padding:0 6px!important;
  font-size:21px!important;
}
.target-input-hint{padding-left:62px!important;margin-top:-8px!important}
.scan-bar.has-error .scan-target-entry{
  border:0!important;
  background:rgba(255,94,118,.05)!important;
  box-shadow:0 0 0 3px rgba(255,94,118,.12)!important;
  border-radius:12px!important;
}
:root[data-theme="light"] .scan-target-entry,
:root[data-theme="light"] .scan-target-field,
:root[data-theme="light"] .scan-target-field:focus-within .scan-target-entry{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
@media(max-width:760px){
  .tool-select-open .hero{padding-bottom:52px!important}
  .tool-select-open .feature-strip{margin-top:-22px!important}
  .scan-target-entry{min-height:58px!important;padding:8px 2px!important}
  .scan-target-field .target-label-icon{width:42px!important;height:42px!important;flex-basis:42px!important}
  .scan-target-field input{font-size:17px!important;min-height:42px!important;padding:0 4px!important}
  .target-input-hint{padding-left:52px!important;margin-top:-4px!important}
}


/* v5.1 — keep selector and submit button inside the main scan frame */
@media (min-width: 761px){
  .hero-content{max-width:900px!important}
  .scan-bar{
    width:100%!important;
    max-width:900px!important;
    grid-template-columns:44px minmax(0,1fr) minmax(190px,220px) minmax(168px,184px)!important;
    column-gap:12px!important;
    overflow:visible;
  }
  .scan-target-field{
    min-width:0!important;
    width:100%!important;
  }
  .scan-target-entry{width:100%;min-width:0}
  .scan-target-field input{width:100%;min-width:0}
  .scan-test-wrap{
    min-width:0!important;
    width:100%!important;
    padding-left:14px!important;
    overflow:hidden;
  }
  .scan-test-wrap select{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    text-overflow:ellipsis;
  }
  .scan-submit{
    min-width:0!important;
    width:100%!important;
    padding-inline:14px!important;
    white-space:nowrap;
  }
}
@media (min-width:761px) and (max-width:980px){
  .scan-bar{grid-template-columns:44px minmax(0,1fr) minmax(175px,205px) minmax(150px,170px)!important}
  .scan-submit{font-size:12px!important;padding-inline:10px!important}
}


/* v5.2 — custom premium tool selector */
.custom-tool-select{position:relative;overflow:visible!important}
.native-tool-select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.tool-select-button{width:100%;min-width:0;height:48px;display:grid;grid-template-columns:32px minmax(0,1fr) 18px;gap:9px;align-items:center;padding:5px 4px 5px 0;color:var(--text);background:transparent;border:0;text-align:left;cursor:pointer}
.tool-select-button-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(145deg,rgba(47,125,255,.22),rgba(21,210,194,.12));border:1px solid rgba(95,158,241,.18);color:#61afff;font-size:10px;font-weight:900}
.tool-select-button-copy{min-width:0;display:grid;gap:2px}.tool-select-button-copy strong{display:block;overflow:hidden;color:#f2f7ff;font-size:13px;font-weight:850;white-space:nowrap;text-overflow:ellipsis}.tool-select-button-copy small{display:block;overflow:hidden;color:#7089aa;font-size:9px;font-weight:650;white-space:nowrap;text-overflow:ellipsis}
.tool-select-button>svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s ease}.custom-tool-select.is-open .tool-select-button>svg{transform:rotate(180deg)}
.tool-select-dropdown{position:absolute;z-index:250;left:-12px;top:calc(100% + 13px);width:min(440px,calc(100vw - 32px));max-height:520px;padding:12px;background:linear-gradient(180deg,#0a2344,#06172f);border:1px solid rgba(95,158,241,.30);border-radius:16px;box-shadow:0 28px 70px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.025);overflow:hidden}
.tool-select-dropdown::before{content:"";position:absolute;top:-7px;left:48px;width:13px;height:13px;background:#0a2344;border-left:1px solid rgba(95,158,241,.30);border-top:1px solid rgba(95,158,241,.30);transform:rotate(45deg)}
.tool-select-search{position:relative;display:flex;align-items:center;gap:9px;height:43px;padding:0 12px;margin-bottom:9px;background:#05152b;border:1px solid rgba(95,158,241,.18);border-radius:11px}.tool-select-search:focus-within{border-color:#2e82ff;box-shadow:0 0 0 3px rgba(46,130,255,.10)}.tool-select-search svg{width:17px;height:17px;flex:0 0 auto;stroke:#7591b5;fill:none;stroke-width:2}.tool-select-search input{width:100%;min-width:0;color:#eef5ff;background:transparent;border:0;outline:0;font:650 12px/1.2 inherit}.tool-select-search input::placeholder{color:#7187a5}
.tool-select-options{max-height:440px;padding-right:4px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#345d94 #071a34}.tool-select-options::-webkit-scrollbar{width:8px}.tool-select-options::-webkit-scrollbar-track{background:#071a34;border-radius:999px}.tool-select-options::-webkit-scrollbar-thumb{background:#345d94;border-radius:999px;border:2px solid #071a34}
.tool-option-group+ .tool-option-group{margin-top:10px;padding-top:9px;border-top:1px solid rgba(95,158,241,.11)}.tool-option-category{display:flex;align-items:center;justify-content:space-between;padding:5px 8px;color:#6daeff;font-size:9px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.tool-option-category span{min-width:23px;padding:3px 6px;border-radius:999px;background:rgba(47,125,255,.13);text-align:center;font-size:8px}
.tool-option{width:100%;display:grid;grid-template-columns:37px minmax(0,1fr) 20px;gap:10px;align-items:center;padding:9px 8px;margin:2px 0;color:#dfeaff;background:transparent;border:1px solid transparent;border-radius:11px;text-align:left;cursor:pointer;transition:background .16s ease,border-color .16s ease,transform .16s ease}.tool-option:hover{background:rgba(47,125,255,.11);border-color:rgba(95,158,241,.16);transform:translateX(2px)}.tool-option.is-selected{background:linear-gradient(90deg,rgba(47,125,255,.22),rgba(21,210,194,.08));border-color:rgba(64,145,255,.34)}
.tool-option-icon{width:37px;height:37px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(145deg,#164c93,#0a2e5d);color:#71b8ff;font-size:9px;font-weight:900}.tool-option-copy{min-width:0;display:grid;gap:3px}.tool-option-copy strong{font-size:12px;font-weight:800}.tool-option-copy small{display:block;overflow:hidden;color:#7f96b5;font-size:9px;line-height:1.35;white-space:nowrap;text-overflow:ellipsis}.tool-option-check{opacity:0;color:#52e4b1;font-size:13px;font-weight:900}.tool-option.is-selected .tool-option-check{opacity:1}.tool-option-empty{padding:28px 14px;color:#8196b2;text-align:center;font-size:12px}
:root[data-theme="light"] .tool-select-button-copy strong{color:#0c2034}:root[data-theme="light"] .tool-select-button-copy small{color:#627991}:root[data-theme="light"] .tool-select-dropdown{background:linear-gradient(180deg,#fff,#f4f8fc);border-color:rgba(15,42,68,.16);box-shadow:0 26px 60px rgba(23,45,68,.18)}:root[data-theme="light"] .tool-select-dropdown::before{background:#fff;border-color:rgba(15,42,68,.16)}:root[data-theme="light"] .tool-select-search{background:#eef5fb;border-color:rgba(15,42,68,.12)}:root[data-theme="light"] .tool-select-search input{color:#0c2034}:root[data-theme="light"] .tool-select-options{scrollbar-color:#9eb4ca #edf3f8}:root[data-theme="light"] .tool-option{color:#18314a}:root[data-theme="light"] .tool-option:hover{background:#eaf4ff;border-color:rgba(49,119,223,.15)}:root[data-theme="light"] .tool-option.is-selected{background:linear-gradient(90deg,#dceeff,#eafaf7);border-color:rgba(49,119,223,.22)}:root[data-theme="light"] .tool-option-copy small{color:#617990}:root[data-theme="light"] .tool-option-icon{background:linear-gradient(145deg,#dcecff,#e1fbf7);color:#1765ca}
@media(max-width:760px){.tool-select-dropdown{position:fixed;left:12px;right:12px;top:auto;bottom:12px;width:auto;max-height:min(72vh,600px);border-radius:20px}.tool-select-dropdown::before{display:none}.tool-select-options{max-height:calc(72vh - 78px)}.tool-select-button{height:50px}.tool-option-copy small{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.tool-option{padding:10px 8px}}


/* v5.3 — dropdown always above following sections */
.hero{overflow:visible!important}
.hero-content{position:relative!important;z-index:60!important}
.scan-bar{position:relative!important;z-index:120!important;overflow:visible!important}
.custom-tool-select{position:relative!important;z-index:220!important;overflow:visible!important}
.custom-tool-select.is-open{z-index:1200!important}
.tool-select-dropdown{z-index:1400!important}
.feature-strip{z-index:6!important}
.workspace{position:relative;z-index:2}
@media(max-width:760px){
  .tool-select-dropdown{z-index:2000!important}
}

/* =========================================================
   CYBEROCENA v6.1 — RESPONSIVE CENTERED SCAN COMPOSER
   Jeden stabilny układ dla desktopu, laptopa, tabletu i mobile
   ========================================================= */

/* Hero no longer forces the form into a narrow left column. */
.hero {
  isolation: isolate;
  overflow: visible !important;
}

.hero-content {
  min-width: 0 !important;
}

.hero-content > p,
.scan-examples,
.hero-trust,
.scan-consent {
  position: relative;
  z-index: 3;
}

/* Main scan composer: target on the first row, controls below. */
.scan-bar {
  position: relative !important;
  z-index: 120 !important;
  width: min(1040px, 100%) !important;
  max-width: 1040px !important;
  min-height: 0 !important;
  margin: 30px auto 0 !important;
  padding: 15px !important;
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 13px 14px !important;
  align-items: stretch !important;
  overflow: visible !important;
  border-radius: 22px !important;
  border: 1px solid rgba(72, 151, 255, .48) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(38, 128, 255, .14), transparent 34%),
    linear-gradient(145deg, rgba(5, 24, 51, .98), rgba(7, 38, 74, .97)) !important;
  box-shadow:
    0 30px 80px rgba(0, 0, 0, .34),
    0 0 0 1px rgba(75, 155, 255, .08),
    0 0 46px rgba(36, 126, 255, .15) !important;
  backdrop-filter: blur(18px);
}

.scan-bar::before {
  inset: -1px !important;
  border-radius: 22px !important;
  background: linear-gradient(110deg, rgba(74, 157, 255, .84), rgba(28, 214, 197, .42), rgba(80, 130, 255, .14)) !important;
}

.scan-bar::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 14% 8%;
  border-radius: 999px;
  background: rgba(42, 127, 255, .16);
  filter: blur(44px);
  pointer-events: none;
}

/* The old external icon duplicates the icon inside the target field. */
.scan-bar > .scan-tool-icon {
  display: none !important;
}

.scan-input-wrap.scan-target-field {
  position: relative !important;
  z-index: 4 !important;
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.scan-input-wrap.scan-target-field:focus-within {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.scan-target-entry {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 88px !important;
  padding: 17px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  overflow: hidden !important;
  border: 1px solid rgba(88, 176, 255, .47) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(48, 143, 255, .26), transparent 34%),
    linear-gradient(135deg, rgba(12, 62, 116, .98), rgba(8, 91, 120, .58) 53%, rgba(6, 42, 80, .99)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .07),
    0 16px 34px rgba(0, 10, 32, .30) !important;
  transform: translateZ(0);
  transition: border-color .22s ease, box-shadow .22s ease, background .22s ease, transform .22s ease !important;
}

.scan-target-entry::after {
  display: none !important;
  content: none !important;
}

.scan-target-entry::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -38%;
  width: 30%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(120, 219, 255, .13), transparent);
  transform: skewX(-16deg);
}

.scan-target-field:focus-within .scan-target-entry {
  border-color: rgba(80, 171, 255, .96) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(56, 151, 255, .32), transparent 36%),
    linear-gradient(135deg, rgba(14, 76, 139, .99), rgba(8, 107, 137, .66) 53%, rgba(7, 50, 92, .99)) !important;
  box-shadow:
    0 0 0 5px rgba(47, 125, 255, .14),
    0 20px 42px rgba(0, 12, 38, .34) !important;
  transform: translateY(-1px);
}

.scan-target-field .target-label-icon {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  flex: 0 0 54px !important;
  display: inline-grid !important;
  place-items: center !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 16px !important;
  color: #fff !important;
  background: linear-gradient(135deg, #2f7dff, #13d2c2) !important;
  box-shadow: 0 13px 30px rgba(23, 119, 244, .34) !important;
  font-size: 23px !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
}

.scan-target-field:focus-within .target-label-icon {
  transform: scale(1.045) rotate(-2deg);
  box-shadow: 0 16px 34px rgba(23, 119, 244, .42) !important;
}

.scan-target-field input,
#targetInput {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 54px !important;
  padding: 0 4px !important;
  margin: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  color: #fff !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: clamp(19px, 1.55vw, 24px) !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
  letter-spacing: -.025em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.scan-target-field input::placeholder,
#targetInput::placeholder {
  color: #c0d5ec !important;
  opacity: .9 !important;
  font-size: clamp(16px, 1.25vw, 20px) !important;
  font-weight: 720 !important;
  letter-spacing: -.01em !important;
}

.target-input-hint {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 16px !important;
  margin: 8px 0 0 !important;
  padding: 0 4px !important;
  color: #91abc9 !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  white-space: normal !important;
}

.target-input-error {
  width: 100% !important;
  margin: 4px 0 0 !important;
  padding: 0 4px !important;
  font-size: 11px !important;
}

/* Second row: tool scope and submit never share the target row. */
.scan-test-wrap.custom-tool-select,
.selector-wrap,
.scan-submit {
  min-width: 0 !important;
  margin: 0 !important;
}

.scan-test-wrap.custom-tool-select {
  position: relative !important;
  z-index: 260 !important;
  grid-column: 1 / span 4 !important;
  grid-row: 2 !important;
  width: 100% !important;
  padding: 10px 14px !important;
  display: grid !important;
  align-content: center !important;
  overflow: visible !important;
  border: 1px solid rgba(91, 157, 240, .24) !important;
  border-radius: 15px !important;
  background: rgba(4, 22, 47, .72) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

.scan-test-wrap.custom-tool-select > label,
.selector-wrap > label {
  display: block !important;
  margin: 0 0 3px !important;
  color: #7894b7 !important;
  font-size: 9px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
}

.tool-select-button {
  width: 100% !important;
  min-width: 0 !important;
  height: 52px !important;
  padding: 4px 2px 4px 0 !important;
  grid-template-columns: 38px minmax(0, 1fr) 19px !important;
  gap: 10px !important;
  border-radius: 11px !important;
}

.tool-select-button-icon {
  width: 38px !important;
  height: 38px !important;
  border-radius: 11px !important;
}

.tool-select-button-copy strong {
  font-size: 14px !important;
}

.tool-select-button-copy small {
  font-size: 10px !important;
}

.selector-wrap:not(.is-hidden) {
  grid-column: 5 / span 4 !important;
  grid-row: 2 !important;
  width: 100% !important;
  padding: 10px 14px !important;
  display: grid !important;
  align-content: center !important;
  border: 1px solid rgba(91, 157, 240, .24) !important;
  border-radius: 15px !important;
  background: rgba(4, 22, 47, .72) !important;
}

.selector-wrap:not(.is-hidden) input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 0 !important;
  color: #edf5ff !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
}

.scan-submit {
  position: relative !important;
  z-index: 5 !important;
  grid-column: 9 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 76px !important;
  padding: 0 24px !important;
  align-self: stretch !important;
  justify-content: center !important;
  overflow: hidden !important;
  border-radius: 15px !important;
  white-space: nowrap !important;
  box-shadow: 0 14px 30px rgba(13, 93, 228, .30) !important;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease !important;
}

.scan-submit::after {
  content: "";
  position: absolute;
  top: -50%;
  bottom: -50%;
  left: -45%;
  width: 34%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .25), transparent);
  transform: skewX(-18deg);
  pointer-events: none;
}

.scan-submit:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 18px 36px rgba(13, 93, 228, .38) !important;
  filter: brightness(1.04);
}

/* Most tests do not need a DKIM selector: use a spacious 7/5 control split. */
.scan-bar:has(> .selector-wrap.is-hidden) .scan-test-wrap.custom-tool-select {
  grid-column: 1 / span 7 !important;
}

.scan-bar:has(> .selector-wrap.is-hidden) .scan-submit {
  grid-column: 8 / -1 !important;
}

/* Dropdown always stays above the hero and following cards. */
.custom-tool-select.is-open {
  z-index: 4000 !important;
}

.tool-select-dropdown {
  z-index: 4200 !important;
  left: 0 !important;
  top: calc(100% + 12px) !important;
  width: min(540px, calc(100vw - 40px)) !important;
  max-width: none !important;
  max-height: min(540px, calc(100vh - 130px)) !important;
  transform-origin: top left;
}

.tool-select-options {
  max-height: min(455px, calc(100vh - 220px)) !important;
}

.feature-strip {
  position: relative !important;
  z-index: 5 !important;
}

.workspace {
  position: relative !important;
  z-index: 2 !important;
}

/* Centered desktop composition with the dashboard used as subtle scenery. */
@media (min-width: 1101px) {
  .hero {
    min-height: 690px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    padding: 54px clamp(28px, 5vw, 84px) 76px !important;
  }

  .hero-content {
    width: min(1080px, 100%) !important;
    max-width: none !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  .hero h1 {
    max-width: 930px !important;
    margin: 18px auto 18px !important;
    font-size: clamp(54px, 4.65vw, 74px) !important;
    line-height: 1.01 !important;
    text-wrap: balance;
  }

  .hero > .hero-content > p {
    max-width: 790px !important;
    margin-inline: auto !important;
  }

  .scan-examples,
  .hero-trust {
    justify-content: center !important;
  }

  .scan-consent {
    max-width: 900px !important;
    margin-inline: auto !important;
  }

  .hero-visual.hero-dashboard {
    position: absolute !important;
    z-index: 1 !important;
    right: -120px !important;
    top: 50% !important;
    width: 560px !important;
    min-width: 0 !important;
    max-width: 560px !important;
    opacity: .17 !important;
    pointer-events: none !important;
    transform: translateY(-48%) scale(.90) !important;
    transform-origin: center right !important;
    filter: saturate(.85) contrast(.94) !important;
  }
}

/* Laptop and tablet: retain the two-row concept and reduce density. */
@media (min-width: 761px) and (max-width: 1100px) {
  .hero-content {
    width: min(930px, 100%) !important;
    max-width: none !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  .hero > .hero-content > p {
    margin-inline: auto !important;
  }

  .scan-examples,
  .hero-trust {
    justify-content: center !important;
  }

  .scan-bar {
    width: min(900px, 100%) !important;
    max-width: 900px !important;
  }

  .scan-target-entry {
    min-height: 82px !important;
  }

  .scan-submit {
    min-height: 74px !important;
    padding-inline: 18px !important;
  }
}

/* Narrow tablet/mobile: every control receives its own row. */
@media (max-width: 850px) {
  .scan-bar {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 11px !important;
    border-radius: 19px !important;
  }

  .scan-input-wrap.scan-target-field,
  .scan-test-wrap.custom-tool-select,
  .selector-wrap:not(.is-hidden),
  .scan-submit,
  .scan-bar:has(> .selector-wrap.is-hidden) .scan-test-wrap.custom-tool-select,
  .scan-bar:has(> .selector-wrap.is-hidden) .scan-submit {
    grid-column: 1 / -1 !important;
  }

  .scan-input-wrap.scan-target-field { grid-row: 1 !important; }
  .scan-test-wrap.custom-tool-select { grid-row: 2 !important; }
  .selector-wrap:not(.is-hidden) { grid-row: 3 !important; }
  .scan-submit { grid-row: 4 !important; }
  .scan-bar:has(> .selector-wrap.is-hidden) .scan-submit { grid-row: 3 !important; }

  .scan-target-entry {
    min-height: 76px !important;
    padding: 13px 15px !important;
    gap: 12px !important;
  }

  .scan-target-field .target-label-icon {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    flex-basis: 48px !important;
    border-radius: 14px !important;
  }

  .scan-target-field input,
  #targetInput {
    min-height: 48px !important;
    font-size: clamp(17px, 3.1vw, 21px) !important;
  }

  .scan-target-field input::placeholder,
  #targetInput::placeholder {
    font-size: clamp(14px, 2.7vw, 18px) !important;
  }

  .scan-test-wrap.custom-tool-select,
  .selector-wrap:not(.is-hidden) {
    padding: 9px 12px !important;
  }

  .scan-submit {
    min-height: 58px !important;
  }

  .tool-select-dropdown {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: auto !important;
    bottom: 12px !important;
    width: auto !important;
    max-height: min(76vh, 640px) !important;
    border-radius: 20px !important;
    transform-origin: bottom center !important;
  }

  .tool-select-dropdown::before {
    display: none !important;
  }

  .tool-select-options {
    max-height: calc(min(76vh, 640px) - 82px) !important;
  }
}

@media (max-width: 560px) {
  .hero {
    padding-inline: 15px !important;
  }

  .hero h1 {
    font-size: clamp(39px, 11.2vw, 48px) !important;
    letter-spacing: -.055em !important;
  }

  .scan-bar {
    margin-top: 24px !important;
    padding: 10px !important;
    border-radius: 17px !important;
  }

  .scan-target-entry {
    min-height: 70px !important;
    padding: 11px 12px !important;
    gap: 10px !important;
    border-radius: 15px !important;
  }

  .scan-target-field .target-label-icon {
    width: 43px !important;
    height: 43px !important;
    min-width: 43px !important;
    flex-basis: 43px !important;
    font-size: 19px !important;
  }

  .scan-target-field input,
  #targetInput {
    min-height: 43px !important;
    padding-inline: 1px !important;
    font-size: 17px !important;
  }

  .scan-target-field input::placeholder,
  #targetInput::placeholder {
    font-size: 14px !important;
  }

  .target-input-hint,
  .target-input-error {
    padding-inline: 2px !important;
    font-size: 9.5px !important;
  }

  .scan-examples {
    justify-content: center !important;
    flex-wrap: wrap !important;
  }

  .hero-trust {
    justify-content: center !important;
  }
}

/* Light mode equivalents. */
:root[data-theme="light"] .scan-bar {
  border-color: rgba(49, 119, 223, .32) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(49, 119, 223, .10), transparent 34%),
    linear-gradient(145deg, rgba(246, 251, 255, .99), rgba(238, 248, 255, .99)) !important;
  box-shadow:
    0 28px 66px rgba(23, 69, 112, .15),
    0 0 0 1px rgba(49, 119, 223, .05),
    0 0 36px rgba(49, 119, 223, .10) !important;
}

:root[data-theme="light"] .scan-target-entry {
  border-color: rgba(49, 119, 223, .30) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(49, 119, 223, .13), transparent 36%),
    linear-gradient(135deg, #f4f9ff, #e8f9ff 54%, #fff) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .90), 0 14px 30px rgba(21, 51, 83, .10) !important;
}

:root[data-theme="light"] .scan-target-field:focus-within .scan-target-entry {
  border-color: #3177df !important;
  background: linear-gradient(135deg, #f7fbff, #edfaff 54%, #fff) !important;
  box-shadow: 0 0 0 5px rgba(49, 119, 223, .11), 0 18px 34px rgba(21, 51, 83, .12) !important;
}

:root[data-theme="light"] .scan-target-field input,
:root[data-theme="light"] #targetInput {
  color: #0b2742 !important;
}

:root[data-theme="light"] .scan-target-field input::placeholder,
:root[data-theme="light"] #targetInput::placeholder {
  color: #617b96 !important;
}

:root[data-theme="light"] .target-input-hint {
  color: #607892 !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select,
:root[data-theme="light"] .selector-wrap:not(.is-hidden) {
  border-color: rgba(49, 119, 223, .16) !important;
  background: rgba(255, 255, 255, .82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 7px 18px rgba(22, 52, 84, .05) !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select > label,
:root[data-theme="light"] .selector-wrap > label {
  color: #6b8198 !important;
}

:root[data-theme="light"] .selector-wrap:not(.is-hidden) input {
  color: #0c2034 !important;
}

/* Motion is subtle and disabled for users who prefer reduced motion. */
@keyframes scanComposerIn {
  from { opacity: 0; transform: translateY(16px) scale(.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes targetSweep {
  0%, 15% { left: -38%; opacity: 0; }
  28% { opacity: 1; }
  62% { left: 112%; opacity: .75; }
  63%, 100% { left: 112%; opacity: 0; }
}

@keyframes submitSweep {
  0%, 24% { left: -45%; opacity: 0; }
  35% { opacity: 1; }
  62% { left: 118%; opacity: .85; }
  63%, 100% { left: 118%; opacity: 0; }
}

@keyframes toolDropdownIn {
  from { opacity: 0; transform: translateY(-7px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: no-preference) {
  .scan-bar {
    animation: scanComposerIn .62s cubic-bezier(.2, .72, .2, 1) both;
  }

  .scan-target-entry::before {
    animation: targetSweep 5.4s ease-in-out 1.1s infinite;
  }

  .scan-submit::after {
    animation: submitSweep 5.8s ease-in-out 1.8s infinite;
  }

  .tool-select-dropdown:not([hidden]) {
    animation: toolDropdownIn .18s ease-out both;
  }
}

@media (prefers-reduced-motion: reduce) {
  .scan-bar,
  .scan-target-entry::before,
  .scan-submit::after,
  .tool-select-dropdown:not([hidden]) {
    animation: none !important;
  }

  .scan-target-entry,
  .target-label-icon,
  .scan-submit {
    transition: none !important;
  }
}

/* =========================================================
   CYBEROCENA v6.2 — modern hero + fixed dropdown layering
   ========================================================= */

.hero {
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  min-height: 430px !important;
  margin: 0 !important;
  padding: 34px max(28px, calc((100vw - var(--max)) / 2)) 34px !important;
  display: block !important;
  background:
    radial-gradient(circle at 78% 20%, rgba(43, 119, 255, .22), transparent 26%),
    radial-gradient(circle at 84% 58%, rgba(0, 213, 255, .12), transparent 22%),
    linear-gradient(135deg, #040d1f 0%, #071c39 50%, #09244a 100%) !important;
  border-bottom: 1px solid rgba(96, 156, 234, .14) !important;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), transparent 22%),
    radial-gradient(circle at 18% 16%, rgba(75, 138, 255, .08), transparent 26%);
  pointer-events: none;
  z-index: 0;
}

.hero::after {
  content: "";
  position: absolute;
  right: clamp(28px, 6vw, 110px);
  top: 18px;
  width: min(35vw, 440px);
  height: min(35vw, 440px);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(58, 133, 255, .18) 0%, rgba(10, 36, 74, 0) 68%);
  filter: blur(10px);
  opacity: .95;
  pointer-events: none;
  z-index: 0;
}

.hero-content {
  position: relative !important;
  z-index: 120 !important;
  width: min(980px, 100%) !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

.eyebrow {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px !important;
  padding: 8px 14px !important;
  border-radius: 999px !important;
  background: rgba(8, 24, 47, .62) !important;
  border: 1px solid rgba(112, 165, 241, .26) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 24px rgba(3, 10, 25, .18) !important;
  color: #d9e9ff !important;
  backdrop-filter: blur(10px);
}

.eyebrow,
.eyebrow * {
  font-size: 12px !important;
  letter-spacing: .08em !important;
  text-transform: uppercase;
}

.pulse-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1edc87 !important;
  box-shadow: 0 0 0 6px rgba(30, 220, 135, .12) !important;
}

.hero h1 {
  max-width: 860px !important;
  margin: 0 auto 14px !important;
  font-size: clamp(40px, 4.8vw, 68px) !important;
  line-height: .98 !important;
  letter-spacing: -.05em !important;
  color: #f5f9ff !important;
  text-wrap: balance;
}

.hero h1 span {
  color: #59a4ff !important;
}

.hero h1 em {
  font-style: normal !important;
  background: linear-gradient(90deg, #4eb2ff 0%, #2ae3cf 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.hero > .hero-content > p,
.hero p {
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  font-size: 17px !important;
  line-height: 1.58 !important;
  color: #a7bcda !important;
}

.scan-bar {
  position: relative !important;
  z-index: 3000 !important;
  width: min(1000px, 100%) !important;
  max-width: 1000px !important;
  margin: 24px auto 0 !important;
  padding: 14px !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, rgba(7, 24, 47, .88), rgba(5, 18, 36, .94)) !important;
  border: 1px solid rgba(91, 154, 231, .24) !important;
  box-shadow: 0 20px 44px rgba(2, 8, 24, .28), inset 0 1px 0 rgba(255,255,255,.04) !important;
  overflow: visible !important;
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) minmax(260px, .42fr) minmax(220px, .34fr) !important;
  gap: 12px !important;
  align-items: center !important;
}

.scan-tool-icon {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, rgba(35, 118, 255, .22), rgba(18, 200, 202, .18)) !important;
  border: 1px solid rgba(92, 160, 255, .22) !important;
  color: #89c1ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.scan-target-field {
  min-width: 0 !important;
  width: 100% !important;
}

.scan-target-entry {
  min-height: 68px !important;
  padding: 10px 14px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(88, 160, 250, .20) !important;
  background: linear-gradient(135deg, rgba(11, 44, 80, .92), rgba(9, 68, 98, .40) 54%, rgba(7, 31, 56, .95)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 24px rgba(3, 11, 26, .14) !important;
}

.scan-target-field .target-label-icon {
  width: 46px !important;
  height: 46px !important;
  flex-basis: 46px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #2580ff, #22d2c8) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(18, 100, 240, .24) !important;
}

.scan-target-field input {
  min-height: 46px !important;
  font-size: 19px !important;
  font-weight: 800 !important;
  color: #f3f8ff !important;
}

.scan-target-field input::placeholder {
  color: #95aeca !important;
  opacity: 1 !important;
}

.target-input-hint {
  margin-top: 8px !important;
  padding-left: 4px;
  color: #778fad !important;
  font-size: 12px !important;
}

.scan-test-wrap.custom-tool-select,
.selector-wrap:not(.is-hidden) {
  position: relative !important;
  z-index: 3300 !important;
  align-self: stretch !important;
  min-height: 68px !important;
  padding: 10px 12px !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(8, 24, 46, .96), rgba(6, 20, 38, .96)) !important;
  border: 1px solid rgba(90, 153, 232, .18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
}

.scan-test-wrap.custom-tool-select > label,
.selector-wrap > label {
  margin-bottom: 8px !important;
  color: #86a0be !important;
  font-size: 10px !important;
  letter-spacing: .12em !important;
}

.custom-tool-select,
.custom-tool-select.is-open {
  z-index: 3600 !important;
  overflow: visible !important;
}

.tool-select-button {
  min-height: 46px !important;
  border-radius: 14px !important;
  background: rgba(10, 34, 63, .88) !important;
  border: 1px solid rgba(91, 153, 232, .18) !important;
}

.tool-select-dropdown {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: calc(100% + 10px) !important;
  width: min(460px, calc(100vw - 42px)) !important;
  z-index: 9999 !important;
  background: linear-gradient(180deg, #0b2344, #07172d) !important;
  border: 1px solid rgba(95, 158, 241, .34) !important;
  box-shadow: 0 28px 70px rgba(0,0,0,.48), 0 0 0 1px rgba(255,255,255,.02) !important;
}

.tool-select-open .hero,
.tool-select-open .hero-content,
.tool-select-open .scan-bar {
  z-index: 5000 !important;
}

.tool-select-open .feature-strip,
.feature-strip {
  position: relative !important;
  z-index: 1 !important;
}

.scan-submit {
  min-height: 68px !important;
  border-radius: 18px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, #2680ff, #0e61e7) !important;
  box-shadow: 0 18px 34px rgba(8, 89, 224, .28) !important;
}

.scan-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 22px 38px rgba(8, 89, 224, .34) !important;
}

.scan-examples {
  margin-top: 12px !important;
  justify-content: center;
}

.scan-examples span,
.scan-examples button {
  font-size: 12px !important;
}

.hero-trust {
  justify-content: center !important;
  gap: 18px !important;
  margin-top: 18px !important;
  color: #c6d6ea !important;
}

.scan-consent {
  margin-top: 10px !important;
  color: #7e94b1 !important;
}

.hero-visual {
  position: absolute !important;
  right: max(28px, calc((100vw - var(--max)) / 2)) !important;
  top: 50% !important;
  transform: translateY(-44%) scale(.82) !important;
  width: 410px !important;
  height: 320px !important;
  opacity: .62 !important;
  pointer-events: none !important;
  z-index: 20 !important;
}

.feature-strip {
  margin: -8px max(28px, calc((100vw - var(--max)) / 2)) 18px !important;
}

@media (max-width: 1180px) {
  .hero {
    min-height: auto !important;
    padding-bottom: 30px !important;
  }

  .hero-visual {
    display: none !important;
  }

  .scan-bar {
    grid-template-columns: 54px minmax(0, 1fr) minmax(220px, .42fr) minmax(190px, .34fr) !important;
  }
}

@media (max-width: 920px) {
  .hero {
    padding: 32px 18px 34px !important;
  }

  .hero h1 {
    font-size: clamp(34px, 8vw, 50px) !important;
  }

  .hero > .hero-content > p,
  .hero p {
    font-size: 16px !important;
  }

  .scan-bar {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    padding: 12px !important;
  }

  .scan-test-wrap.custom-tool-select,
  .selector-wrap:not(.is-hidden),
  .scan-submit {
    grid-column: 1 / -1 !important;
  }

  .scan-target-field {
    grid-column: 2 !important;
  }

  .feature-strip {
    margin: 14px 18px 18px !important;
  }
}

@media (max-width: 560px) {
  .eyebrow {
    margin-bottom: 10px !important;
  }

  .hero {
    padding: 26px 12px 28px !important;
  }

  .scan-bar {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .scan-tool-icon,
  .scan-target-field,
  .scan-test-wrap.custom-tool-select,
  .selector-wrap:not(.is-hidden),
  .scan-submit {
    grid-column: auto !important;
  }

  .scan-tool-icon {
    width: 48px !important;
    height: 48px !important;
  }

  .scan-target-entry {
    min-height: 60px !important;
    padding: 8px 12px !important;
  }

  .scan-target-field input {
    font-size: 17px !important;
    min-height: 40px !important;
  }

  .scan-submit {
    min-height: 60px !important;
  }

  .feature-strip {
    margin: 12px 12px 18px !important;
  }
}

:root[data-theme="light"] .hero {
  background:
    radial-gradient(circle at 78% 18%, rgba(79, 150, 255, .16), transparent 25%),
    radial-gradient(circle at 84% 55%, rgba(46, 213, 255, .12), transparent 22%),
    linear-gradient(135deg, #f7fbff 0%, #edf5ff 52%, #e9f1fb 100%) !important;
  border-bottom-color: rgba(49, 119, 223, .12) !important;
}

:root[data-theme="light"] .hero::before {
  background:
    linear-gradient(180deg, rgba(255,255,255,.55), transparent 22%),
    radial-gradient(circle at 18% 16%, rgba(75, 138, 255, .08), transparent 26%);
}

:root[data-theme="light"] .eyebrow {
  background: rgba(255,255,255,.78) !important;
  border-color: rgba(49, 119, 223, .16) !important;
  color: #14406c !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 10px 24px rgba(22, 52, 84, .08) !important;
}

:root[data-theme="light"] .hero h1 {
  color: #0d2340 !important;
}

:root[data-theme="light"] .hero > .hero-content > p,
:root[data-theme="light"] .hero p {
  color: #58708c !important;
}

:root[data-theme="light"] .scan-bar {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,251,255,.97)) !important;
  border-color: rgba(49, 119, 223, .18) !important;
  box-shadow: 0 18px 42px rgba(23, 45, 68, .10), inset 0 1px 0 rgba(255,255,255,.7) !important;
}

:root[data-theme="light"] .scan-target-entry {
  background: linear-gradient(135deg, #eef7ff, #e6fbff 56%, #ffffff) !important;
  border-color: rgba(49, 119, 223, .18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 8px 20px rgba(22, 52, 84, .06) !important;
}

:root[data-theme="light"] .scan-target-field input {
  color: #0c2034 !important;
}

:root[data-theme="light"] .scan-target-field input::placeholder {
  color: #6f87a0 !important;
}

:root[data-theme="light"] .target-input-hint,
:root[data-theme="light"] .scan-consent {
  color: #67809b !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select,
:root[data-theme="light"] .selector-wrap:not(.is-hidden) {
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(49, 119, 223, .16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 8px 20px rgba(22, 52, 84, .05) !important;
}

:root[data-theme="light"] .tool-select-button {
  background: #f7fbff !important;
  border-color: rgba(49, 119, 223, .16) !important;
}

:root[data-theme="light"] .tool-select-dropdown {
  background: linear-gradient(180deg, #ffffff, #f5f9fd) !important;
  border-color: rgba(15, 42, 68, .14) !important;
  box-shadow: 0 24px 56px rgba(23, 45, 68, .16) !important;
}

/* =========================================================
   CYBEROCENA v6.3 — premium hero variant
   ========================================================= */

.hero {
  background:
    radial-gradient(circle at 18% 18%, rgba(71, 119, 255, .10), transparent 24%),
    radial-gradient(circle at 82% 16%, rgba(20, 212, 200, .16), transparent 20%),
    radial-gradient(circle at 86% 58%, rgba(68, 119, 255, .14), transparent 22%),
    linear-gradient(135deg, #020814 0%, #07152b 34%, #0a1f3f 66%, #091830 100%) !important;
  border-bottom: 1px solid rgba(115, 166, 244, .16) !important;
}

.hero::before {
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), transparent 22%),
    radial-gradient(circle at 22% 18%, rgba(90, 135, 255, .06), transparent 26%),
    repeating-linear-gradient(90deg, transparent 0 112px, rgba(255,255,255,.018) 112px 113px) !important;
  opacity: .95;
}

.hero::after {
  right: clamp(30px, 7vw, 120px);
  top: 8px;
  width: min(38vw, 520px);
  height: min(38vw, 520px);
  background:
    radial-gradient(circle, rgba(68, 134, 255, .20) 0%, rgba(27, 83, 176, .07) 40%, rgba(7, 22, 43, 0) 72%);
  filter: blur(8px);
}

.hero-content {
  width: min(1020px, 100%) !important;
  max-width: 1020px !important;
}

.eyebrow {
  background: linear-gradient(180deg, rgba(9, 28, 55, .82), rgba(8, 20, 39, .76)) !important;
  border: 1px solid rgba(111, 160, 237, .22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 10px 26px rgba(1, 8, 22, .22),
    0 0 0 1px rgba(83, 141, 231, .04) !important;
  color: #e7f2ff !important;
}

.hero h1 {
  font-size: clamp(42px, 5vw, 72px) !important;
  line-height: .96 !important;
  letter-spacing: -.055em !important;
  text-shadow: 0 2px 18px rgba(4, 11, 25, .22);
}

.hero h1 span {
  color: #77b8ff !important;
}

.hero h1 em {
  background: linear-gradient(90deg, #79c6ff 0%, #5ee8dd 45%, #b8fff7 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

.hero > .hero-content > p,
.hero p {
  max-width: 800px !important;
  color: #b2c7e2 !important;
}

.scan-bar {
  padding: 16px !important;
  border-radius: 24px !important;
  background:
    linear-gradient(180deg, rgba(11, 28, 53, .86), rgba(6, 19, 39, .94)) !important;
  border: 1px solid rgba(103, 157, 234, .22) !important;
  box-shadow:
    0 24px 50px rgba(1, 8, 22, .34),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 0 0 1px rgba(86, 140, 226, .05) !important;
  backdrop-filter: blur(22px) saturate(140%);
}

.scan-bar::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0));
  pointer-events: none;
}

.scan-tool-icon {
  background: linear-gradient(135deg, rgba(46, 112, 255, .22), rgba(21, 214, 202, .22)) !important;
  border: 1px solid rgba(111, 163, 243, .18) !important;
  color: #a5d0ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 26px rgba(4, 13, 30, .18) !important;
}

.scan-target-entry {
  border-radius: 18px !important;
  border: 1px solid rgba(98, 160, 242, .20) !important;
  background:
    linear-gradient(135deg, rgba(13, 46, 82, .98), rgba(9, 84, 118, .42) 55%, rgba(7, 34, 60, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 0 0 1px rgba(255,255,255,.01),
    0 14px 28px rgba(2, 9, 23, .18) !important;
}

.scan-target-entry::before {
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.13), rgba(255,255,255,0)) !important;
}

.scan-target-field:focus-within .scan-target-entry {
  border-color: rgba(104, 180, 255, .45) !important;
  box-shadow:
    0 0 0 4px rgba(58, 129, 255, .12),
    0 16px 34px rgba(3, 11, 25, .24),
    inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.scan-target-field .target-label-icon {
  background: linear-gradient(135deg, #2a7eff, #22d4cc) !important;
  box-shadow:
    0 12px 26px rgba(17, 97, 238, .28),
    inset 0 1px 0 rgba(255,255,255,.25) !important;
}

.scan-target-field input {
  letter-spacing: -.02em !important;
}

.target-input-hint {
  color: #8199b7 !important;
}

.scan-test-wrap.custom-tool-select,
.selector-wrap:not(.is-hidden) {
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(9, 25, 47, .98), rgba(7, 19, 37, .98)) !important;
  border: 1px solid rgba(99, 156, 231, .18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 10px 24px rgba(3, 10, 22, .12) !important;
}

.scan-test-wrap.custom-tool-select > label,
.selector-wrap > label {
  color: #91a8c4 !important;
}

.tool-select-button {
  min-height: 48px !important;
  border-radius: 15px !important;
  background: linear-gradient(180deg, rgba(12, 37, 69, .95), rgba(8, 26, 49, .95)) !important;
  border: 1px solid rgba(98, 156, 232, .18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.tool-select-button:hover {
  border-color: rgba(113, 174, 251, .34) !important;
  background: linear-gradient(180deg, rgba(14, 42, 77, .98), rgba(9, 29, 54, .98)) !important;
}

.tool-select-button-copy strong {
  color: #eff6ff !important;
}

.tool-select-button-copy small {
  color: #83a0be !important;
}

.tool-select-dropdown {
  border-radius: 18px !important;
  background: linear-gradient(180deg, #0c2648, #071a33) !important;
  border: 1px solid rgba(100, 160, 238, .28) !important;
  box-shadow:
    0 30px 76px rgba(0,0,0,.52),
    0 0 0 1px rgba(255,255,255,.02),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.tool-select-search {
  background: rgba(7, 24, 46, .72) !important;
  border-color: rgba(93, 152, 229, .14) !important;
}

.scan-submit {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #2684ff 0%, #175ef0 58%, #1d56cf 100%) !important;
  border: 1px solid rgba(117, 172, 247, .16) !important;
  box-shadow:
    0 20px 38px rgba(8, 89, 224, .32),
    inset 0 1px 0 rgba(255,255,255,.16) !important;
}

.scan-submit::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0));
  pointer-events: none;
}

.scan-submit:hover {
  box-shadow:
    0 24px 42px rgba(8, 89, 224, .38),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}

.scan-examples button {
  background: rgba(13, 39, 73, .84) !important;
  border: 1px solid rgba(91, 149, 226, .16) !important;
  color: #c8dcf4 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
}

.scan-examples button:hover {
  border-color: rgba(112, 175, 250, .28) !important;
  color: #f1f7ff !important;
}

.hero-trust {
  color: #cfdded !important;
}

.hero-visual {
  opacity: .78 !important;
  transform: translateY(-46%) scale(.88) !important;
  filter: drop-shadow(0 18px 40px rgba(0, 0, 0, .22));
}

.float-stat,
.domain-console {
  backdrop-filter: blur(10px) saturate(130%);
}

:root[data-theme="light"] .hero {
  background:
    radial-gradient(circle at 18% 16%, rgba(79, 150, 255, .10), transparent 24%),
    radial-gradient(circle at 82% 16%, rgba(46, 213, 255, .12), transparent 20%),
    radial-gradient(circle at 86% 58%, rgba(79, 150, 255, .10), transparent 22%),
    linear-gradient(135deg, #fbfdff 0%, #eef5fd 38%, #edf5ff 68%, #f7fbff 100%) !important;
}

:root[data-theme="light"] .hero::before {
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), transparent 24%),
    repeating-linear-gradient(90deg, transparent 0 112px, rgba(18, 72, 138, .028) 112px 113px) !important;
}

:root[data-theme="light"] .eyebrow {
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(247,251,255,.86)) !important;
  border-color: rgba(49, 119, 223, .14) !important;
  color: #18436c !important;
}

:root[data-theme="light"] .hero h1 {
  color: #0d2340 !important;
  text-shadow: none;
}

:root[data-theme="light"] .hero > .hero-content > p,
:root[data-theme="light"] .hero p {
  color: #5c728d !important;
}

:root[data-theme="light"] .scan-bar {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(248,251,255,.98)) !important;
  border-color: rgba(49, 119, 223, .16) !important;
  box-shadow: 0 20px 42px rgba(23, 45, 68, .10), inset 0 1px 0 rgba(255,255,255,.9) !important;
}

:root[data-theme="light"] .scan-target-entry {
  background: linear-gradient(135deg, #eef7ff, #e4fbff 58%, #ffffff) !important;
  border-color: rgba(49, 119, 223, .16) !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select,
:root[data-theme="light"] .selector-wrap:not(.is-hidden) {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,251,255,.94)) !important;
  border-color: rgba(49, 119, 223, .14) !important;
}

:root[data-theme="light"] .tool-select-button {
  background: linear-gradient(180deg, #fcfeff, #f1f7fc) !important;
  border-color: rgba(49, 119, 223, .14) !important;
}

:root[data-theme="light"] .tool-select-button-copy strong {
  color: #153251 !important;
}

:root[data-theme="light"] .tool-select-button-copy small {
  color: #698099 !important;
}

:root[data-theme="light"] .tool-select-dropdown {
  background: linear-gradient(180deg, #ffffff, #f6faff) !important;
  border-color: rgba(15, 42, 68, .14) !important;
  box-shadow: 0 26px 58px rgba(23, 45, 68, .16), inset 0 1px 0 rgba(255,255,255,.85) !important;
}

:root[data-theme="light"] .scan-examples button {
  background: #f3f8fd !important;
  border-color: rgba(49, 119, 223, .12) !important;
  color: #31577a !important;
}

/* =========================================================
   CYBEROCENA v6.4 — premium cyber-tech hero (version 2)
   ========================================================= */

.hero {
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  background:
    radial-gradient(circle at 14% 16%, rgba(64, 124, 255, .14), transparent 24%),
    radial-gradient(circle at 78% 14%, rgba(22, 233, 214, .18), transparent 20%),
    radial-gradient(circle at 82% 52%, rgba(53, 115, 255, .16), transparent 24%),
    linear-gradient(135deg, #030914 0%, #07172c 36%, #0a2243 66%, #08172f 100%) !important;
  border-bottom: 1px solid rgba(96, 157, 240, .16) !important;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), transparent 22%),
    repeating-linear-gradient(90deg, transparent 0 110px, rgba(255,255,255,.02) 110px 111px),
    repeating-linear-gradient(180deg, transparent 0 110px, rgba(255,255,255,.015) 110px 111px);
  mask-image: linear-gradient(180deg, rgba(0,0,0,.95), rgba(0,0,0,.78));
  opacity: .95;
  pointer-events: none;
  z-index: 0;
}

.hero::after {
  content: "";
  position: absolute;
  right: clamp(28px, 7vw, 120px);
  top: 8px;
  width: min(40vw, 520px);
  height: min(40vw, 520px);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(50, 131, 255, .22) 0%, rgba(16, 77, 180, .10) 40%, rgba(5, 21, 42, 0) 72%);
  filter: blur(10px);
  pointer-events: none;
  z-index: 0;
}

.hero-content {
  position: relative !important;
  z-index: 220 !important;
  width: min(1020px, 100%) !important;
  max-width: 1020px !important;
}

.eyebrow {
  background: linear-gradient(180deg, rgba(8, 26, 52, .82), rgba(7, 19, 38, .76)) !important;
  border: 1px solid rgba(95, 160, 244, .24) !important;
  color: #e3f0ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 28px rgba(1, 8, 20, .2) !important;
}

.pulse-dot {
  background: #21e2b1 !important;
  box-shadow: 0 0 0 6px rgba(33, 226, 177, .12) !important;
}

.hero h1 {
  font-size: clamp(42px, 5vw, 72px) !important;
  line-height: .95 !important;
  letter-spacing: -.055em !important;
  color: #f6f9ff !important;
  text-shadow: 0 3px 24px rgba(0, 0, 0, .18);
}

.hero h1 span {
  color: #7dc1ff !important;
}

.hero h1 em {
  font-style: normal !important;
  background: linear-gradient(90deg, #6fd0ff 0%, #32ead6 45%, #b8fff6 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.hero > .hero-content > p,
.hero p {
  max-width: 800px !important;
  color: #b4c8e3 !important;
}

.scan-bar {
  position: relative !important;
  z-index: 6000 !important;
  overflow: visible !important;
  padding: 16px !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, rgba(9, 27, 51, .90), rgba(5, 18, 37, .96)) !important;
  border: 1px solid rgba(98, 160, 240, .22) !important;
  box-shadow:
    0 26px 52px rgba(1, 8, 22, .34),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 0 0 1px rgba(77, 140, 236, .05) !important;
  backdrop-filter: blur(24px) saturate(145%);
}

.scan-bar::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
  pointer-events: none;
}

.scan-tool-icon {
  background: linear-gradient(135deg, rgba(35, 116, 255, .24), rgba(28, 220, 205, .24)) !important;
  border: 1px solid rgba(91, 158, 245, .18) !important;
  color: #9ed2ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 24px rgba(3, 11, 26, .16) !important;
}

.scan-target-entry {
  border-radius: 18px !important;
  border: 1px solid rgba(96, 162, 242, .18) !important;
  background:
    linear-gradient(135deg, rgba(12, 45, 82, .98), rgba(8, 82, 115, .42) 55%, rgba(7, 33, 58, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 14px 30px rgba(2, 9, 23, .16) !important;
}

.scan-target-field:focus-within .scan-target-entry {
  border-color: rgba(100, 177, 255, .45) !important;
  box-shadow: 0 0 0 4px rgba(53, 130, 255, .12), 0 18px 34px rgba(3, 11, 25, .22) !important;
}

.scan-target-field .target-label-icon {
  background: linear-gradient(135deg, #297fff, #22d9cf) !important;
  box-shadow: 0 12px 26px rgba(17, 98, 238, .28), inset 0 1px 0 rgba(255,255,255,.25) !important;
}

.scan-target-field input {
  color: #f2f8ff !important;
  font-size: 19px !important;
  font-weight: 820 !important;
  letter-spacing: -.02em !important;
}

.scan-target-field input::placeholder {
  color: #93aac6 !important;
}

.target-input-hint {
  color: #8199b6 !important;
}

.scan-test-wrap.custom-tool-select,
.selector-wrap:not(.is-hidden) {
  position: relative !important;
  z-index: 6500 !important;
  overflow: visible !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(9, 25, 47, .98), rgba(7, 19, 37, .98)) !important;
  border: 1px solid rgba(97, 157, 236, .18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 10px 24px rgba(3, 10, 22, .12) !important;
}

.scan-test-wrap.custom-tool-select > label,
.selector-wrap > label {
  color: #93a9c4 !important;
}

.custom-tool-select,
.custom-tool-select.is-open {
  position: relative !important;
  z-index: 7000 !important;
  overflow: visible !important;
}

.tool-select-button {
  min-height: 48px !important;
  border-radius: 15px !important;
  background: linear-gradient(180deg, rgba(12, 37, 69, .95), rgba(8, 26, 49, .95)) !important;
  border: 1px solid rgba(99, 156, 232, .18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.tool-select-button:hover {
  border-color: rgba(113, 174, 251, .34) !important;
  background: linear-gradient(180deg, rgba(14, 42, 77, .98), rgba(9, 29, 54, .98)) !important;
}

.tool-select-button-copy strong {
  color: #eff6ff !important;
}

.tool-select-button-copy small {
  color: #84a0be !important;
}

.tool-select-dropdown {
  position: absolute !important;
  left: 0 !important;
  top: calc(100% + 10px) !important;
  width: min(460px, calc(100vw - 42px)) !important;
  z-index: 99999 !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #0c2648, #071a33) !important;
  border: 1px solid rgba(99, 160, 238, .30) !important;
  box-shadow: 0 34px 84px rgba(0,0,0,.56), 0 0 0 1px rgba(255,255,255,.02), inset 0 1px 0 rgba(255,255,255,.04) !important;
  overflow: hidden !important;
}

.tool-select-dropdown::before {
  z-index: 1 !important;
}

.tool-select-search {
  background: rgba(7, 24, 46, .72) !important;
  border-color: rgba(93, 152, 229, .14) !important;
}

.tool-select-options {
  position: relative !important;
  z-index: 2 !important;
}

.tool-option {
  border-radius: 14px !important;
}

.tool-select-open .hero,
.tool-select-open .hero-content,
.tool-select-open .scan-bar,
.tool-select-open .custom-tool-select {
  z-index: 8000 !important;
  overflow: visible !important;
}

.feature-strip,
.tool-select-open .feature-strip,
.workspace,
.tool-select-open .workspace {
  position: relative !important;
  z-index: 1 !important;
}

.scan-submit {
  position: relative !important;
  overflow: hidden !important;
  background: linear-gradient(135deg, #2484ff 0%, #1b66f0 60%, #194ecb 100%) !important;
  border: 1px solid rgba(119, 173, 248, .14) !important;
  box-shadow: 0 20px 38px rgba(8, 89, 224, .34), inset 0 1px 0 rgba(255,255,255,.16) !important;
}

.scan-submit::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0));
  pointer-events: none;
}

.scan-submit:hover {
  box-shadow: 0 24px 42px rgba(8, 89, 224, .40), inset 0 1px 0 rgba(255,255,255,.18) !important;
}

.scan-examples button {
  background: rgba(13, 39, 73, .84) !important;
  border: 1px solid rgba(91, 149, 226, .16) !important;
  color: #c8dcf4 !important;
}

.scan-examples button:hover {
  border-color: rgba(112, 175, 250, .28) !important;
  color: #f1f7ff !important;
}

.hero-trust {
  color: #cfdded !important;
}

.hero-visual {
  opacity: .8 !important;
  transform: translateY(-46%) scale(.9) !important;
  filter: drop-shadow(0 18px 40px rgba(0, 0, 0, .24));
}

@media (max-width: 920px) {
  .scan-bar {
    z-index: 6000 !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
  }

  .scan-test-wrap.custom-tool-select,
  .selector-wrap:not(.is-hidden),
  .scan-submit {
    grid-column: 1 / -1 !important;
  }

  .scan-target-field {
    grid-column: 2 !important;
  }

  .tool-select-dropdown {
    width: min(100%, calc(100vw - 36px)) !important;
  }
}

@media (max-width: 560px) {
  .scan-bar {
    grid-template-columns: 1fr !important;
  }

  .scan-tool-icon,
  .scan-target-field,
  .scan-test-wrap.custom-tool-select,
  .selector-wrap:not(.is-hidden),
  .scan-submit {
    grid-column: auto !important;
  }

  .tool-select-dropdown {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: auto !important;
    bottom: 12px !important;
    width: auto !important;
    z-index: 99999 !important;
  }
}

:root[data-theme="light"] .hero {
  background:
    radial-gradient(circle at 14% 16%, rgba(79, 150, 255, .10), transparent 24%),
    radial-gradient(circle at 78% 14%, rgba(46, 213, 255, .12), transparent 20%),
    radial-gradient(circle at 82% 52%, rgba(79, 150, 255, .10), transparent 24%),
    linear-gradient(135deg, #fbfdff 0%, #eef5fd 36%, #edf5ff 68%, #f7fbff 100%) !important;
}

:root[data-theme="light"] .hero::before {
  background:
    linear-gradient(180deg, rgba(255,255,255,.74), transparent 24%),
    repeating-linear-gradient(90deg, transparent 0 110px, rgba(18, 72, 138, .028) 110px 111px),
    repeating-linear-gradient(180deg, transparent 0 110px, rgba(18, 72, 138, .018) 110px 111px) !important;
}

:root[data-theme="light"] .eyebrow {
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(247,251,255,.86)) !important;
  border-color: rgba(49, 119, 223, .14) !important;
  color: #18436c !important;
}

:root[data-theme="light"] .hero h1 {
  color: #0d2340 !important;
  text-shadow: none !important;
}

:root[data-theme="light"] .hero > .hero-content > p,
:root[data-theme="light"] .hero p {
  color: #5c728d !important;
}

:root[data-theme="light"] .scan-bar {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(248,251,255,.98)) !important;
  border-color: rgba(49, 119, 223, .16) !important;
  box-shadow: 0 20px 42px rgba(23, 45, 68, .10), inset 0 1px 0 rgba(255,255,255,.9) !important;
}

:root[data-theme="light"] .scan-target-entry {
  background: linear-gradient(135deg, #eef7ff, #e4fbff 58%, #ffffff) !important;
  border-color: rgba(49, 119, 223, .16) !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select,
:root[data-theme="light"] .selector-wrap:not(.is-hidden) {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,251,255,.94)) !important;
  border-color: rgba(49, 119, 223, .14) !important;
}

:root[data-theme="light"] .tool-select-button {
  background: linear-gradient(180deg, #fcfeff, #f1f7fc) !important;
  border-color: rgba(49, 119, 223, .14) !important;
}

:root[data-theme="light"] .tool-select-button-copy strong {
  color: #153251 !important;
}

:root[data-theme="light"] .tool-select-button-copy small {
  color: #698099 !important;
}

:root[data-theme="light"] .tool-select-dropdown {
  background: linear-gradient(180deg, #ffffff, #f6faff) !important;
  border-color: rgba(15, 42, 68, .14) !important;
  box-shadow: 0 26px 58px rgba(23, 45, 68, .16), inset 0 1px 0 rgba(255,255,255,.85) !important;
}

/* =========================================================
   CYBEROCENA v6.5 — ultra clean premium
   ========================================================= */

.hero {
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  min-height: 410px !important;
  padding-top: 34px !important;
  padding-bottom: 30px !important;
  background:
    radial-gradient(circle at 78% 18%, rgba(62, 136, 255, .12), transparent 24%),
    radial-gradient(circle at 86% 56%, rgba(35, 209, 200, .08), transparent 20%),
    linear-gradient(135deg, #050b16 0%, #0a1628 48%, #0c1c35 100%) !important;
  border-bottom: 1px solid rgba(110, 157, 224, .13) !important;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.025), transparent 26%) !important;
  opacity: 1 !important;
  pointer-events: none;
  z-index: 0;
}

.hero::after {
  content: "";
  position: absolute;
  right: clamp(40px, 8vw, 140px);
  top: 26px;
  width: min(30vw, 400px);
  height: min(30vw, 400px);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(60, 130, 255, .12), rgba(60, 130, 255, 0) 70%);
  filter: blur(14px);
  pointer-events: none;
  z-index: 0;
}

.hero-content {
  position: relative !important;
  z-index: 220 !important;
  width: min(980px, 100%) !important;
  max-width: 980px !important;
}

.eyebrow {
  padding: 7px 13px !important;
  margin-bottom: 12px !important;
  background: rgba(11, 27, 49, .72) !important;
  border: 1px solid rgba(108, 158, 226, .18) !important;
  color: #dce9f7 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
  backdrop-filter: blur(12px);
}

.pulse-dot {
  background: #20d9a0 !important;
  box-shadow: 0 0 0 5px rgba(32, 217, 160, .10) !important;
}

.hero h1 {
  max-width: 840px !important;
  margin-bottom: 14px !important;
  font-size: clamp(40px, 4.8vw, 68px) !important;
  line-height: .98 !important;
  letter-spacing: -.05em !important;
  color: #f6f8fc !important;
  text-shadow: none !important;
}

.hero h1 span {
  color: #70aff7 !important;
}

.hero h1 em {
  background: linear-gradient(90deg, #68b7ff 0%, #42d7cc 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.hero > .hero-content > p,
.hero p {
  max-width: 760px !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
  color: #aebfd4 !important;
}

.scan-bar {
  position: relative !important;
  z-index: 6000 !important;
  width: min(980px, 100%) !important;
  max-width: 980px !important;
  margin-top: 22px !important;
  padding: 13px !important;
  gap: 10px !important;
  border-radius: 20px !important;
  overflow: visible !important;
  background: rgba(8, 22, 42, .90) !important;
  border: 1px solid rgba(106, 158, 229, .17) !important;
  box-shadow:
    0 18px 42px rgba(0, 7, 20, .28),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
  backdrop-filter: blur(20px) saturate(125%);
}

.scan-bar::before {
  display: none !important;
}

.scan-tool-icon {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  border-radius: 14px !important;
  background: rgba(30, 91, 164, .16) !important;
  border: 1px solid rgba(98, 155, 230, .16) !important;
  color: #8bc1f8 !important;
  box-shadow: none !important;
}

.scan-target-entry {
  min-height: 64px !important;
  padding: 9px 12px !important;
  border-radius: 16px !important;
  background: rgba(12, 38, 70, .82) !important;
  border: 1px solid rgba(98, 158, 233, .16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.scan-target-field:focus-within .scan-target-entry {
  background: rgba(13, 45, 81, .92) !important;
  border-color: rgba(98, 176, 255, .42) !important;
  box-shadow: 0 0 0 3px rgba(55, 129, 244, .10) !important;
}

.scan-target-entry::before,
.scan-target-entry::after {
  display: none !important;
}

.scan-target-field .target-label-icon {
  width: 43px !important;
  height: 43px !important;
  flex-basis: 43px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #2779ef, #24c9bf) !important;
  box-shadow: none !important;
}

.scan-target-field input {
  min-height: 42px !important;
  font-size: 18px !important;
  font-weight: 760 !important;
  color: #f2f6fb !important;
  letter-spacing: -.015em !important;
}

.scan-target-field input::placeholder {
  color: #91a5be !important;
  font-weight: 650 !important;
}

.target-input-hint {
  margin-top: 7px !important;
  color: #788da7 !important;
  font-size: 11px !important;
}

.scan-test-wrap.custom-tool-select,
.selector-wrap:not(.is-hidden) {
  position: relative !important;
  z-index: 6500 !important;
  min-height: 64px !important;
  padding: 9px 11px !important;
  border-radius: 16px !important;
  overflow: visible !important;
  background: rgba(9, 25, 46, .94) !important;
  border: 1px solid rgba(101, 157, 229, .15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.scan-test-wrap.custom-tool-select > label,
.selector-wrap > label {
  margin-bottom: 7px !important;
  color: #899eb7 !important;
}

.custom-tool-select,
.custom-tool-select.is-open {
  position: relative !important;
  z-index: 7000 !important;
  overflow: visible !important;
}

.tool-select-button {
  min-height: 44px !important;
  border-radius: 13px !important;
  background: rgba(12, 36, 65, .90) !important;
  border: 1px solid rgba(101, 157, 229, .14) !important;
  box-shadow: none !important;
}

.tool-select-button:hover {
  background: rgba(14, 43, 77, .96) !important;
  border-color: rgba(111, 174, 246, .28) !important;
}

.tool-select-button-copy strong {
  color: #edf4fc !important;
}

.tool-select-button-copy small {
  color: #8098b3 !important;
}

.tool-select-dropdown {
  position: absolute !important;
  left: 0 !important;
  top: calc(100% + 9px) !important;
  width: min(450px, calc(100vw - 40px)) !important;
  z-index: 99999 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  background: #0b203b !important;
  border: 1px solid rgba(102, 161, 235, .24) !important;
  box-shadow: 0 26px 64px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.tool-select-search {
  background: rgba(7, 23, 43, .94) !important;
  border-color: rgba(95, 151, 223, .12) !important;
}

.tool-option {
  border-radius: 12px !important;
}

.tool-select-open .hero,
.tool-select-open .hero-content,
.tool-select-open .scan-bar,
.tool-select-open .custom-tool-select {
  z-index: 8000 !important;
  overflow: visible !important;
}

.feature-strip,
.tool-select-open .feature-strip,
.workspace,
.tool-select-open .workspace {
  position: relative !important;
  z-index: 1 !important;
}

.scan-submit {
  min-height: 64px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #277cf3 0%, #145bd9 100%) !important;
  border: 1px solid rgba(121, 174, 244, .12) !important;
  box-shadow: 0 14px 28px rgba(9, 83, 198, .26), inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.scan-submit::before,
.scan-submit::after {
  display: none !important;
}

.scan-submit:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 18px 32px rgba(9, 83, 198, .32), inset 0 1px 0 rgba(255,255,255,.14) !important;
}

.scan-examples {
  margin-top: 10px !important;
}

.scan-examples button {
  background: rgba(12, 34, 61, .74) !important;
  border: 1px solid rgba(98, 150, 219, .13) !important;
  color: #b9cbe0 !important;
}

.hero-trust {
  margin-top: 15px !important;
  color: #c3d1e1 !important;
}

.scan-consent {
  margin-top: 8px !important;
  color: #788ba4 !important;
}

.hero-visual {
  opacity: .48 !important;
  transform: translateY(-45%) scale(.78) !important;
  filter: none !important;
}

.feature-strip {
  margin-top: 8px !important;
}

@media (max-width: 920px) {
  .hero {
    min-height: auto !important;
    padding: 28px 18px 30px !important;
  }

  .scan-bar {
    grid-template-columns: 50px minmax(0, 1fr) !important;
  }

  .scan-test-wrap.custom-tool-select,
  .selector-wrap:not(.is-hidden),
  .scan-submit {
    grid-column: 1 / -1 !important;
  }

  .scan-target-field {
    grid-column: 2 !important;
  }
}

@media (max-width: 560px) {
  .hero {
    padding: 24px 12px 26px !important;
  }

  .scan-bar {
    grid-template-columns: 1fr !important;
    padding: 11px !important;
  }

  .scan-tool-icon,
  .scan-target-field,
  .scan-test-wrap.custom-tool-select,
  .selector-wrap:not(.is-hidden),
  .scan-submit {
    grid-column: auto !important;
  }

  .tool-select-dropdown {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: auto !important;
    bottom: 12px !important;
    width: auto !important;
    z-index: 99999 !important;
  }
}

:root[data-theme="light"] .hero {
  background:
    radial-gradient(circle at 78% 18%, rgba(62, 136, 255, .09), transparent 24%),
    radial-gradient(circle at 86% 56%, rgba(35, 209, 200, .06), transparent 20%),
    linear-gradient(135deg, #fbfdff 0%, #f1f6fc 48%, #edf4fb 100%) !important;
  border-bottom-color: rgba(49, 119, 223, .10) !important;
}

:root[data-theme="light"] .eyebrow {
  background: rgba(255,255,255,.84) !important;
  border-color: rgba(49, 119, 223, .12) !important;
  color: #18436c !important;
}

:root[data-theme="light"] .hero h1 {
  color: #10253e !important;
}

:root[data-theme="light"] .hero > .hero-content > p,
:root[data-theme="light"] .hero p {
  color: #5d728a !important;
}

:root[data-theme="light"] .scan-bar {
  background: rgba(255,255,255,.91) !important;
  border-color: rgba(49, 119, 223, .14) !important;
  box-shadow: 0 16px 36px rgba(23,45,68,.09), inset 0 1px 0 rgba(255,255,255,.9) !important;
}

:root[data-theme="light"] .scan-target-entry {
  background: #f7fbff !important;
  border-color: rgba(49, 119, 223, .13) !important;
}

:root[data-theme="light"] .scan-target-field input {
  color: #112b45 !important;
}

:root[data-theme="light"] .scan-target-field input::placeholder {
  color: #70879f !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select,
:root[data-theme="light"] .selector-wrap:not(.is-hidden) {
  background: rgba(255,255,255,.90) !important;
  border-color: rgba(49, 119, 223, .12) !important;
}

:root[data-theme="light"] .tool-select-button {
  background: #f7fbff !important;
  border-color: rgba(49, 119, 223, .12) !important;
}

:root[data-theme="light"] .tool-select-button-copy strong {
  color: #173450 !important;
}

:root[data-theme="light"] .tool-select-button-copy small {
  color: #6d8298 !important;
}

:root[data-theme="light"] .tool-select-dropdown {
  background: #ffffff !important;
  border-color: rgba(15, 42, 68, .12) !important;
  box-shadow: 0 24px 54px rgba(23,45,68,.15) !important;
}

/* =========================================================
   CYBEROCENA v6.6 — hard fix for "Zakres testu" overlay
   ========================================================= */

/* Główna poprawka: następna sekcja nie może fizycznie nachodzić na obszar hero,
   a dropdown musi mieć własny najwyższy stacking context. */
.hero {
  position: relative !important;
  z-index: 40 !important;
  overflow: visible !important;
  padding-bottom: 170px !important;
}

.hero-content {
  position: relative !important;
  z-index: 60 !important;
}

.scan-bar {
  position: relative !important;
  z-index: 120 !important;
  overflow: visible !important;
}

.scan-test-wrap.custom-tool-select,
.custom-tool-select,
.custom-tool-select.is-open {
  position: relative !important;
  z-index: 400 !important;
  overflow: visible !important;
}

.tool-select-dropdown,
.custom-tool-select.is-open .tool-select-dropdown {
  position: absolute !important;
  left: 0 !important;
  top: calc(100% + 10px) !important;
  z-index: 999999 !important;
  isolation: isolate !important;
  transform: translateZ(0) !important;
  will-change: transform !important;
}

/* Kluczowe: sekcja z kafelkami nie może wchodzić na hero ujemnym marginesem. */
.feature-strip,
.tool-select-open .feature-strip {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 18px !important;
}

.workspace,
.result-section,
.knowledge-section,
.platform-section,
.api-section,
.visitor-intelligence,
.tool-content,
.tool-sidebar {
  position: relative !important;
  z-index: 1 !important;
}

/* Mobilnie dropdown jako overlay nad całą stroną. */
@media (max-width: 760px) {
  .hero {
    padding-bottom: 42px !important;
  }

  .tool-select-dropdown,
  .custom-tool-select.is-open .tool-select-dropdown {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: auto !important;
    bottom: 12px !important;
    width: auto !important;
    z-index: 999999 !important;
  }

  .feature-strip,
  .tool-select-open .feature-strip {
    margin-top: 14px !important;
  }
}

/* =========================================================
   CYBEROCENA v6.7 — final dropdown portal + compact hero
   ========================================================= */

/* Normalny widok pozostaje kompaktowy — bez stałej pustej przestrzeni. */
.hero {
  position: relative !important;
  z-index: 80 !important;
  overflow: visible !important;
  padding-bottom: 36px !important;
}

.hero-content,
.scan-bar,
.scan-test-wrap.custom-tool-select,
.custom-tool-select {
  overflow: visible !important;
}

.hero-content { z-index: 90 !important; }
.scan-bar { z-index: 110 !important; }
.custom-tool-select.is-open { z-index: 130 !important; }

/* Kafelki zaczynają się dopiero pod hero, bez ujemnego nachodzenia. */
.feature-strip,
.tool-select-open .feature-strip {
  position: relative !important;
  z-index: 2 !important;
  margin-top: 14px !important;
}

.workspace,
.result-section,
.knowledge-section,
.platform-section,
.api-section,
.visitor-intelligence {
  position: relative !important;
  z-index: 1 !important;
}

/* Dropdown jest przenoszony przez JS bezpośrednio do body.
   Dzięki position:fixed nie podlega overflow ani stacking context hero. */
.tool-select-dropdown.is-portal {
  position: fixed !important;
  z-index: 2147483000 !important;
  margin: 0 !important;
  transform: none !important;
  isolation: isolate !important;
  overflow: hidden !important;
  animation: toolDropdownPortalIn .18s cubic-bezier(.2,.75,.2,1) both !important;
}

.tool-select-dropdown.is-portal::before {
  display: none !important;
}

.tool-select-dropdown.is-portal .tool-select-options {
  max-height: calc(100% - 66px) !important;
}

/* Delikatne przyciemnienie tła tylko podczas otwarcia listy. */
html.tool-select-open body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 2147482000;
  background: rgba(1, 8, 20, .18);
  backdrop-filter: blur(1.5px);
  pointer-events: none;
}

@keyframes toolDropdownPortalIn {
  from { opacity: 0; transform: translateY(-7px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.tool-select-dropdown.is-portal.opens-up {
  transform-origin: bottom left;
}

@media (max-width: 760px) {
  .hero {
    padding-bottom: 30px !important;
  }

  .feature-strip,
  .tool-select-open .feature-strip {
    margin-top: 12px !important;
  }

  .tool-select-dropdown.is-portal {
    left: 12px !important;
    right: 12px !important;
    top: auto !important;
    bottom: 12px !important;
    width: auto !important;
    max-height: min(72vh, 600px) !important;
    border-radius: 20px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tool-select-dropdown.is-portal {
    animation: none !important;
  }
}

/* v6.7 compact spacing — no permanent gap after closing the picker */
.hero,
.tool-select-open .hero {
  min-height: auto !important;
  padding-top: 30px !important;
  padding-bottom: 32px !important;
}

.hero h1 {
  font-size: clamp(40px, 4.6vw, 66px) !important;
  margin-bottom: 12px !important;
}

.scan-bar {
  margin-top: 20px !important;
}

.scan-consent {
  max-width: 900px !important;
  margin-top: 8px !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}

@media (max-width: 760px) {
  .hero,
  .tool-select-open .hero {
    padding-top: 26px !important;
    padding-bottom: 28px !important;
  }

  .scan-consent {
    font-size: 11px !important;
  }
}

/* =========================================================
   CYBEROCENA v6.8 — dropdown rozwijany w dół, widoczny suwak i CTA
   ========================================================= */

/* Wyłączenie poprzedniej wersji portal/fixed. */
html.tool-select-open body::after {
  display: none !important;
  content: none !important;
}

.hero,
.tool-select-open .hero {
  position: relative !important;
  overflow: visible !important;
  min-height: auto !important;
  padding-bottom: 32px !important;
}

.hero-content,
.scan-bar,
.scan-test-wrap.custom-tool-select {
  overflow: visible !important;
}

/* Dropdown pozostaje wewnątrz pola „Zakres testu” i zajmuje miejsce w układzie. */
.scan-test-wrap.custom-tool-select .tool-select-dropdown,
.scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  max-height: 430px !important;
  margin: 10px 0 0 !important;
  padding: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  z-index: 10 !important;
  overflow: hidden !important;
  transform: none !important;
  animation: toolDropdownDown .18s ease-out both !important;
  border-radius: 15px !important;
  box-sizing: border-box !important;
}

.scan-test-wrap.custom-tool-select .tool-select-dropdown[hidden] {
  display: none !important;
}

.scan-test-wrap.custom-tool-select .tool-select-dropdown::before {
  display: none !important;
  content: none !important;
}

.scan-test-wrap.custom-tool-select.is-open {
  align-content: start !important;
  z-index: 300 !important;
}

/* Pole wyszukiwania jest zawsze widoczne, przewija się wyłącznie lista testów. */
.tool-select-search {
  flex: 0 0 auto !important;
  min-height: 48px !important;
  margin-bottom: 8px !important;
}

.scan-test-wrap.custom-tool-select .tool-select-options {
  display: block !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: 330px !important;
  padding-right: 6px !important;
  overflow-x: hidden !important;
  overflow-y: scroll !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
  scrollbar-width: auto !important;
  scrollbar-color: #4387cf rgba(5, 20, 39, .72) !important;
}

.scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar {
  width: 11px !important;
}

.scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-track {
  background: rgba(5, 20, 39, .72) !important;
  border-radius: 999px !important;
}

.scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-thumb {
  min-height: 46px !important;
  background: linear-gradient(180deg, #4e9bea, #2d6fb2) !important;
  border: 2px solid rgba(5, 20, 39, .72) !important;
  border-radius: 999px !important;
}

.scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #68b1f4, #3c82c7) !important;
}

/* Po otwarciu lista rośnie w dół, a przycisk analizy zostaje u góry po prawej. */
.tool-select-open .scan-bar {
  align-items: start !important;
  overflow: visible !important;
}

.tool-select-open .scan-submit {
  align-self: start !important;
  min-height: 76px !important;
  height: 76px !important;
  z-index: 20 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.feature-strip,
.tool-select-open .feature-strip {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 14px !important;
}

@keyframes toolDropdownDown {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 920px) {
  .scan-test-wrap.custom-tool-select .tool-select-dropdown,
  .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
    max-height: 410px !important;
  }

  .scan-test-wrap.custom-tool-select .tool-select-options {
    max-height: 310px !important;
  }

  .tool-select-open .scan-submit {
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
  }
}

@media (max-width: 560px) {
  .scan-test-wrap.custom-tool-select .tool-select-dropdown,
  .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-height: 390px !important;
    margin-top: 10px !important;
    border-radius: 14px !important;
  }

  .scan-test-wrap.custom-tool-select .tool-select-options {
    max-height: 292px !important;
  }
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select .tool-select-options {
  scrollbar-color: #6e9bca #e6eef6 !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-track {
  background: #e6eef6 !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #81b1df, #5689bb) !important;
  border-color: #e6eef6 !important;
}

/* =========================================================
   CYBEROCENA v6.10 — previous layout + small orange CTA by domain
   ========================================================= */

/* Desktop: icon + long domain field + compact CTA in first row.
   Full-width test selector stays below and expands downward. */
@media (min-width: 761px) {
  .scan-bar {
    display: grid !important;
    grid-template-columns: 54px minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto auto !important;
    align-items: start !important;
    gap: 11px 12px !important;
  }

  .scan-tool-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: start !important;
    margin-top: 7px !important;
  }

  .scan-input-wrap.scan-target-field {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .scan-submit {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: start !important;
    justify-self: end !important;
    width: auto !important;
    min-width: 168px !important;
    max-width: 190px !important;
    min-height: 64px !important;
    height: 64px !important;
    margin-top: 0 !important;
    padding: 0 20px !important;
    border-radius: 16px !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    line-height: 1 !important;
    color: #1d1304 !important;
    background: linear-gradient(135deg, #ffbe35 0%, #ff9418 52%, #f2760b 100%) !important;
    border: 1px solid rgba(255, 211, 114, .52) !important;
    box-shadow:
      0 14px 28px rgba(238, 119, 10, .25),
      inset 0 1px 0 rgba(255,255,255,.38) !important;
    z-index: 40 !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .scan-submit span,
  .scan-submit svg {
    position: relative !important;
    z-index: 2 !important;
  }

  .scan-submit svg {
    width: 18px !important;
    height: 18px !important;
    stroke: #402000 !important;
  }

  .scan-submit:hover {
    transform: translateY(-1px) !important;
    background: linear-gradient(135deg, #ffca4a 0%, #ffa126 52%, #f47d0d 100%) !important;
    box-shadow:
      0 18px 34px rgba(238, 119, 10, .32),
      inset 0 1px 0 rgba(255,255,255,.42) !important;
  }

  .scan-submit:active {
    transform: translateY(0) !important;
  }

  .scan-test-wrap.custom-tool-select {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .selector-wrap:not(.is-hidden) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    width: 100% !important;
  }

  /* The dropdown grows only in the second row; CTA stays beside domain. */
  .tool-select-open .scan-submit {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: start !important;
    width: auto !important;
    min-width: 168px !important;
    height: 64px !important;
    min-height: 64px !important;
  }
}

/* Narrow laptops: keep CTA compact without squeezing the domain. */
@media (min-width: 761px) and (max-width: 980px) {
  .scan-bar {
    grid-template-columns: 50px minmax(0, 1fr) auto !important;
  }

  .scan-submit,
  .tool-select-open .scan-submit {
    min-width: 145px !important;
    max-width: 155px !important;
    padding-inline: 14px !important;
    font-size: 12px !important;
  }
}

/* Phones: keep the previous stacked layout and full-width CTA. */
@media (max-width: 760px) {
  .scan-submit,
  .tool-select-open .scan-submit {
    width: 100% !important;
    max-width: none !important;
    min-height: 58px !important;
    height: 58px !important;
    color: #1d1304 !important;
    background: linear-gradient(135deg, #ffbe35 0%, #ff9418 55%, #f2760b 100%) !important;
    border: 1px solid rgba(255, 211, 114, .48) !important;
    box-shadow: 0 12px 24px rgba(238, 119, 10, .24), inset 0 1px 0 rgba(255,255,255,.36) !important;
  }

  .scan-submit svg {
    stroke: #402000 !important;
  }
}

:root[data-theme="light"] .scan-submit,
:root[data-theme="light"] .tool-select-open .scan-submit {
  color: #321800 !important;
  background: linear-gradient(135deg, #ffc84e 0%, #ff9f25 52%, #f47c12 100%) !important;
  border-color: rgba(207, 111, 12, .24) !important;
  box-shadow: 0 14px 28px rgba(194, 94, 8, .20), inset 0 1px 0 rgba(255,255,255,.5) !important;
}

/* =========================================================
   CYBEROCENA v6.11 — professional PDF report and print layout
   ========================================================= */

.print-report-header,
.print-report-footer {
  display: none;
}

.pdf-download-button {
  gap: 8px !important;
  border-color: rgba(38, 167, 155, .34) !important;
  background: linear-gradient(135deg, rgba(16, 80, 91, .92), rgba(9, 58, 78, .96)) !important;
  color: #effffd !important;
  box-shadow: 0 10px 24px rgba(5, 38, 57, .18), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.pdf-download-button:hover {
  border-color: rgba(59, 211, 191, .52) !important;
  background: linear-gradient(135deg, rgba(18, 103, 109, .98), rgba(10, 72, 94, .98)) !important;
  box-shadow: 0 14px 28px rgba(5, 38, 57, .24), inset 0 1px 0 rgba(255,255,255,.1) !important;
}

.pdf-download-button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pdf-download-button.is-loading {
  cursor: wait;
  opacity: .78;
}

:root[data-theme="light"] .pdf-download-button {
  border-color: rgba(10, 128, 116, .24) !important;
  background: linear-gradient(135deg, #087f76, #096579) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(8, 91, 103, .18) !important;
}

@media print {
  @page {
    size: A4 portrait;
    margin: 12mm 11mm 18mm;
  }

  *,
  *::before,
  *::after {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    box-shadow: none !important;
    text-shadow: none !important;
    animation: none !important;
    transition: none !important;
  }

  html,
  body {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    color: #14273a !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 9.5pt !important;
  }

  body > header,
  body > footer,
  main > section:not(#resultSection),
  .result-toolbar,
  .result-actions,
  .scan-progress,
  .finding-filters,
  .filtered-empty,
  .modal,
  .toast,
  .floating-action,
  .chat-widget {
    display: none !important;
  }

  main,
  #resultSection,
  .result-section,
  #resultOutput {
    display: block !important;
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    overflow: visible !important;
  }

  .print-report-header {
    display: block !important;
    position: relative !important;
    margin: 0 0 8mm !important;
    padding: 8mm 9mm 7mm !important;
    color: #fff !important;
    background:
      radial-gradient(circle at 88% 0%, rgba(46, 205, 190, .22), transparent 32%),
      linear-gradient(135deg, #071224 0%, #0b2747 100%) !important;
    border-bottom: 1.2mm solid #18b89d !important;
    border-radius: 3mm !important;
    break-inside: avoid;
  }

  .print-report-brand {
    display: flex !important;
    align-items: center !important;
    gap: 3mm !important;
  }

  .print-report-mark {
    display: grid !important;
    place-items: center !important;
    width: 10mm !important;
    height: 10mm !important;
    border-radius: 2.5mm !important;
    background: linear-gradient(135deg, #2581f3, #1bc7b1) !important;
    color: #fff !important;
    font-size: 16pt !important;
    font-weight: 900 !important;
  }

  .print-report-brand > div {
    display: grid !important;
    gap: .4mm !important;
  }

  .print-report-brand strong {
    color: #fff !important;
    font-size: 11pt !important;
    letter-spacing: .12em !important;
  }

  .print-report-brand small {
    color: #8fc8e3 !important;
    font-size: 6.5pt !important;
    letter-spacing: .16em !important;
  }

  .print-report-brand > b {
    margin-left: auto !important;
    padding: 2mm 3mm !important;
    border: .3mm solid rgba(255,255,255,.22) !important;
    border-radius: 999px !important;
    color: #c9e7f4 !important;
    font-size: 6.5pt !important;
    letter-spacing: .1em !important;
  }

  .print-report-heading {
    margin-top: 8mm !important;
  }

  .print-report-heading > span {
    display: block !important;
    margin-bottom: 2mm !important;
    color: #7fe1d0 !important;
    font-size: 7pt !important;
    font-weight: 800 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
  }

  .print-report-heading h1 {
    margin: 0 !important;
    color: #fff !important;
    font-size: 23pt !important;
    line-height: 1.05 !important;
    letter-spacing: -.025em !important;
    overflow-wrap: anywhere !important;
  }

  .print-report-heading p {
    max-width: 135mm !important;
    margin: 2.5mm 0 0 !important;
    color: #bbcee1 !important;
    font-size: 8.5pt !important;
    line-height: 1.5 !important;
  }

  .print-report-meta {
    display: grid !important;
    grid-template-columns: 1.45fr 1fr .75fr !important;
    gap: 3mm !important;
    margin-top: 7mm !important;
  }

  .print-report-meta > span {
    display: grid !important;
    gap: 1mm !important;
    min-width: 0 !important;
    padding: 3mm !important;
    border: .25mm solid rgba(255,255,255,.14) !important;
    border-radius: 2mm !important;
    background: rgba(255,255,255,.055) !important;
  }

  .print-report-meta small {
    color: #8faac5 !important;
    font-size: 6.2pt !important;
    font-weight: 800 !important;
    letter-spacing: .09em !important;
    text-transform: uppercase !important;
  }

  .print-report-meta strong {
    color: #f5f9ff !important;
    font-size: 8.2pt !important;
    overflow-wrap: anywhere !important;
  }

  .result-hero {
    display: grid !important;
    grid-template-columns: 1fr 1.45fr !important;
    gap: 4mm !important;
    margin: 0 0 6mm !important;
    break-inside: avoid !important;
  }

  .score-card {
    display: flex !important;
    align-items: center !important;
    gap: 4mm !important;
    min-height: 40mm !important;
    padding: 5mm !important;
    border: .3mm solid #dce6ef !important;
    border-radius: 3mm !important;
    background: linear-gradient(145deg, #f6faff, #edf6fb) !important;
  }

  .score-ring {
    width: 29mm !important;
    height: 29mm !important;
    flex: 0 0 29mm !important;
  }

  .score-ring svg {
    width: 100% !important;
    height: 100% !important;
  }

  .score-track {
    stroke: #dbe6ef !important;
  }

  .score-value {
    stroke: #18a98f !important;
  }

  .score-ring div strong {
    color: #10283f !important;
    font-size: 18pt !important;
  }

  .score-ring div span {
    color: #6a8094 !important;
    font-size: 7pt !important;
  }

  .score-copy h3 {
    margin: 2mm 0 1mm !important;
    color: #10283f !important;
    font-size: 11pt !important;
    overflow-wrap: anywhere !important;
  }

  .score-copy p {
    margin: 0 !important;
    color: #637a91 !important;
    font-size: 7.5pt !important;
  }

  .grade {
    padding: 1.2mm 2.5mm !important;
    border-radius: 999px !important;
    background: #dff6f1 !important;
    color: #087963 !important;
    font-size: 8pt !important;
  }

  .summary-cards {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 3mm !important;
  }

  .summary-card {
    display: grid !important;
    grid-template-columns: 9mm minmax(0, 1fr) !important;
    align-items: center !important;
    min-height: 18mm !important;
    padding: 3mm !important;
    text-align: left !important;
    border: .3mm solid #dce6ef !important;
    border-radius: 2.5mm !important;
    background: #fff !important;
  }

  .summary-card .summary-arrow {
    display: none !important;
  }

  .summary-card .status-icon {
    width: 8mm !important;
    height: 8mm !important;
  }

  .summary-card strong {
    color: #10283f !important;
    font-size: 12pt !important;
  }

  .summary-card span,
  .summary-card small {
    color: #637a91 !important;
    font-size: 6.8pt !important;
  }

  .module-strip {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    margin: 0 0 6mm !important;
    border: .3mm solid #dce6ef !important;
    border-radius: 2.5mm !important;
    overflow: hidden !important;
    break-inside: avoid !important;
  }

  .module-score {
    min-height: 18mm !important;
    padding: 3mm !important;
    border: 0 !important;
    border-right: .2mm solid #dce6ef !important;
    background: #f7fafc !important;
  }

  .module-score:last-child {
    border-right: 0 !important;
  }

  .module-score span,
  .module-score em {
    color: #6a8094 !important;
    font-size: 6.5pt !important;
  }

  .module-score strong {
    color: #16344f !important;
    font-size: 12pt !important;
  }

  .vulnerability-section,
  .cve-card,
  .cve-panel {
    break-inside: avoid !important;
  }

  .finding-toolbar {
    margin: 8mm 0 4mm !important;
    padding: 0 0 3mm !important;
    border-bottom: .7mm solid #153b5d !important;
    break-after: avoid !important;
  }

  .finding-toolbar h3 {
    margin: 0 !important;
    color: #10283f !important;
    font-size: 15pt !important;
  }

  .finding-toolbar p {
    margin: 1mm 0 0 !important;
    color: #637a91 !important;
    font-size: 7.5pt !important;
  }

  .finding-list {
    display: block !important;
  }

  .finding,
  .finding.is-hidden {
    display: block !important;
    margin: 0 0 4mm !important;
    border: .3mm solid #dce6ef !important;
    border-left-width: 1.2mm !important;
    border-radius: 2.5mm !important;
    background: #fff !important;
    overflow: hidden !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }

  .finding[data-status="bad"] { border-left-color: #d74358 !important; }
  .finding[data-status="warn"] { border-left-color: #e6942f !important; }
  .finding[data-status="good"] { border-left-color: #18a98f !important; }
  .finding[data-status="info"] { border-left-color: #2874d8 !important; }

  .finding-summary {
    display: grid !important;
    grid-template-columns: 9mm minmax(0, 1fr) auto !important;
    gap: 3mm !important;
    align-items: start !important;
    width: 100% !important;
    padding: 4mm !important;
    border: 0 !important;
    background: #f7fafc !important;
    color: #10283f !important;
    text-align: left !important;
  }

  .finding-summary .status-icon {
    width: 8mm !important;
    height: 8mm !important;
  }

  .finding-main small {
    color: #6a8094 !important;
    font-size: 6.2pt !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
  }

  .finding-main strong {
    display: block !important;
    margin-top: 1mm !important;
    color: #10283f !important;
    font-size: 9.2pt !important;
    line-height: 1.25 !important;
  }

  .finding-main p {
    display: block !important;
    margin: 1.5mm 0 0 !important;
    color: #536b82 !important;
    font-size: 7.4pt !important;
    line-height: 1.42 !important;
    white-space: normal !important;
    overflow: visible !important;
  }

  .severity {
    align-self: start !important;
    padding: 1.3mm 2.2mm !important;
    border-radius: 999px !important;
    font-size: 6.2pt !important;
    white-space: nowrap !important;
  }

  .chevron {
    display: none !important;
  }

  .finding-details,
  .finding-details.is-open {
    display: block !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
  }

  .detail-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 3mm !important;
    padding: 4mm !important;
    background: #fff !important;
  }

  .detail-grid > div {
    min-width: 0 !important;
    padding: 3mm !important;
    border: .25mm solid #e1e9f0 !important;
    border-radius: 2mm !important;
    background: #fafcfe !important;
  }

  .detail-grid > div > span {
    display: block !important;
    margin-bottom: 2mm !important;
    color: #537088 !important;
    font-size: 6.3pt !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
  }

  .detail-grid p,
  .detail-grid pre,
  .finding-resource-link b,
  .finding-resource-link small {
    margin: 0 !important;
    color: #243f58 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 7pt !important;
    line-height: 1.45 !important;
    white-space: pre-wrap !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  .finding-resource-link {
    margin-top: 2mm !important;
  }

  .finding-resource-link a {
    display: block !important;
    color: #1767bb !important;
    text-decoration: none !important;
  }

  .finding-resource-link em {
    display: none !important;
  }

  .report-disclaimer {
    display: block !important;
    margin: 7mm 0 0 !important;
    padding: 4mm !important;
    border: .3mm solid #dce6ef !important;
    border-left: 1.2mm solid #2874d8 !important;
    border-radius: 2mm !important;
    background: #f3f7fb !important;
    break-inside: avoid !important;
  }

  .report-disclaimer strong {
    display: block !important;
    margin-bottom: 1.5mm !important;
    color: #17436a !important;
    font-size: 7pt !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
  }

  .report-disclaimer p {
    margin: 0 !important;
    color: #5c7389 !important;
    font-size: 7pt !important;
    line-height: 1.45 !important;
  }

  .print-report-footer {
    display: flex !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: -12mm !important;
    justify-content: space-between !important;
    padding-top: 2.5mm !important;
    border-top: .25mm solid #d8e2eb !important;
    color: #687f94 !important;
    font-size: 6.2pt !important;
    letter-spacing: .05em !important;
  }
}

/* =========================================================
   CYBEROCENA v6.12 — modern aligned CTA + safe-use footer
   ========================================================= */

/* Modern compact CTA aligned with the domain field on desktop. */
@media (min-width: 761px) {
  .scan-bar {
    grid-template-columns: 54px minmax(0, 1fr) 176px !important;
    column-gap: 12px !important;
    align-items: start !important;
  }

  .scan-tool-icon {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    margin-top: 7px !important;
  }

  .scan-target-entry {
    min-height: 68px !important;
    height: 68px !important;
  }

  .scan-submit,
  .tool-select-open .scan-submit {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: start !important;
    justify-self: stretch !important;
    width: 176px !important;
    min-width: 176px !important;
    max-width: 176px !important;
    min-height: 68px !important;
    height: 68px !important;
    margin: 0 !important;
    padding: 9px 10px 9px 17px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    border-radius: 18px !important;
    color: #211303 !important;
    background:
      radial-gradient(circle at 18% 0%, rgba(255,255,255,.42), transparent 34%),
      linear-gradient(135deg, #ffd164 0%, #ffad32 42%, #ff7b2f 100%) !important;
    border: 1px solid rgba(255, 216, 132, .62) !important;
    box-shadow:
      0 15px 30px rgba(230, 105, 26, .25),
      inset 0 1px 0 rgba(255,255,255,.62),
      inset 0 -1px 0 rgba(155, 64, 5, .12) !important;
    overflow: hidden !important;
    isolation: isolate !important;
  }

  .scan-submit::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: -1 !important;
    background: linear-gradient(110deg, transparent 12%, rgba(255,255,255,.24) 42%, transparent 68%) !important;
    transform: translateX(-120%) !important;
    transition: transform .55s ease !important;
    pointer-events: none !important;
  }

  .scan-submit::after {
    display: none !important;
  }

  .scan-submit:hover {
    transform: translateY(-2px) !important;
    color: #1d1002 !important;
    background:
      radial-gradient(circle at 18% 0%, rgba(255,255,255,.5), transparent 36%),
      linear-gradient(135deg, #ffdb78 0%, #ffb33c 42%, #ff8235 100%) !important;
    box-shadow:
      0 20px 38px rgba(230, 105, 26, .34),
      inset 0 1px 0 rgba(255,255,255,.7),
      inset 0 -1px 0 rgba(155, 64, 5, .12) !important;
  }

  .scan-submit:hover::before {
    transform: translateX(120%) !important;
  }

  .scan-submit:active {
    transform: translateY(0) scale(.985) !important;
  }
}

.scan-submit-copy {
  position: relative !important;
  z-index: 2 !important;
  min-width: 0;
  display: grid !important;
  gap: 4px !important;
  text-align: left !important;
  line-height: 1 !important;
}

.scan-submit-copy strong {
  color: inherit !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: -.015em !important;
}

.scan-submit-copy small {
  color: rgba(51, 28, 5, .72) !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
}

.scan-submit-icon {
  position: relative !important;
  z-index: 2 !important;
  width: 36px !important;
  height: 36px !important;
  flex: 0 0 36px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 12px !important;
  color: #fff !important;
  background: rgba(54, 26, 2, .88) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 7px 14px rgba(84, 38, 2, .18) !important;
  transition: transform .2s ease, background .2s ease !important;
}

.scan-submit-icon svg {
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.scan-submit:hover .scan-submit-icon {
  transform: translateX(2px) !important;
  background: #251202 !important;
}

.scan-submit:focus-visible {
  outline: 3px solid rgba(255, 190, 73, .42) !important;
  outline-offset: 3px !important;
}

@media (min-width: 761px) and (max-width: 980px) {
  .scan-bar {
    grid-template-columns: 50px minmax(0, 1fr) 154px !important;
  }

  .scan-submit,
  .tool-select-open .scan-submit {
    width: 154px !important;
    min-width: 154px !important;
    max-width: 154px !important;
    padding-left: 14px !important;
  }

  .scan-submit-copy strong {
    font-size: 14px !important;
  }

  .scan-submit-copy small {
    font-size: 8px !important;
  }

  .scan-submit-icon {
    width: 34px !important;
    height: 34px !important;
    flex-basis: 34px !important;
  }
}

@media (max-width: 760px) {
  .scan-submit,
  .tool-select-open .scan-submit {
    min-height: 60px !important;
    height: 60px !important;
    padding: 9px 11px 9px 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    border-radius: 17px !important;
    color: #211303 !important;
    background: linear-gradient(135deg, #ffd164 0%, #ffad32 44%, #ff7b2f 100%) !important;
    border: 1px solid rgba(255, 216, 132, .58) !important;
    box-shadow: 0 13px 26px rgba(230, 105, 26, .24), inset 0 1px 0 rgba(255,255,255,.58) !important;
  }

  .scan-submit-copy {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
  }

  .scan-submit-copy strong {
    font-size: 15px !important;
  }

  .scan-submit-copy small {
    font-size: 9px !important;
  }
}

:root[data-theme="light"] .scan-submit,
:root[data-theme="light"] .tool-select-open .scan-submit {
  color: #251503 !important;
  border-color: rgba(194, 97, 15, .24) !important;
  box-shadow: 0 15px 30px rgba(194, 94, 8, .20), inset 0 1px 0 rgba(255,255,255,.68) !important;
}

/* Footer with visible safe-use policy. */
.footer.footer-safe {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 38px max(24px, calc((100vw - var(--max)) / 2)) 24px !important;
  display: grid !important;
  grid-template-columns: minmax(220px, .72fr) minmax(420px, 1.55fr) !important;
  grid-template-areas:
    "brand safety"
    "meta meta" !important;
  align-items: stretch !important;
  gap: 20px 28px !important;
  color: #dce9fa !important;
  background:
    radial-gradient(circle at 76% 12%, rgba(27, 171, 190, .09), transparent 24%),
    linear-gradient(135deg, #041024 0%, #061a35 58%, #071a31 100%) !important;
  border-top: 1px solid rgba(88, 151, 227, .18) !important;
}

.footer-brand-block {
  grid-area: brand;
  min-width: 0;
  padding: 20px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 13px;
}

.footer.footer-safe .footer-brand {
  color: inherit;
  text-decoration: none;
}

.footer.footer-safe .footer-brand strong {
  color: #f5f9ff !important;
}

.footer.footer-safe .footer-brand small {
  color: #8098b6 !important;
}

.footer-brand-block > p {
  max-width: 310px !important;
  margin: 0 !important;
  color: #8ea5c1 !important;
  font-size: 12px !important;
  line-height: 1.6 !important;
}

.footer-safety {
  grid-area: safety;
  min-width: 0;
  padding: 21px 22px;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(10, 41, 70, .88), rgba(7, 30, 53, .84));
  border: 1px solid rgba(79, 173, 191, .20);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 16px 34px rgba(1, 7, 19, .18);
}

.footer-safety-icon {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  color: #d8fff8;
  background: linear-gradient(135deg, rgba(26, 183, 172, .28), rgba(39, 114, 230, .26));
  border: 1px solid rgba(92, 206, 194, .20);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.footer-safety-icon svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.footer-safety > div {
  min-width: 0;
}

.footer-safety strong {
  display: block;
  margin-bottom: 6px;
  color: #f1f8ff;
  font-size: 14px;
  letter-spacing: -.01em;
}

.footer.footer-safe .footer-safety p {
  max-width: none !important;
  margin: 0 !important;
  color: #a4b8cf !important;
  font-size: 11px !important;
  line-height: 1.62 !important;
}

.footer-policy-link {
  min-width: max-content;
  padding: 10px 13px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 12px;
  color: #dffbf7;
  background: rgba(20, 164, 153, .12);
  border: 1px solid rgba(64, 199, 186, .20);
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.footer-policy-link:hover {
  transform: translateY(-1px);
  color: #fff;
  background: rgba(20, 164, 153, .20);
  border-color: rgba(83, 220, 206, .36);
}

.footer-meta {
  grid-area: meta;
  padding-top: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid rgba(104, 151, 210, .13);
}

.footer.footer-safe .footer-meta p {
  max-width: 920px !important;
  margin: 0 !important;
  color: #748ca9 !important;
  font-size: 10px !important;
  line-height: 1.55 !important;
}

.footer-meta > span {
  min-width: max-content;
  color: #748ca9 !important;
  font-size: 10px !important;
}

.scan-consent a {
  color: #8ec9ff;
  text-underline-offset: 3px;
}

.scan-consent a:hover {
  color: #c4e4ff;
}

/* Dedicated safe-use policy page. */
.safe-use-page {
  width: min(var(--max), calc(100% - 48px));
  margin: 0 auto;
  padding: 56px 0 70px;
}

.safe-use-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(30px, 5vw, 58px);
  border-radius: 28px;
  background:
    radial-gradient(circle at 86% 12%, rgba(36, 201, 190, .15), transparent 24%),
    radial-gradient(circle at 14% 88%, rgba(52, 123, 239, .14), transparent 28%),
    linear-gradient(135deg, rgba(8, 31, 59, .98), rgba(5, 21, 43, .98));
  border: 1px solid rgba(82, 150, 228, .18);
  box-shadow: 0 22px 52px rgba(2, 9, 23, .22), inset 0 1px 0 rgba(255,255,255,.04);
}

.safe-use-hero h1 {
  max-width: 850px;
  margin: 13px 0 17px;
  font-size: clamp(36px, 5.2vw, 68px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.safe-use-hero > p {
  max-width: 790px;
  margin: 0;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.7;
}

.safe-use-notice {
  max-width: 820px;
  margin-top: 28px;
  padding: 17px 19px;
  display: flex;
  align-items: center;
  gap: 13px;
  border-radius: 16px;
  color: #ffe8b4;
  background: rgba(255, 170, 45, .09);
  border: 1px solid rgba(255, 183, 68, .20);
}

.safe-use-notice strong {
  min-width: max-content;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.safe-use-notice span {
  color: #c8d5e5;
  font-size: 13px;
  line-height: 1.55;
}

.safe-use-grid {
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.safe-use-grid article {
  position: relative;
  padding: 25px 25px 25px 76px;
  border-radius: 20px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 94%, transparent), color-mix(in srgb, var(--surface-2) 92%, transparent));
  border: 1px solid var(--line);
  box-shadow: 0 13px 30px rgba(2, 9, 23, .12);
}

.safe-use-grid article > span {
  position: absolute;
  left: 23px;
  top: 24px;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #bceef0;
  background: rgba(27, 169, 166, .13);
  border: 1px solid rgba(50, 194, 188, .18);
  font-size: 11px;
  font-weight: 900;
}

.safe-use-grid h2 {
  margin: 0 0 9px;
  font-size: 18px;
  letter-spacing: -.02em;
}

.safe-use-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.68;
}

.safe-use-summary {
  margin-top: 24px;
  padding: 22px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(13, 67, 71, .56), rgba(9, 40, 66, .72));
  border: 1px solid rgba(60, 190, 178, .18);
}

.safe-use-summary > div {
  display: flex;
  align-items: center;
  gap: 15px;
}

.safe-use-summary-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: #dffff9;
  background: rgba(25, 184, 168, .18);
  border: 1px solid rgba(70, 215, 200, .20);
  font-weight: 900;
}

.safe-use-summary strong {
  display: block;
  margin-bottom: 4px;
}

.safe-use-summary p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

@media (max-width: 900px) {
  .footer.footer-safe {
    grid-template-columns: 1fr !important;
    grid-template-areas: "brand" "safety" "meta" !important;
  }

  .footer-brand-block {
    padding-bottom: 0;
  }

  .footer-safety {
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .footer-policy-link {
    grid-column: 2;
    justify-self: start;
  }

  .safe-use-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .footer.footer-safe {
    padding: 30px 16px 21px !important;
  }

  .footer-safety {
    padding: 18px;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 13px;
  }

  .footer-safety-icon {
    width: 40px;
    height: 40px;
    border-radius: 13px;
  }

  .footer-policy-link {
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
  }

  .footer-meta {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .safe-use-page {
    width: calc(100% - 24px);
    padding: 24px 0 42px;
  }

  .safe-use-hero {
    padding: 27px 20px;
    border-radius: 22px;
  }

  .safe-use-hero > p {
    font-size: 15px;
  }

  .safe-use-notice {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .safe-use-grid article {
    padding: 67px 20px 22px;
  }

  .safe-use-grid article > span {
    left: 20px;
    top: 20px;
  }

  .safe-use-summary {
    align-items: stretch;
    flex-direction: column;
  }
}

:root[data-theme="light"] .footer.footer-safe {
  color: #17334f !important;
  background:
    radial-gradient(circle at 76% 12%, rgba(27, 171, 190, .07), transparent 24%),
    linear-gradient(135deg, #f8fbff 0%, #eef5fb 58%, #edf7f7 100%) !important;
  border-top-color: rgba(15, 42, 68, .12) !important;
}

:root[data-theme="light"] .footer.footer-safe .footer-brand strong {
  color: #0c2034 !important;
}

:root[data-theme="light"] .footer.footer-safe .footer-brand small,
:root[data-theme="light"] .footer-brand-block > p,
:root[data-theme="light"] .footer.footer-safe .footer-meta p,
:root[data-theme="light"] .footer-meta > span {
  color: #617990 !important;
}

:root[data-theme="light"] .footer-safety {
  background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(239,249,249,.92));
  border-color: rgba(24, 142, 139, .16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 14px 32px rgba(23,45,68,.08);
}

:root[data-theme="light"] .footer-safety strong {
  color: #12314c;
}

:root[data-theme="light"] .footer.footer-safe .footer-safety p {
  color: #587089 !important;
}

:root[data-theme="light"] .footer-policy-link {
  color: #126e69;
  background: rgba(23, 154, 145, .08);
  border-color: rgba(23, 154, 145, .16);
}

:root[data-theme="light"] .footer-meta {
  border-top-color: rgba(15, 42, 68, .10);
}

:root[data-theme="light"] .safe-use-hero {
  background:
    radial-gradient(circle at 86% 12%, rgba(36, 201, 190, .10), transparent 24%),
    radial-gradient(circle at 14% 88%, rgba(52, 123, 239, .08), transparent 28%),
    linear-gradient(135deg, #ffffff, #eef6fb);
  border-color: rgba(15, 42, 68, .12);
  box-shadow: 0 20px 46px rgba(23,45,68,.09), inset 0 1px 0 rgba(255,255,255,.9);
}

:root[data-theme="light"] .safe-use-notice {
  color: #8c4b08;
  background: rgba(255, 170, 45, .10);
  border-color: rgba(222, 128, 17, .16);
}

:root[data-theme="light"] .safe-use-notice span {
  color: #506b85;
}

:root[data-theme="light"] .safe-use-grid article {
  background: #fff;
  border-color: rgba(15, 42, 68, .11);
  box-shadow: 0 12px 30px rgba(23,45,68,.07);
}

:root[data-theme="light"] .safe-use-summary {
  background: linear-gradient(135deg, rgba(225, 250, 246, .95), rgba(233, 244, 255, .95));
  border-color: rgba(24, 142, 139, .15);
}

/* =========================================================
   CYBEROCENA v6.14 — full-width domain field up to CTA
   ========================================================= */

@media (min-width: 761px) {
  /* Two clean columns: the domain field and the CTA. */
  .scan-bar {
    grid-template-columns: minmax(0, 1fr) 176px !important;
    grid-template-rows: auto auto auto !important;
    column-gap: 12px !important;
    row-gap: 11px !important;
    align-items: start !important;
  }

  /* The globe is already inside the input, so the extra icon only shortened it. */
  .scan-bar > .scan-tool-icon,
  .scan-tool-icon {
    display: none !important;
  }

  .scan-input-wrap.scan-target-field {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    justify-self: stretch !important;
  }

  .scan-target-entry {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .scan-target-field input,
  #targetInput {
    display: block !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  .scan-submit,
  .tool-select-open .scan-submit {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 176px !important;
    min-width: 176px !important;
    max-width: 176px !important;
    height: 68px !important;
    min-height: 68px !important;
    margin: 0 !important;
    align-self: start !important;
    justify-self: stretch !important;
  }

  .scan-test-wrap.custom-tool-select {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
  }

  .selector-wrap:not(.is-hidden) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    width: 100% !important;
  }
}

@media (min-width: 761px) and (max-width: 980px) {
  .scan-bar {
    grid-template-columns: minmax(0, 1fr) 154px !important;
  }

  .scan-submit,
  .tool-select-open .scan-submit {
    width: 154px !important;
    min-width: 154px !important;
    max-width: 154px !important;
  }
}

/* =========================================================
   CYBEROCENA v6.15 — UX/SEO hero typography
   ========================================================= */

.hero h1,
#hero-title {
  display: grid !important;
  gap: 2px !important;
  width: min(880px, 100%) !important;
  max-width: 880px !important;
  margin: 0 auto 16px !important;
  font-size: clamp(38px, 4.35vw, 62px) !important;
  line-height: 1.01 !important;
  letter-spacing: -.048em !important;
  text-align: center !important;
  text-wrap: balance;
}

.hero-title-primary,
.hero-title-secondary {
  display: block;
}

.hero-title-primary {
  color: #f5f9ff !important;
}

.hero-title-secondary {
  color: #77b8ff !important;
}

.hero-title-secondary > span {
  color: inherit !important;
}

.hero-title-secondary em {
  display: inline !important;
  margin-left: .12em;
  font-style: normal !important;
  background: linear-gradient(90deg, #70c8ff 0%, #42e5d5 60%, #a9fff3 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

.hero > .hero-content > p {
  max-width: 790px !important;
  margin-bottom: 0 !important;
  font-size: clamp(15px, 1.1vw, 17px) !important;
  line-height: 1.62 !important;
  text-wrap: pretty;
}

@media (max-width: 900px) {
  .hero h1,
  #hero-title {
    font-size: clamp(34px, 7vw, 50px) !important;
    letter-spacing: -.042em !important;
  }
}

@media (max-width: 560px) {
  .hero h1,
  #hero-title {
    gap: 0 !important;
    font-size: clamp(31px, 10vw, 40px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.038em !important;
  }

  .hero-title-secondary em {
    margin-left: .08em;
  }

  .hero > .hero-content > p {
    font-size: 15px !important;
    line-height: 1.55 !important;
  }
}

:root[data-theme="light"] .hero-title-primary {
  color: #0d2340 !important;
}

:root[data-theme="light"] .hero-title-secondary {
  color: #2e79d1 !important;
}

/* =========================================================
   CYBEROCENA v6.16 — full domain row + security policy
   ========================================================= */

@media (min-width: 761px) {
  /* The first row is exactly: flexible domain field + compact CTA. */
  .hero .scan-bar {
    width: min(1080px, 100%) !important;
    max-width: 1080px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 164px !important;
    grid-template-rows: auto auto auto !important;
    column-gap: 10px !important;
    row-gap: 11px !important;
    align-items: start !important;
  }

  .hero .scan-bar > .scan-tool-icon {
    display: none !important;
  }

  .hero .scan-input-wrap.scan-target-field {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    justify-self: stretch !important;
  }

  .hero .scan-target-entry {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 68px !important;
    min-height: 68px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .hero .scan-target-entry > input,
  .hero #targetInput {
    flex: 1 1 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .hero .scan-submit,
  .tool-select-open .hero .scan-submit {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 164px !important;
    min-width: 164px !important;
    max-width: 164px !important;
    height: 68px !important;
    min-height: 68px !important;
    margin: 0 !important;
    align-self: start !important;
    justify-self: stretch !important;
  }

  .hero .scan-test-wrap.custom-tool-select {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .hero .selector-wrap:not(.is-hidden) {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    width: 100% !important;
  }
}

@media (min-width: 761px) and (max-width: 980px) {
  .hero .scan-bar {
    grid-template-columns: minmax(0, 1fr) 150px !important;
  }

  .hero .scan-submit,
  .tool-select-open .hero .scan-submit {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
  }
}

/* Stronger policy link below the scanner without competing with the CTA. */
.scan-consent {
  max-width: 940px !important;
}

.scan-consent a {
  font-weight: 750 !important;
  text-decoration-thickness: 1px !important;
}

.footer-safety strong {
  font-size: 15px !important;
}

.footer-policy-link {
  text-align: center;
}

/* =========================================================
   CYBEROCENA v6.17 — stable range scrolling + highlighted groups
   ========================================================= */

/* Keep both key form sections visually distinct without changing their size. */
.hero .scan-target-entry {
  border-left: 3px solid #4a9dff !important;
}

.hero .scan-test-wrap.custom-tool-select {
  border-left: 3px solid #2dd7c5 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 10px 24px rgba(3,10,22,.12),
    0 0 0 1px rgba(45,215,197,.035) !important;
}

.hero .scan-test-wrap.custom-tool-select > label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #b5c8df !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .11em !important;
}

.hero .scan-test-wrap.custom-tool-select > label::before {
  content: "02";
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 20px;
  border-radius: 7px;
  background: rgba(45,215,197,.13);
  border: 1px solid rgba(45,215,197,.22);
  color: #76eee1;
  font-size: 8px;
  letter-spacing: .05em;
}

/* The dropdown stays in document flow and expands only downward. */
.hero .scan-test-wrap.custom-tool-select .tool-select-dropdown,
.hero .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  margin: 10px 0 0 !important;
  padding: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  z-index: 50 !important;
  transform: none !important;
  box-sizing: border-box !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-dropdown[hidden] {
  display: none !important;
}

/* Explicit height is intentional: it guarantees a real scroll container. */
.hero .scan-test-wrap.custom-tool-select .tool-select-options {
  display: block !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  height: min(350px, 42vh) !important;
  min-height: 230px !important;
  max-height: 350px !important;
  padding: 2px 8px 8px 2px !important;
  overflow-x: hidden !important;
  overflow-y: scroll !important;
  overscroll-behavior-y: contain !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-gutter: stable both-edges !important;
  scrollbar-width: auto !important;
  scrollbar-color: #4a95df rgba(4,18,36,.82) !important;
  pointer-events: auto !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar {
  width: 12px !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-track {
  background: rgba(4,18,36,.82) !important;
  border: 1px solid rgba(94,151,225,.08) !important;
  border-radius: 999px !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-thumb {
  min-height: 52px !important;
  background: linear-gradient(180deg, #64b2f4, #3379bd) !important;
  border: 2px solid rgba(4,18,36,.82) !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18) !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #7bc5ff, #438dce) !important;
}

/* Category headings remain visible while their tests are being scrolled. */
.hero .tool-option-group {
  position: relative;
  padding: 0 2px 8px !important;
}

.hero .tool-option-group + .tool-option-group {
  margin-top: 8px !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

.hero .tool-option-category {
  position: sticky !important;
  top: 0 !important;
  z-index: 8 !important;
  min-height: 34px !important;
  margin: 0 0 5px !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(87,151,233,.14) !important;
  border-left: 3px solid #2dd7c5 !important;
  border-radius: 10px !important;
  background: linear-gradient(90deg, rgba(10,38,71,.98), rgba(7,25,48,.96)) !important;
  color: #91d7ff !important;
  box-shadow: 0 7px 18px rgba(1,8,20,.16) !important;
  backdrop-filter: blur(10px);
}

.hero .tool-option-category span {
  background: rgba(45,215,197,.13) !important;
  border: 1px solid rgba(45,215,197,.17) !important;
  color: #7deade !important;
}

.hero .tool-option {
  position: relative;
  min-height: 56px !important;
  margin: 3px 0 !important;
  padding: 9px 10px !important;
  border-radius: 13px !important;
}

.hero .tool-option:hover,
.hero .tool-option:focus-visible {
  background: linear-gradient(90deg, rgba(47,125,255,.15), rgba(45,215,197,.055)) !important;
  border-color: rgba(95,158,241,.22) !important;
  outline: none !important;
  transform: translateX(2px) !important;
}

.hero .tool-option.is-selected {
  border-color: rgba(74,157,255,.42) !important;
  border-left: 3px solid #4a9dff !important;
  background: linear-gradient(90deg, rgba(47,125,255,.26), rgba(45,215,197,.10)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 8px 20px rgba(3,10,24,.12) !important;
}

.hero .tool-option.is-selected .tool-option-check {
  display: grid !important;
  place-items: center !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: rgba(45,215,197,.13) !important;
  color: #7ff0df !important;
  opacity: 1 !important;
}

.tool-select-scroll-hint {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 30px;
  margin-top: 7px;
  padding: 5px 9px;
  border: 1px solid rgba(93,151,226,.10);
  border-radius: 9px;
  background: rgba(5,20,39,.48);
  color: #7f98b8;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .035em;
}

.tool-select-scroll-hint::before {
  content: "↕";
  color: #67b9f6;
  font-size: 13px;
}

@media (max-width: 760px) {
  .hero .scan-test-wrap.custom-tool-select .tool-select-options {
    height: min(300px, 40vh) !important;
    min-height: 210px !important;
    max-height: 300px !important;
  }

  .hero .tool-option-category {
    top: 0 !important;
  }
}

:root[data-theme="light"] .hero .scan-target-entry {
  border-left-color: #3177df !important;
}

:root[data-theme="light"] .hero .scan-test-wrap.custom-tool-select {
  border-left-color: #188f88 !important;
}

:root[data-theme="light"] .hero .scan-test-wrap.custom-tool-select > label {
  color: #47647f !important;
}

:root[data-theme="light"] .hero .scan-test-wrap.custom-tool-select > label::before {
  background: rgba(24,143,136,.09);
  border-color: rgba(24,143,136,.16);
  color: #147b75;
}

:root[data-theme="light"] .hero .scan-test-wrap.custom-tool-select .tool-select-options {
  scrollbar-color: #6d9dcc #e5edf5 !important;
}

:root[data-theme="light"] .hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-track {
  background: #e5edf5 !important;
  border-color: rgba(15,42,68,.06) !important;
}

:root[data-theme="light"] .hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #83b8e5, #5f91c0) !important;
  border-color: #e5edf5 !important;
}

:root[data-theme="light"] .hero .tool-option-category {
  background: linear-gradient(90deg, rgba(232,244,255,.98), rgba(241,250,249,.98)) !important;
  border-color: rgba(49,119,223,.11) !important;
  border-left-color: #188f88 !important;
  color: #236ba9 !important;
  box-shadow: 0 6px 16px rgba(23,45,68,.07) !important;
}

:root[data-theme="light"] .hero .tool-option-category span {
  background: rgba(24,143,136,.09) !important;
  border-color: rgba(24,143,136,.13) !important;
  color: #147b75 !important;
}

:root[data-theme="light"] .tool-select-scroll-hint {
  background: #edf4fa;
  border-color: rgba(15,42,68,.08);
  color: #617b96;
}

/* =========================================================
   CYBEROCENA v6.18 — final native scroll fix
   Dropdown pozostaje w formularzu i ma jeden prawdziwy
   kontener przewijania. Bez portalu, fixed i transformów.
   ========================================================= */
.hero .scan-test-wrap.custom-tool-select {
  position: relative !important;
  overflow: visible !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-dropdown,
.hero .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: 100% !important;
  max-width: none !important;
  height: min(460px, 56vh) !important;
  min-height: 320px !important;
  max-height: 460px !important;
  margin: 10px 0 0 !important;
  padding: 10px !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  gap: 7px !important;
  overflow: hidden !important;
  transform: none !important;
  contain: layout paint !important;
  z-index: 80 !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-dropdown[hidden] {
  display: none !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-search,
.hero .scan-test-wrap.custom-tool-select .tool-select-scroll-hint {
  position: relative !important;
  z-index: 5 !important;
  flex: none !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-gutter: stable !important;
  scrollbar-width: auto !important;
  pointer-events: auto !important;
  outline: none !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options:focus-visible {
  box-shadow: inset 0 0 0 2px rgba(74, 157, 255, .28) !important;
  border-radius: 12px !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar {
  width: 13px !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-track {
  background: rgba(4, 18, 36, .9) !important;
  border-radius: 999px !important;
}

.hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-thumb {
  min-height: 56px !important;
  background: linear-gradient(180deg, #70bfff, #347fc5) !important;
  border: 3px solid rgba(4, 18, 36, .9) !important;
  border-radius: 999px !important;
}

/* Wyłączamy wszystkie pozostałości po starym trybie portalowym. */
.tool-select-dropdown.is-portal,
.tool-select-dropdown.is-portal.opens-up {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  transform: none !important;
}

@media (max-width: 760px) {
  .hero .scan-test-wrap.custom-tool-select .tool-select-dropdown,
  .hero .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: min(420px, 62vh) !important;
    min-height: 290px !important;
    max-height: 420px !important;
  }
}

:root[data-theme="light"] .hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-track {
  background: #e4edf6 !important;
}

:root[data-theme="light"] .hero .scan-test-wrap.custom-tool-select .tool-select-options::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #89c2ed, #5f96c8) !important;
  border-color: #e4edf6 !important;
}

/* =========================================================
   CYBEROCENA v6.19 — final accessible light theme layer
   WCAG-oriented contrast and consistent surface hierarchy
   ========================================================= */

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #edf3f7;
  --bg-soft: #f7fafc;
  --surface: #ffffff;
  --surface-2: #f3f7fa;
  --surface-3: #e7eef4;
  --line: rgba(15, 42, 68, .13);
  --line-strong: rgba(15, 42, 68, .24);
  --text: #0f2940;
  --muted: #49647d;
  --muted-2: #617a92;
  --primary: #087f73;
  --primary-strong: #06685f;
  --primary-dark: #d9f4ef;
  --blue: #1769b0;
  --good: #087a5d;
  --warn: #9a5900;
  --bad: #bd324b;
  --info: #1d65aa;
  --shadow: 0 18px 48px rgba(23, 45, 68, .11);
}

:root[data-theme="light"] body,
:root[data-theme="light"] .app-shell {
  color: #0f2940 !important;
  background: linear-gradient(180deg, #f8fbfd 0%, #edf3f7 100%) !important;
}

:root[data-theme="light"] body,
:root[data-theme="light"] button,
:root[data-theme="light"] input,
:root[data-theme="light"] select,
:root[data-theme="light"] textarea {
  color: #0f2940;
}

/* Header and navigation */
:root[data-theme="light"] .topbar {
  background: rgba(255,255,255,.94) !important;
  border-bottom-color: rgba(15,42,68,.12) !important;
  box-shadow: 0 8px 28px rgba(23,45,68,.07) !important;
}

:root[data-theme="light"] .brand strong { color: #0b253b !important; }
:root[data-theme="light"] .brand small { color: #526d86 !important; }
:root[data-theme="light"] .main-nav a { color: #415d77 !important; }
:root[data-theme="light"] .main-nav a:hover,
:root[data-theme="light"] .main-nav a.is-active { color: #0b253b !important; }

:root[data-theme="light"] .icon-button,
:root[data-theme="light"] .view-controls button,
:root[data-theme="light"] .account-link {
  color: #294b69 !important;
  background: #fff !important;
  border-color: rgba(15,42,68,.14) !important;
  box-shadow: 0 6px 18px rgba(23,45,68,.05) !important;
}

:root[data-theme="light"] .icon-button:hover,
:root[data-theme="light"] .view-controls button:hover,
:root[data-theme="light"] .account-link:hover {
  color: #075f56 !important;
  border-color: rgba(8,127,115,.30) !important;
  background: #f5fbfa !important;
}

:root[data-theme="light"] .header-cta,
:root[data-theme="light"] .button-primary {
  color: #fff !important;
  background: linear-gradient(135deg, #0b8d7f, #087166) !important;
  border-color: rgba(4,97,88,.20) !important;
  text-shadow: none !important;
}

:root[data-theme="light"] .button-ghost {
  color: #173650 !important;
  background: #fff !important;
  border-color: rgba(15,42,68,.14) !important;
}

/* Hero */
:root[data-theme="light"] .hero {
  color: #102a43 !important;
  background:
    radial-gradient(circle at 15% 14%, rgba(49,119,223,.10), transparent 24%),
    radial-gradient(circle at 80% 12%, rgba(20,164,151,.09), transparent 22%),
    linear-gradient(135deg, #fbfdff 0%, #eef5fa 52%, #f7fafc 100%) !important;
  border-bottom-color: rgba(15,42,68,.10) !important;
}

:root[data-theme="light"] .hero::before {
  opacity: .35 !important;
  background-image:
    linear-gradient(rgba(29,78,121,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(29,78,121,.07) 1px, transparent 1px) !important;
}

:root[data-theme="light"] .hero::after {
  background: linear-gradient(transparent, #edf3f7) !important;
}

:root[data-theme="light"] .eyebrow,
:root[data-theme="light"] .section-kicker {
  color: #096e66 !important;
}

:root[data-theme="light"] .eyebrow {
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(15,42,68,.12) !important;
  box-shadow: 0 8px 24px rgba(23,45,68,.06) !important;
}

:root[data-theme="light"] .hero h1,
:root[data-theme="light"] .hero-title-primary {
  color: #0d2942 !important;
  text-shadow: none !important;
}

:root[data-theme="light"] .hero h1 span,
:root[data-theme="light"] .hero-title-secondary {
  color: #1769b0 !important;
}

:root[data-theme="light"] .hero h1 em {
  background: linear-gradient(90deg, #1769b0, #087f73) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

:root[data-theme="light"] .hero > .hero-content > p,
:root[data-theme="light"] .hero p,
:root[data-theme="light"] .scan-consent {
  color: #4b657e !important;
}

/* Scan composer */
:root[data-theme="light"] .scan-bar {
  color: #102a43 !important;
  background: linear-gradient(180deg, rgba(255,255,255,.97), rgba(247,250,252,.98)) !important;
  border-color: rgba(15,42,68,.15) !important;
  box-shadow: 0 20px 46px rgba(23,45,68,.11), inset 0 1px 0 rgba(255,255,255,.9) !important;
}

:root[data-theme="light"] .scan-target-entry {
  color: #102a43 !important;
  background: linear-gradient(135deg, #f3f9fd, #edf8f8 58%, #fff) !important;
  border-color: rgba(23,105,176,.22) !important;
  box-shadow: 0 8px 20px rgba(23,45,68,.06), inset 0 1px 0 rgba(255,255,255,.9) !important;
}

:root[data-theme="light"] .scan-target-field input {
  color: #0d2942 !important;
  caret-color: #087f73 !important;
}

:root[data-theme="light"] .scan-target-field input::placeholder {
  color: #647d94 !important;
  opacity: 1 !important;
}

:root[data-theme="light"] .target-input-hint,
:root[data-theme="light"] .target-input-error {
  color: #5c748b !important;
}

:root[data-theme="light"] .target-label-icon {
  color: #fff !important;
  background: linear-gradient(135deg, #2278cf, #0b9688) !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select,
:root[data-theme="light"] .selector-wrap:not(.is-hidden) {
  color: #102a43 !important;
  background: #fff !important;
  border-color: rgba(8,127,115,.20) !important;
  box-shadow: 0 8px 20px rgba(23,45,68,.05), inset 0 1px 0 rgba(255,255,255,.9) !important;
}

:root[data-theme="light"] .scan-test-wrap.custom-tool-select > label,
:root[data-theme="light"] .selector-wrap > label {
  color: #405f78 !important;
}

:root[data-theme="light"] .tool-select-button {
  color: #102a43 !important;
  background: #f4f8fb !important;
  border-color: rgba(15,42,68,.14) !important;
}

:root[data-theme="light"] .tool-select-button:hover {
  background: #edf6f6 !important;
  border-color: rgba(8,127,115,.25) !important;
}

:root[data-theme="light"] .tool-select-button-icon {
  color: #0b746a !important;
  background: #dff4f0 !important;
  border-color: rgba(8,127,115,.16) !important;
}

:root[data-theme="light"] .tool-select-button-copy strong { color: #102a43 !important; }
:root[data-theme="light"] .tool-select-button-copy small { color: #577089 !important; }

:root[data-theme="light"] .tool-select-dropdown {
  color: #102a43 !important;
  background: linear-gradient(180deg, #fff, #f5f9fc) !important;
  border-color: rgba(15,42,68,.15) !important;
  box-shadow: 0 26px 64px rgba(23,45,68,.17) !important;
}

:root[data-theme="light"] .tool-select-search {
  background: #edf4f8 !important;
  border-color: rgba(15,42,68,.11) !important;
}

:root[data-theme="light"] .tool-select-search input {
  color: #102a43 !important;
  background: transparent !important;
}

:root[data-theme="light"] .tool-select-search input::placeholder { color: #647c93 !important; }
:root[data-theme="light"] .tool-select-options { color: #173650 !important; background: #fff !important; }

:root[data-theme="light"] .tool-option {
  color: #173650 !important;
  background: transparent !important;
  border-color: transparent !important;
}

:root[data-theme="light"] .tool-option-copy strong { color: #173650 !important; }
:root[data-theme="light"] .tool-option-copy small { color: #5c748b !important; }

:root[data-theme="light"] .tool-option:hover,
:root[data-theme="light"] .tool-option:focus-visible {
  color: #0f2940 !important;
  background: linear-gradient(90deg, #e9f3fd, #ecf8f6) !important;
  border-color: rgba(23,105,176,.14) !important;
}

:root[data-theme="light"] .tool-option.is-selected {
  color: #0d2942 !important;
  background: linear-gradient(90deg, #dceeff, #e2f6f2) !important;
  border-color: rgba(23,105,176,.25) !important;
  border-left-color: #1769b0 !important;
}

:root[data-theme="light"] .tool-option-icon {
  color: #0e65a8 !important;
  background: linear-gradient(145deg, #dcecff, #ddf5f1) !important;
}

:root[data-theme="light"] .tool-option-category {
  color: #174f7d !important;
  background: linear-gradient(90deg, #e6f2fc, #edf8f6) !important;
  border-color: rgba(15,42,68,.10) !important;
  border-left-color: #087f73 !important;
}

:root[data-theme="light"] .tool-option-category span {
  color: #096e66 !important;
  background: #daf0ec !important;
  border-color: rgba(8,127,115,.14) !important;
}

:root[data-theme="light"] .tool-select-scroll-hint {
  color: #536e87 !important;
  background: #edf4f8 !important;
  border-color: rgba(15,42,68,.09) !important;
}

:root[data-theme="light"] .scan-examples { color: #526c84 !important; }
:root[data-theme="light"] .scan-examples button {
  color: #1f4e75 !important;
  background: #edf5fb !important;
  border: 1px solid rgba(23,105,176,.12) !important;
}

:root[data-theme="light"] .hero-trust { color: #365b79 !important; }

/* CTA keeps strong contrast */
:root[data-theme="light"] .scan-submit,
:root[data-theme="light"] .tool-select-open .scan-submit {
  color: #281400 !important;
  background: linear-gradient(135deg, #ffad42, #f18721) !important;
  border-color: rgba(170,82,0,.20) !important;
  text-shadow: none !important;
  box-shadow: 0 14px 30px rgba(205,104,13,.22), inset 0 1px 0 rgba(255,255,255,.35) !important;
}

:root[data-theme="light"] .scan-submit small,
:root[data-theme="light"] .scan-submit span { color: #281400 !important; }

/* Feature cards and workspaces */
:root[data-theme="light"] .feature-strip,
:root[data-theme="light"] .workspace,
:root[data-theme="light"] .result-section,
:root[data-theme="light"] .knowledge-section,
:root[data-theme="light"] .platform-section,
:root[data-theme="light"] .api-section,
:root[data-theme="light"] .connection-insight-section,
:root[data-theme="light"] .knowledge-footer-premium {
  color: #102a43 !important;
  background: transparent !important;
}

:root[data-theme="light"] .feature-strip button,
:root[data-theme="light"] .tool-sidebar,
:root[data-theme="light"] .tool-content,
:root[data-theme="light"] .rail-panel,
:root[data-theme="light"] .trust-panel,
:root[data-theme="light"] .tool-card,
:root[data-theme="light"] .catalog-tool-card,
:root[data-theme="light"] .knowledge-card,
:root[data-theme="light"] .knowledge-card-full,
:root[data-theme="light"] .metric-card,
:root[data-theme="light"] .summary-card,
:root[data-theme="light"] .score-card,
:root[data-theme="light"] .module-score,
:root[data-theme="light"] .finding,
:root[data-theme="light"] .rail-knowledge,
:root[data-theme="light"] .article-body-premium,
:root[data-theme="light"] .article-side-card,
:root[data-theme="light"] .modal-card,
:root[data-theme="light"] .browser-trace-top,
:root[data-theme="light"] .knowledge-footer-links > div {
  color: #102a43 !important;
  background: linear-gradient(180deg, #fff, #f7fafc) !important;
  border-color: rgba(15,42,68,.12) !important;
  box-shadow: 0 12px 32px rgba(23,45,68,.07) !important;
}

:root[data-theme="light"] .feature-strip strong,
:root[data-theme="light"] .tool-card h3,
:root[data-theme="light"] .catalog-tool-card h2,
:root[data-theme="light"] .knowledge-card h3,
:root[data-theme="light"] .knowledge-card-full h2,
:root[data-theme="light"] .section-heading h2,
:root[data-theme="light"] .listing-hero h1,
:root[data-theme="light"] .knowledge-heading h2,
:root[data-theme="light"] .rail-heading strong,
:root[data-theme="light"] .summary-card strong,
:root[data-theme="light"] .finding h3,
:root[data-theme="light"] .browser-trace-title h2,
:root[data-theme="light"] .knowledge-footer-intro h2,
:root[data-theme="light"] .knowledge-footer-links strong {
  color: #102a43 !important;
}

:root[data-theme="light"] .feature-strip small,
:root[data-theme="light"] .tool-card p,
:root[data-theme="light"] .catalog-tool-card p,
:root[data-theme="light"] .knowledge-card p,
:root[data-theme="light"] .knowledge-card-full p,
:root[data-theme="light"] .section-heading p,
:root[data-theme="light"] .listing-hero p,
:root[data-theme="light"] .knowledge-heading p,
:root[data-theme="light"] .rail-panel p,
:root[data-theme="light"] .trust-panel p,
:root[data-theme="light"] .metric-card p,
:root[data-theme="light"] .summary-card span,
:root[data-theme="light"] .finding p,
:root[data-theme="light"] .knowledge-footer-intro p,
:root[data-theme="light"] .knowledge-footer-links a,
:root[data-theme="light"] .browser-trace-note {
  color: #506a82 !important;
}

:root[data-theme="light"] .feature-strip b,
:root[data-theme="light"] .tool-card-footer,
:root[data-theme="light"] .all-tools-link,
:root[data-theme="light"] .knowledge-section-actions a {
  color: #1769b0 !important;
}

:root[data-theme="light"] .category-button,
:root[data-theme="light"] .tool-search,
:root[data-theme="light"] .source-chip-grid > *,
:root[data-theme="light"] .source-logos > * {
  color: #274b69 !important;
  background: #f4f8fb !important;
  border-color: rgba(15,42,68,.12) !important;
}

:root[data-theme="light"] .category-button.is-active {
  color: #fff !important;
  background: #1769b0 !important;
  border-color: #1769b0 !important;
}

:root[data-theme="light"] .tool-search input {
  color: #102a43 !important;
  background: transparent !important;
}

:root[data-theme="light"] .tool-search input::placeholder { color: #647c93 !important; }

/* Results and statuses */
:root[data-theme="light"] .result-toolbar,
:root[data-theme="light"] .scan-progress,
:root[data-theme="light"] .module-strip,
:root[data-theme="light"] .report-disclaimer,
:root[data-theme="light"] .error-panel {
  color: #102a43 !important;
  background: #fff !important;
  border-color: rgba(15,42,68,.12) !important;
}

:root[data-theme="light"] .scan-progress p,
:root[data-theme="light"] .report-disclaimer,
:root[data-theme="light"] .finding-summary small,
:root[data-theme="light"] .finding-details,
:root[data-theme="light"] .module-score span {
  color: #506a82 !important;
}

:root[data-theme="light"] .finding[data-status="good"] { border-left-color: #087a5d !important; }
:root[data-theme="light"] .finding[data-status="warn"] { border-left-color: #b66a00 !important; }
:root[data-theme="light"] .finding[data-status="bad"] { border-left-color: #bd324b !important; }
:root[data-theme="light"] .finding[data-status="info"] { border-left-color: #1769b0 !important; }

/* Modals and forms */
:root[data-theme="light"] .modal-backdrop { background: rgba(15, 30, 45, .42) !important; }
:root[data-theme="light"] .modal-field label,
:root[data-theme="light"] .modal-note { color: #4d6780 !important; }

:root[data-theme="light"] .modal-field input,
:root[data-theme="light"] .modal-field textarea,
:root[data-theme="light"] .modal-field select {
  color: #102a43 !important;
  background: #fff !important;
  border-color: rgba(15,42,68,.16) !important;
}

:root[data-theme="light"] .modal-field input::placeholder,
:root[data-theme="light"] .modal-field textarea::placeholder { color: #6b8196 !important; }

/* Listing and article pages */
:root[data-theme="light"] .listing-page,
:root[data-theme="light"] .article-page-wide,
:root[data-theme="light"] .safe-use-page {
  color: #102a43 !important;
}

:root[data-theme="light"] .listing-hero,
:root[data-theme="light"] .safe-use-hero {
  color: #102a43 !important;
  background: linear-gradient(135deg, #fff, #eef5fa) !important;
  border-color: rgba(15,42,68,.12) !important;
  box-shadow: 0 18px 42px rgba(23,45,68,.08) !important;
}

:root[data-theme="light"] .article-body-premium h1,
:root[data-theme="light"] .article-body-premium h2,
:root[data-theme="light"] .article-body-premium h3,
:root[data-theme="light"] .safe-use-hero h1,
:root[data-theme="light"] .safe-use-grid h2,
:root[data-theme="light"] .safe-use-summary strong {
  color: #102a43 !important;
}

:root[data-theme="light"] .article-body-premium p,
:root[data-theme="light"] .article-body-premium li,
:root[data-theme="light"] .safe-use-hero > p,
:root[data-theme="light"] .safe-use-grid p,
:root[data-theme="light"] .safe-use-summary p {
  color: #49647d !important;
}

/* Footer */
:root[data-theme="light"] .footer,
:root[data-theme="light"] .footer.footer-safe {
  color: #173650 !important;
  background:
    radial-gradient(circle at 75% 10%, rgba(20,164,151,.07), transparent 24%),
    linear-gradient(135deg, #f8fbfe, #edf4f8) !important;
  border-top-color: rgba(15,42,68,.11) !important;
}

:root[data-theme="light"] .footer-brand strong,
:root[data-theme="light"] .footer-safety strong { color: #102a43 !important; }
:root[data-theme="light"] .footer-brand small,
:root[data-theme="light"] .footer-brand-block > p,
:root[data-theme="light"] .footer-meta p,
:root[data-theme="light"] .footer-meta > span,
:root[data-theme="light"] .footer-safety p { color: #526c84 !important; }

:root[data-theme="light"] .footer-safety {
  background: rgba(255,255,255,.82) !important;
  border-color: rgba(8,127,115,.16) !important;
  box-shadow: 0 12px 30px rgba(23,45,68,.06) !important;
}

:root[data-theme="light"] .footer-policy-link {
  color: #075f56 !important;
  background: #e2f3f0 !important;
  border-color: rgba(8,127,115,.16) !important;
}

/* Never allow low-contrast white text in generic light cards */
:root[data-theme="light"] .feature-strip button,
:root[data-theme="light"] .tool-card,
:root[data-theme="light"] .catalog-tool-card,
:root[data-theme="light"] .knowledge-card,
:root[data-theme="light"] .knowledge-card-full,
:root[data-theme="light"] .rail-panel,
:root[data-theme="light"] .trust-panel,
:root[data-theme="light"] .metric-card,
:root[data-theme="light"] .summary-card,
:root[data-theme="light"] .finding,
:root[data-theme="light"] .modal-card,
:root[data-theme="light"] .browser-trace-top {
  text-shadow: none !important;
}

:root[data-theme="light"] :focus-visible {
  outline-color: #1769b0;
}

/* Contrast refinements for secondary text in light mode */
:root[data-theme="light"] { --muted-2: #596f84; }
:root[data-theme="light"] .scan-target-field input::placeholder,
:root[data-theme="light"] .tool-select-search input::placeholder,
:root[data-theme="light"] .tool-search input::placeholder,
:root[data-theme="light"] .modal-field input::placeholder,
:root[data-theme="light"] .modal-field textarea::placeholder { color: #596f84 !important; }

/* =========================================================
   CYBEROCENA v6.20 — full-width target field + modern CTA + mobile visual
   ========================================================= */

.scan-bar {
  width: min(1040px, 100%) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-areas:
    "target submit"
    "tool tool"
    "selector selector" !important;
  align-items: stretch !important;
  gap: 12px !important;
  padding: 14px !important;
}

.scan-bar:has(> .selector-wrap.is-hidden) {
  grid-template-areas:
    "target submit"
    "tool tool" !important;
}

.scan-tool-icon {
  display: none !important;
}

.scan-input-wrap.scan-target-field {
  grid-area: target !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.scan-target-entry {
  min-height: 64px !important;
  border-radius: 16px !important;
  padding: 10px 14px !important;
}

.scan-target-field input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  font-size: 18px !important;
}

.scan-target-field .target-label-icon {
  width: 44px !important;
  height: 44px !important;
  flex: 0 0 44px !important;
}

.scan-test-wrap.custom-tool-select {
  grid-area: tool !important;
  width: 100% !important;
  min-width: 0 !important;
}

.selector-wrap {
  grid-area: selector !important;
  width: 100% !important;
  min-width: 0 !important;
}

.scan-submit,
.tool-select-open .scan-submit {
  grid-area: submit !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  min-width: 196px !important;
  min-height: 64px !important;
  padding: 10px 12px 10px 20px !important;
  border-radius: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  white-space: nowrap !important;
  background: linear-gradient(135deg, #ffb347 0%, #ff8a1f 52%, #f56a00 100%) !important;
  border: 1px solid rgba(255, 166, 59, .66) !important;
  color: #fff !important;
  box-shadow: 0 16px 32px rgba(210, 102, 10, .28), inset 0 1px 0 rgba(255,255,255,.28) !important;
}

.scan-submit::before,
.scan-submit::after {
  display: none !important;
}

.scan-submit .scan-submit-copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  line-height: 1.04 !important;
}

.scan-submit .scan-submit-copy strong {
  display: block !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: .01em !important;
}

.scan-submit .scan-submit-copy small {
  display: block !important;
  margin-top: 3px !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
}

.scan-submit .scan-submit-icon {
  width: 38px !important;
  height: 38px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,.22) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22) !important;
  flex: 0 0 38px !important;
}

.scan-submit .scan-submit-icon svg,
.scan-submit > svg {
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2.2 !important;
}

.scan-submit:hover {
  transform: translateY(-1px) !important;
  background: linear-gradient(135deg, #ffbb55 0%, #ff8f22 54%, #eb6100 100%) !important;
  box-shadow: 0 20px 36px rgba(210, 102, 10, .34), inset 0 1px 0 rgba(255,255,255,.3) !important;
}

.scan-submit:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(255, 155, 46, .22), 0 18px 34px rgba(210, 102, 10, .28) !important;
}

.hero-mobile-visual {
  display: none;
}

@media (max-width: 1180px) {
  .scan-submit,
  .tool-select-open .scan-submit {
    min-width: 180px !important;
  }
}

@media (max-width: 760px) {
  .scan-bar,
  .scan-bar:has(> .selector-wrap.is-hidden) {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "target"
      "submit"
      "tool"
      "selector" !important;
    padding: 12px !important;
  }

  .scan-submit,
  .tool-select-open .scan-submit,
  .scan-input-wrap.scan-target-field,
  .scan-test-wrap.custom-tool-select,
  .selector-wrap {
    min-width: 0 !important;
    width: 100% !important;
  }

  .scan-submit,
  .tool-select-open .scan-submit {
    min-height: 58px !important;
    padding: 10px 14px !important;
  }

  .scan-target-entry {
    min-height: 60px !important;
  }

  .scan-target-field input {
    font-size: 16px !important;
    min-height: 40px !important;
  }

  .hero-mobile-visual {
    display: block;
    margin-top: 16px;
  }

  .hero-mobile-card {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    padding: 16px;
    background:
      radial-gradient(circle at 100% 0%, rgba(74, 148, 255, .18), transparent 28%),
      linear-gradient(145deg, rgba(8, 29, 54, .96), rgba(7, 21, 38, .98));
    border: 1px solid rgba(95, 160, 244, .20);
    box-shadow: 0 18px 34px rgba(0, 0, 0, .18);
  }

  .hero-mobile-card::after {
    content: "";
    position: absolute;
    inset: auto -10% -35% auto;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(39, 212, 196, .22), transparent 70%);
    pointer-events: none;
  }

  .hero-mobile-card-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
  }

  .hero-mobile-dot {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(135deg, #34d8c6, #1d78ff);
    box-shadow: 0 0 0 6px rgba(52, 216, 198, .10);
    flex: 0 0 12px;
  }

  .hero-mobile-card-head strong {
    display: block;
    color: #eff6ff;
    font-size: 14px;
    font-weight: 900;
  }

  .hero-mobile-card-head small {
    display: block;
    margin-top: 3px;
    color: #9eb3ce;
    font-size: 12px;
  }

  .hero-mobile-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }

  .hero-mobile-card-grid div {
    border-radius: 14px;
    padding: 12px 10px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(122, 168, 225, .14);
    text-align: left;
  }

  .hero-mobile-card-grid span {
    display: block;
    color: #88a2c2;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
  }

  .hero-mobile-card-grid strong {
    display: block;
    margin-top: 6px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 900;
  }

  .hero-mobile-bars {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
    margin-top: 14px;
    align-items: end;
    height: 42px;
  }

  .hero-mobile-bars i {
    display: block;
    border-radius: 999px;
    background: linear-gradient(180deg, #39d5cb, #277bff);
    opacity: .95;
  }

  .hero-mobile-bars i:nth-child(1) { height: 55%; }
  .hero-mobile-bars i:nth-child(2) { height: 90%; }
  .hero-mobile-bars i:nth-child(3) { height: 72%; }
}

:root[data-theme="light"] .scan-submit,
:root[data-theme="light"] .tool-select-open .scan-submit {
  box-shadow: 0 16px 32px rgba(215, 111, 9, .24), inset 0 1px 0 rgba(255,255,255,.28) !important;
}

:root[data-theme="light"] .hero-mobile-card {
  background:
    radial-gradient(circle at 100% 0%, rgba(74, 148, 255, .14), transparent 28%),
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(243,247,252,.98)) !important;
  border-color: rgba(32, 91, 170, .12) !important;
  box-shadow: 0 16px 30px rgba(28, 50, 76, .10) !important;
}

:root[data-theme="light"] .hero-mobile-card-head strong,
:root[data-theme="light"] .hero-mobile-card-grid strong {
  color: #10263f !important;
}

:root[data-theme="light"] .hero-mobile-card-head small,
:root[data-theme="light"] .hero-mobile-card-grid span {
  color: #607792 !important;
}

:root[data-theme="light"] .hero-mobile-card-grid div {
  background: rgba(13, 54, 96, .03) !important;
  border-color: rgba(17, 63, 112, .08) !important;
}

/* =========================================================
   CYBEROCENA v6.22 - SEO / UX / RWD / PDF actions
   ========================================================= */

html { scroll-behavior: smooth; }
body { overflow-x: clip; }
:where(section, article, main, aside, footer, [id]) { scroll-margin-top: 92px; }
:where(h1, h2, h3) { text-wrap: balance; }
:where(p, li) { text-wrap: pretty; }

/* Clear keyboard focus across the public interface. */
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary) 58%, white);
  outline-offset: 3px;
}

/* Professional PDF action. */
.button-pdf {
  min-height: 50px;
  padding: 7px 14px 7px 11px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid color-mix(in srgb, var(--primary) 32%, var(--line));
  border-radius: 13px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 15%, var(--surface)), color-mix(in srgb, var(--surface-2) 95%, transparent));
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 10px 24px rgba(2,12,28,.11);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.button-pdf > svg {
  width: 34px;
  height: 34px;
  padding: 8px;
  border-radius: 10px;
  background: linear-gradient(135deg, #2b84ff, #1bc8bd);
  color: white;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  flex: 0 0 34px;
}
.button-pdf > span { display: grid; gap: 2px; text-align: left; }
.button-pdf strong { color: var(--text); font-size: 13px; line-height: 1.05; }
.button-pdf small { color: var(--muted); font-size: 10px; line-height: 1.15; }
.button-pdf:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--primary) 55%, var(--line)); box-shadow: 0 14px 28px rgba(2,12,28,.16); }
.button-pdf:disabled { cursor: wait; opacity: .72; transform: none; }

.result-actions { align-items: center; flex-wrap: wrap; }
.result-actions .button { min-height: 46px; }

/* Render below-the-fold content more efficiently while retaining anchor layout. */
@supports (content-visibility: auto) {
  .workspace,
  .result-section,
  .knowledge-section,
  .platform-section,
  .api-section,
  .visitor-intelligence,
  .article-catalog,
  .knowledge-footer-premium,
  .footer {
    content-visibility: auto;
    contain-intrinsic-size: auto 760px;
  }
}

/* Safer responsive defaults. */
img, svg, video, canvas { max-width: 100%; }
pre, code { overflow-wrap: anywhere; }
pre { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { max-width: 100%; }
.article-body-premium table,
.panel table,
.result-section table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

.tool-detail-grid > article,
.knowledge-card,
.knowledge-card-full,
.tool-card,
.catalog-tool-card,
.summary-card,
.finding,
.rail-panel { min-width: 0; }

/* More stable hero and form sizing for CLS. */
.hero-content { min-width: 0; }
.scan-bar { contain: layout style; }
.scan-progress { min-height: 96px; }
.result-output { min-height: 1px; }

/* Mobile and tablet RWD pass. */
@media (max-width: 1024px) {
  .result-toolbar { align-items: flex-start; gap: 18px; }
  .result-actions { width: 100%; justify-content: flex-start; }
  .tool-detail-hero { grid-template-columns: 1fr; }
  .tool-detail-summary { max-width: none; }
  .article-layout { grid-template-columns: minmax(0,1fr); }
  .article-side { position: static; }
  .sticky-card { position: static; }
}

@media (max-width: 760px) {
  :root { --mobile-edge: 14px; }
  .topbar { min-height: 66px; }
  .hero { padding-left: var(--mobile-edge) !important; padding-right: var(--mobile-edge) !important; }
  .hero h1 { font-size: clamp(35px, 11vw, 48px) !important; line-height: 1.01 !important; }
  .hero > .hero-content > p { font-size: 15px !important; line-height: 1.58 !important; }
  .scan-bar { border-radius: 18px !important; }
  .scan-target-entry { min-height: 58px !important; }
  .scan-examples { flex-wrap: wrap; }
  .hero-trust { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px 12px !important; }
  .feature-strip { grid-template-columns: 1fr 1fr !important; }
  .feature-strip button { min-height: 82px; }
  .workspace,
  .result-section,
  .knowledge-section,
  .platform-section,
  .api-section,
  .visitor-intelligence,
  .listing-page,
  .article-page-wide,
  .tool-detail-page { margin-left: var(--mobile-edge) !important; margin-right: var(--mobile-edge) !important; }
  .result-section { padding: 14px !important; }
  .result-actions { display: grid; grid-template-columns: 1fr; }
  .result-actions .button,
  .result-actions .button-pdf { width: 100%; justify-content: center; }
  .button-pdf > span { text-align: left; }
  .summary-grid { grid-template-columns: 1fr 1fr !important; }
  .finding-summary { grid-template-columns: auto minmax(0,1fr) auto; gap: 10px; }
  .finding-summary .severity { grid-column: 2; justify-self: start; }
  .finding-summary .chevron { grid-column: 3; grid-row: 1; }
  .detail-grid { grid-template-columns: 1fr !important; }
  .tool-detail-grid { grid-template-columns: 1fr !important; }
  .article-header h1 { font-size: clamp(31px, 9.5vw, 46px) !important; }
  .article-body-premium { padding: 20px 16px !important; }
  .footer-safe { padding-left: var(--mobile-edge) !important; padding-right: var(--mobile-edge) !important; }
}

@media (max-width: 420px) {
  .feature-strip { grid-template-columns: 1fr !important; }
  .summary-grid { grid-template-columns: 1fr !important; }
  .hero-mobile-card-grid { grid-template-columns: 1fr 1fr 1fr; gap: 7px; }
  .hero-mobile-card-grid div { padding: 10px 7px; }
  .hero-mobile-card-grid strong { font-size: 16px; }
}

/* High-contrast light-mode final pass. */
:root[data-theme="light"] .button-pdf {
  background: linear-gradient(145deg, #ffffff, #eef5fb);
  border-color: rgba(27, 83, 143, .20);
  box-shadow: 0 10px 24px rgba(22, 52, 84, .09);
}
:root[data-theme="light"] .button-pdf strong { color: #102b46; }
:root[data-theme="light"] .button-pdf small { color: #566f89; }

/* Print fallback - useful when browser print is selected manually. */
@media print {
  @page { size: A4; margin: 14mm; }
  html, body { background: #fff !important; color: #172b3d !important; }
  .topbar, .hero, .feature-strip, .workspace, .knowledge-section, .platform-section, .api-section, .footer, .visitor-intelligence, .result-actions, .scan-progress, .modal { display: none !important; }
  .result-section { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: #fff !important; }
  .result-toolbar { display: block !important; border-bottom: 2px solid #1d75da; padding-bottom: 10mm; }
  .result-hero, .summary-grid, .module-strip, .detail-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; }
  .finding, .score-card, .summary-card, .module-score { break-inside: avoid; box-shadow: none !important; border: 1px solid #dce5ed !important; background: #fff !important; }
  .finding-details { display: block !important; max-height: none !important; }
  .finding-summary { break-after: avoid; }
  a { color: #1e5f9f !important; text-decoration: none; }
}

/* v6.22 semantic footer navigation */
.footer-nav-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
}
.footer-nav-grid > div { display: grid; align-content: start; gap: 8px; }
.footer-nav-grid strong { margin-bottom: 4px; color: var(--text); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.footer-nav-grid a { color: var(--muted); font-size: 13px; text-decoration: none; }
.footer-nav-grid a:hover { color: var(--primary); }
@media (max-width: 760px) { .footer-nav-grid { grid-template-columns: 1fr; padding: 16px; } }
:root[data-theme="light"] .footer-nav-grid { background: #fff; border-color: rgba(17,63,112,.12); }

.noscript-notice {
  padding: 12px 18px;
  background: #fff4d8;
  border-bottom: 1px solid #e2b85e;
  color: #4a3510;
  font-size: 14px;
  text-align: center;
}
@media (prefers-reduced-data: reduce) {
  .hero-visual, .hero-mobile-visual, .cyber-globe, .hero-orb { display: none !important; }
  * { background-image: none !important; }
}

.footer.footer-safe {
  grid-template-areas:
    "brand safety"
    "nav nav"
    "meta meta" !important;
}
.footer-nav-grid { grid-area: nav; }
@media (max-width: 900px) {
  .footer.footer-safe { grid-template-areas: "brand" "safety" "nav" "meta" !important; }
}

/* =========================================================
   CYBEROCENA v7.4 — public mobile CTA and RWD safety layer
   ========================================================= */

.scan-bar,
.scan-bar > * { min-width: 0; }
.scan-submit { visibility: visible !important; display: inline-flex !important; }

@media (max-width: 760px) {
  .scan-bar,
  .scan-bar:has(> .selector-wrap.is-hidden) {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    grid-template-areas:
      "target"
      "submit"
      "tool"
      "selector" !important;
    gap: 10px !important;
    padding: 11px !important;
    overflow: visible !important;
  }
  .scan-input-wrap.scan-target-field { grid-area: target !important; width: 100% !important; min-width: 0 !important; }
  .scan-test-wrap.custom-tool-select { grid-area: tool !important; width: 100% !important; min-width: 0 !important; }
  .selector-wrap { grid-area: selector !important; width: 100% !important; min-width: 0 !important; }
  .scan-submit,
  .tool-select-open .scan-submit {
    grid-area: submit !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 60px !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 6 !important;
  }
  .scan-submit .scan-submit-copy strong { font-size: 16px !important; }
  .scan-submit .scan-submit-copy small { font-size: 11px !important; }
  .hero-content { width: 100%; min-width: 0; }
  .hero h1 { overflow-wrap: anywhere; }
}

@media (max-width: 390px) {
  .scan-target-entry { padding-inline: 10px !important; }
  .scan-target-field .target-label-icon { width: 38px !important; height: 38px !important; flex-basis: 38px !important; }
  .scan-target-field input { font-size: 15px !important; }
}

/* =========================================================
   CYBEROCENA v7.5 — guaranteed mobile scan CTA
   Uses a simple flex flow instead of :has()/grid-area so the
   action remains visible in older Safari and after CSS merges.
   ========================================================= */

.mobile-scan-submit {
  display: none !important;
}

@media (max-width: 760px) {
  .hero #scanForm.scan-bar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    gap: 12px !important;
    padding: 12px !important;
    overflow: visible !important;
    contain: none !important;
  }

  .hero #scanForm > .scan-tool-icon {
    display: none !important;
  }

  .hero #scanForm > .scan-target-field {
    order: 1 !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }

  .hero #scanForm > .scan-test-wrap {
    order: 2 !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }

  .hero #scanForm > .selector-wrap {
    order: 3 !important;
    width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }

  .hero #scanForm > .selector-wrap.is-hidden {
    display: none !important;
  }

  .hero #scanForm > .desktop-scan-submit {
    display: none !important;
  }

  .hero #scanForm > .mobile-scan-submit {
    order: 4 !important;
    position: relative !important;
    inset: auto !important;
    z-index: 20 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    clip: auto !important;
    clip-path: none !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 66px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 11px 12px 11px 18px !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    border: 1px solid rgba(255, 211, 121, .7) !important;
    border-radius: 17px !important;
    background:
      radial-gradient(circle at 15% 0%, rgba(255,255,255,.42), transparent 34%),
      linear-gradient(135deg, #ffd15f 0%, #ff9b25 48%, #f36c12 100%) !important;
    color: #211202 !important;
    box-shadow:
      0 16px 32px rgba(222, 101, 18, .30),
      inset 0 1px 0 rgba(255,255,255,.65) !important;
    overflow: hidden !important;
    text-decoration: none !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
  }

  .hero #scanForm > .mobile-scan-submit::before,
  .hero #scanForm > .mobile-scan-submit::after {
    display: none !important;
    content: none !important;
  }

  .mobile-scan-submit-copy {
    display: flex !important;
    min-width: 0 !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
    text-align: left !important;
    line-height: 1.05 !important;
  }

  .mobile-scan-submit-copy strong {
    display: block !important;
    color: #201101 !important;
    font-size: 17px !important;
    font-weight: 950 !important;
    letter-spacing: -.015em !important;
  }

  .mobile-scan-submit-copy small {
    display: block !important;
    color: rgba(44, 23, 2, .72) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
  }

  .mobile-scan-submit-icon {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 13px !important;
    color: #fff !important;
    background: rgba(48, 24, 2, .88) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 7px 15px rgba(70, 31, 2, .19) !important;
  }

  .mobile-scan-submit-icon svg {
    width: 20px !important;
    height: 20px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  .hero #scanForm > .mobile-scan-submit:focus-visible {
    outline: 4px solid rgba(255, 179, 55, .28) !important;
    outline-offset: 3px !important;
  }

  .hero #scanForm > .mobile-scan-submit:disabled {
    opacity: .68 !important;
    cursor: wait !important;
  }
}

@media (max-width: 380px) {
  .mobile-scan-submit-copy strong { font-size: 16px !important; }
  .mobile-scan-submit-copy small { font-size: 9px !important; }
  .mobile-scan-submit-icon { width: 38px !important; height: 38px !important; flex-basis: 38px !important; }
}

/* =========================================================
   CYBEROCENA v7.6 — mobile footer and single-label scan CTA
   ========================================================= */

.scan-submit .scan-submit-copy,
.mobile-scan-submit .mobile-scan-submit-copy {
  justify-content: center !important;
}

.scan-submit .scan-submit-copy strong,
.mobile-scan-submit .mobile-scan-submit-copy strong {
  white-space: nowrap !important;
}

.scan-submit .scan-submit-copy small,
.mobile-scan-submit .mobile-scan-submit-copy small {
  display: none !important;
}

.desktop-scan-submit {
  min-width: 218px !important;
}

.footer.footer-safe,
.footer.footer-safe * {
  box-sizing: border-box;
}

.footer-nav-grid {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
  margin: 0 !important;
}

.footer-nav-grid > div,
.footer-nav-grid a,
.footer-meta,
.footer-meta p,
.footer-safety,
.footer-safety > div {
  min-width: 0 !important;
}

.footer-nav-grid a,
.footer.footer-safe .footer-meta p,
.footer.footer-safe .footer-safety p {
  overflow-wrap: anywhere;
}

@media (max-width: 760px) {
  .footer.footer-safe {
    width: 100% !important;
    max-width: none !important;
    padding: 28px 16px 24px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "brand"
      "safety"
      "nav"
      "meta" !important;
    gap: 18px !important;
    overflow: hidden !important;
  }

  .footer-brand-block,
  .footer-safety,
  .footer-nav-grid,
  .footer-meta {
    width: 100% !important;
    max-width: none !important;
    justify-self: stretch !important;
  }

  .footer-brand-block {
    padding: 0 !important;
  }

  .footer-brand-block > p {
    max-width: 100% !important;
  }

  .footer-safety {
    padding: 18px !important;
    grid-template-columns: 40px minmax(0, 1fr) !important;
    gap: 12px !important;
    border-radius: 18px !important;
  }

  .footer-policy-link {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: none !important;
    justify-content: center !important;
  }

  .footer-nav-grid {
    padding: 18px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px 18px !important;
    border-radius: 18px !important;
    text-align: left !important;
  }

  .footer-nav-grid > div {
    width: 100% !important;
    align-content: start !important;
  }

  .footer-nav-grid > div:nth-child(3) {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px 18px !important;
    padding-top: 18px !important;
    border-top: 1px solid rgba(110, 155, 210, .14) !important;
  }

  .footer-nav-grid > div:nth-child(3) > strong {
    grid-column: 1 / -1 !important;
  }

  .footer-nav-grid strong {
    font-size: 11px !important;
  }

  .footer-nav-grid a {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }

  .footer-meta {
    padding-top: 16px !important;
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 10px !important;
    text-align: left !important;
  }

  .footer.footer-safe .footer-meta p {
    max-width: 100% !important;
    font-size: 10px !important;
    line-height: 1.55 !important;
  }

  .footer-meta > span {
    min-width: 0 !important;
  }
}

@media (max-width: 480px) {
  .footer.footer-safe {
    padding-inline: 14px !important;
  }

  .footer-nav-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    padding: 18px 18px 4px !important;
  }

  .footer-nav-grid > div,
  .footer-nav-grid > div:nth-child(3) {
    grid-column: 1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 0 0 16px !important;
    margin: 0 0 16px !important;
    border-top: 0 !important;
    border-bottom: 1px solid rgba(110, 155, 210, .14) !important;
  }

  .footer-nav-grid > div:last-child {
    margin-bottom: 0 !important;
    border-bottom: 0 !important;
  }

  .footer-nav-grid > div:nth-child(3) > strong {
    grid-column: 1 !important;
  }

  .footer-nav-grid a {
    width: 100% !important;
    padding: 3px 0 !important;
  }

  .desktop-scan-submit {
    min-width: 0 !important;
  }

  .mobile-scan-submit-copy {
    align-items: flex-start !important;
  }
}


/* =========================================================
   CYBEROCENA v7.8 — homepage account conversion layer
   ========================================================= */
.hero-account-path { width: min(900px, 100%); margin: 18px auto 0; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border: 1px solid color-mix(in srgb, var(--blue) 22%, var(--line)); border-radius: 15px; background: linear-gradient(135deg, color-mix(in srgb, var(--blue) 8%, var(--surface)), color-mix(in srgb, var(--primary) 5%, var(--surface))); text-align: left; }
.hero-account-path > div { min-width: 0; display: flex; align-items: center; gap: 12px; }
.hero-account-icon { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: color-mix(in srgb, var(--primary) 12%, var(--surface-2)); border: 1px solid color-mix(in srgb, var(--primary) 22%, transparent); font-weight: 900; }
.hero-account-path p { display: grid; margin: 0; }
.hero-account-path strong { color: var(--text); font-size: 13px; }
.hero-account-path small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.hero-account-path > a { flex: 0 0 auto; color: var(--primary); font-size: 12px; font-weight: 900; }
.hero-account-path > a:hover { text-decoration: underline; text-underline-offset: 4px; }

.home-account-section { position: relative; width: min(1320px, calc(100% - 48px)); margin: 90px auto 30px; display: grid; grid-template-columns: minmax(0, .9fr) minmax(500px, 1.1fr); gap: 70px; align-items: center; padding: 58px; border: 1px solid var(--line); border-radius: 28px; overflow: hidden; background: radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--blue) 16%, transparent), transparent 34%), linear-gradient(145deg, var(--surface), color-mix(in srgb, var(--surface-2) 74%, var(--surface))); box-shadow: 0 32px 90px rgba(0,0,0,.16); }
.home-account-copy h2 { margin: 10px 0 14px; font-size: clamp(36px, 4vw, 58px); line-height: 1.06; letter-spacing: -.05em; }
.home-account-copy > p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.75; }
.home-account-benefits { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px 18px; margin-top: 24px; color: var(--text); font-size: 13px; font-weight: 700; }
.home-account-benefits span::first-letter { color: var(--primary); }
.home-account-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.home-account-actions .button { min-height: 49px; }
.home-account-visual { min-width: 0; }
.home-account-window { border-radius: 22px; overflow: hidden; background: #07111f; border: 1px solid rgba(106,157,223,.20); box-shadow: 0 28px 70px rgba(0,0,0,.30); transform: perspective(1100px) rotateY(-3deg); }
.home-account-window-head { height: 44px; display: flex; align-items: center; gap: 7px; padding: 0 14px; background: #0b1929; border-bottom: 1px solid rgba(135,171,218,.10); }
.home-account-window-head span { width: 8px; height: 8px; border-radius: 50%; background: #31465d; }.home-account-window-head span:first-child { background:#ff7c89; }.home-account-window-head span:nth-child(2){background:#f6c764}.home-account-window-head span:nth-child(3){background:#58ddae}
.home-account-window-head small { margin-left: auto; color: #7188a2; font-size: 9px; }
.home-account-window-body { padding: 22px; }
.home-account-score { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; padding: 18px; border-radius: 16px; background: linear-gradient(135deg, rgba(30,70,115,.44), rgba(13,40,67,.66)); border: 1px solid rgba(114,163,226,.16); }
.home-account-score small { grid-column: 1; color: #8198b4; font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.home-account-score strong { grid-column: 1; color: #f5faff; font-size: 42px; line-height: 1; }
.home-account-score strong em { color: #7188a2; font-size: 12px; font-style: normal; }
.home-account-score > span { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #59dfb3; font-size: 10px; font-weight: 800; }
.home-account-mini-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-top: 10px; }
.home-account-mini-grid article { padding: 14px; border-radius: 13px; background: rgba(255,255,255,.035); border: 1px solid rgba(121,162,214,.10); }
.home-account-mini-grid small { display:block; color:#7f94ad; font-size:9px; }.home-account-mini-grid strong { display:block; margin-top:5px; color:#f4f9ff; font-size:20px; }
.home-account-line-chart { height: 90px; display: flex; align-items: end; gap: 8px; padding: 14px 4px 0; }
.home-account-line-chart i { flex:1; border-radius: 999px 999px 3px 3px; background: linear-gradient(180deg,#56dfbe,#3e7df2); }.home-account-line-chart i:nth-child(1){height:30%}.home-account-line-chart i:nth-child(2){height:42%}.home-account-line-chart i:nth-child(3){height:38%}.home-account-line-chart i:nth-child(4){height:60%}.home-account-line-chart i:nth-child(5){height:55%}.home-account-line-chart i:nth-child(6){height:74%}.home-account-line-chart i:nth-child(7){height:88%}
.home-account-event { display:flex; align-items:center; gap:11px; margin-top:10px; padding:13px; border-radius:13px; background:rgba(255,255,255,.035); border:1px solid rgba(121,162,214,.10); }.home-account-event > span{width:9px;height:9px;border-radius:50%;background:#58dfb1;box-shadow:0 0 0 5px rgba(88,223,177,.10)}.home-account-event div{display:grid}.home-account-event strong{color:#eaf3ff;font-size:10px}.home-account-event small{color:#7288a2;font-size:8px}
.platform-account-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.platform-section-account .platform-copy > p { max-width: 760px; }

@media (max-width: 1100px) {
  .home-account-section { grid-template-columns: 1fr; }
  .home-account-visual { width: min(760px,100%); margin-inline:auto; }
  .home-account-window { transform:none; }
}
@media (max-width: 700px) {
  .hero-account-path { align-items: flex-start; flex-direction: column; }
  .hero-account-path > a { padding-left: 50px; }
  .home-account-section { width: calc(100% - 28px); margin-top: 62px; padding: 30px 20px; border-radius: 22px; gap: 36px; }
  .home-account-copy h2 { font-size: 36px; }
  .home-account-benefits { grid-template-columns: 1fr; }
  .home-account-actions { display:grid; }
  .home-account-actions .button { width:100%; }
  .home-account-window-body { padding:14px; }
  .home-account-mini-grid { grid-template-columns:1fr 1fr; }
  .home-account-mini-grid article:nth-child(3){grid-column:1/-1;}
  .home-account-score strong { font-size:34px; }
  .platform-account-actions { display:grid; }
  .platform-account-actions .button { width:100%; }
}
:root[data-theme="light"] .home-account-window { background:#f8fbfd; border-color:rgba(23,51,78,.12); }
:root[data-theme="light"] .home-account-window-head { background:#eaf1f7; }
:root[data-theme="light"] .home-account-score, :root[data-theme="light"] .home-account-mini-grid article, :root[data-theme="light"] .home-account-event { background:#fff; border-color:rgba(23,51,78,.10); }
:root[data-theme="light"] .home-account-score strong, :root[data-theme="light"] .home-account-mini-grid strong, :root[data-theme="light"] .home-account-event strong { color:#102235; }

/* =========================================================
   CYBEROCENA v7.9 — enterprise typography, public UX and About page
   ========================================================= */

html { font-size: 16px; scroll-padding-top: 88px; }
body { font-size: 15px; line-height: 1.6; text-rendering: optimizeLegibility; }
button, input, select, textarea { font: inherit; }

.topbar { min-height: 74px; }
.brand strong { font-size: 19px !important; letter-spacing: .055em !important; }
.brand small { font-size: 9px !important; }
.main-nav a { font-size: 13px !important; }
.account-link { font-size: 13px !important; }
.button { font-size: 13px; }

.hero h1 {
  max-width: 820px !important;
  font-size: clamp(42px, 4.5vw, 64px) !important;
  line-height: 1.03 !important;
  letter-spacing: -.045em !important;
}
.hero > .hero-content > p { font-size: clamp(15px, 1.25vw, 18px) !important; line-height: 1.65 !important; }
.hero .eyebrow { font-size: 10px !important; }

.section-heading h2,
.knowledge-heading h2,
.platform-copy h2,
.api-section h2,
.home-account-copy h2 {
  font-size: clamp(28px, 3vw, 44px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.035em !important;
}
.section-heading p,
.knowledge-heading p,
.platform-copy > p,
.api-section p,
.home-account-copy > p { font-size: 15px !important; line-height: 1.65 !important; }

.listing-hero h1 { font-size: clamp(38px, 5vw, 64px) !important; line-height: 1.04 !important; }
.listing-hero p { font-size: clamp(16px, 1.6vw, 20px) !important; line-height: 1.65 !important; }
.article-header h1 { font-size: clamp(34px, 4vw, 52px) !important; line-height: 1.08 !important; }
.article-lead { font-size: 18px !important; line-height: 1.7 !important; }
.article-body { font-size: 16px; }
.article-body h2 { font-size: clamp(25px, 2.6vw, 34px) !important; }
.article-body h3 { font-size: clamp(20px, 2vw, 26px) !important; }

.tool-card h3, .knowledge-card h3 { font-size: 17px !important; }
.tool-card p, .knowledge-card p { font-size: 13px !important; line-height: 1.6 !important; }
.scan-target-field input,
.tool-select-search input,
.modal-field input { font-size: 16px !important; }

/* About page */
.about-page main { width: 100%; overflow: hidden; }
.about-hero,
.about-intro,
.about-feature-grid,
.about-process,
.about-checks,
.about-enterprise,
.about-safety {
  width: min(1280px, calc(100% - 48px));
  margin-inline: auto;
}
.about-hero {
  min-height: 650px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, .82fr);
  align-items: center;
  gap: clamp(50px, 7vw, 100px);
  padding: 72px 0 84px;
}
.about-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--primary);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.about-kicker span { width: 9px; height: 9px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 6px color-mix(in srgb, var(--primary) 12%, transparent); }
.about-hero h1 { max-width: 760px; margin: 18px 0 20px; font-size: clamp(44px, 5vw, 68px); line-height: 1.02; letter-spacing: -.052em; }
.about-hero h1 em { display: block; margin-top: 7px; color: var(--primary); font-style: normal; }
.about-hero-copy > p { max-width: 700px; margin: 0; color: var(--muted); font-size: clamp(16px, 1.4vw, 19px); line-height: 1.72; }
.about-hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 28px; }
.about-hero-actions .button { min-height: 50px; }
.about-trust-list { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 22px 0 0; padding: 0; list-style: none; color: var(--muted); font-size: 13px; }
.about-trust-list span { color: var(--good); font-weight: 900; }
.about-hero-visual { min-width: 0; display: grid; place-items: center; }
.about-radar { position: relative; width: min(430px, 100%); aspect-ratio: 1; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line)); background: repeating-radial-gradient(circle, transparent 0 54px, color-mix(in srgb, var(--primary) 12%, transparent) 55px 56px), conic-gradient(from 230deg, color-mix(in srgb, var(--primary) 20%, transparent), transparent 24%, color-mix(in srgb, var(--blue) 13%, transparent), transparent 56%); box-shadow: inset 0 0 90px rgba(25, 112, 231, .08), 0 30px 80px rgba(0,0,0,.18); }
.about-radar::before, .about-radar::after { content:""; position:absolute; inset:50% 0 auto; height:1px; background:color-mix(in srgb,var(--primary) 18%,transparent); }.about-radar::after{transform:rotate(90deg)}
.about-radar-core { position:absolute; inset:50% auto auto 50%; width:92px; height:92px; transform:translate(-50%,-50%); display:grid; place-items:center; border-radius:28px; color:#fff; background:linear-gradient(145deg,#347eff,#20cdb7); font-size:36px; font-weight:950; box-shadow:0 18px 42px rgba(36,111,228,.35); }
.about-node { position:absolute; min-width:104px; display:grid; gap:2px; padding:12px 14px; border:1px solid var(--line); border-radius:14px; background:color-mix(in srgb,var(--surface) 92%,transparent); box-shadow:0 14px 30px rgba(0,0,0,.18); font-style:normal; backdrop-filter:blur(12px); }
.about-node b { color:var(--text); font-size:13px; }.about-node small{color:var(--muted);font-size:10px}.node-domain{left:-2%;top:18%}.node-mail{right:-3%;top:20%}.node-web{left:4%;bottom:15%}.node-risk{right:3%;bottom:13%}
.about-intro { display:grid; grid-template-columns:minmax(300px,.8fr) minmax(0,1.2fr); gap:70px; align-items:start; padding:68px 0; border-top:1px solid var(--line); }
.about-intro h2, .about-section-head h2, .about-checks h2, .about-enterprise h2, .about-safety h2 { margin:9px 0 0; font-size:clamp(30px,3.4vw,48px); line-height:1.08; letter-spacing:-.04em; }
.about-intro > p { margin:0; color:var(--muted); font-size:17px; line-height:1.78; }
.about-feature-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; padding-bottom:80px; }
.about-feature-card { min-height:265px; padding:24px; border:1px solid var(--line); border-radius:20px; background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--surface-2) 78%,var(--surface))); box-shadow:0 18px 42px rgba(0,0,0,.10); }
.about-feature-card > span { display:inline-grid; place-items:center; width:38px; height:38px; border-radius:11px; color:var(--primary); background:color-mix(in srgb,var(--primary) 10%,var(--surface-2)); border:1px solid color-mix(in srgb,var(--primary) 20%,transparent); font-size:11px; font-weight:900; }
.about-feature-card h2 { margin:22px 0 10px; font-size:20px; line-height:1.25; }
.about-feature-card p { margin:0; color:var(--muted); font-size:14px; line-height:1.68; }
.about-process { padding:64px; border:1px solid var(--line); border-radius:28px; background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--blue) 7%,var(--surface-2))); }
.about-section-head { max-width:760px; }
.about-section-head > p { margin:14px 0 0; color:var(--muted); font-size:15px; line-height:1.7; }
.about-process-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:38px 0 0; padding:0; list-style:none; }
.about-process-grid li { display:grid; grid-template-columns:auto minmax(0,1fr); gap:13px; align-items:start; padding:18px; border:1px solid var(--line); border-radius:16px; background:color-mix(in srgb,var(--surface) 80%,transparent); }
.about-process-grid li > span { color:var(--primary); font-size:11px; font-weight:950; }
.about-process-grid h3 { margin:0 0 7px; font-size:16px; }.about-process-grid p{margin:0;color:var(--muted);font-size:13px;line-height:1.58}
.about-checks { display:grid; grid-template-columns:minmax(0,.9fr) minmax(430px,1.1fr); gap:70px; align-items:center; padding:100px 0; }
.about-checks-copy > p { margin:14px 0 24px; color:var(--muted); font-size:15px; line-height:1.7; }
.about-check-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.about-check-list span { display:flex; align-items:center; gap:11px; min-height:58px; padding:13px 15px; border:1px solid var(--line); border-radius:14px; background:var(--surface); color:var(--text); font-size:13px; font-weight:750; }
.about-check-list i { width:27px; height:27px; flex:0 0 27px; display:grid; place-items:center; border-radius:9px; color:var(--good); background:color-mix(in srgb,var(--good) 10%,var(--surface-2)); font-style:normal; }
.about-enterprise { display:grid; grid-template-columns:minmax(0,1fr) minmax(430px,.9fr); gap:70px; align-items:center; padding:58px; border:1px solid var(--line); border-radius:28px; background:radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--blue) 15%,transparent),transparent 34%),linear-gradient(145deg,var(--surface),var(--surface-2)); }
.about-enterprise-copy > p { margin:14px 0 0; color:var(--muted); font-size:15px; line-height:1.7; }
.about-enterprise-points { display:grid; grid-template-columns:1fr 1fr; gap:10px 18px; margin-top:24px; color:var(--text); font-size:13px; font-weight:750; }.about-enterprise-points span::before{content:"✓";margin-right:8px;color:var(--good)}
.about-enterprise-preview { overflow:hidden; border:1px solid rgba(104,158,226,.20); border-radius:20px; background:#07111f; box-shadow:0 26px 62px rgba(0,0,0,.28); }
.about-preview-head { height:42px; display:flex; align-items:center; gap:6px; padding:0 13px; background:#0b1929; border-bottom:1px solid rgba(130,168,218,.10); }.about-preview-head span{width:8px;height:8px;border-radius:50%;background:#42556b}.about-preview-head span:first-child{background:#ff7c89}.about-preview-head span:nth-child(2){background:#f5c562}.about-preview-head span:nth-child(3){background:#55dcae}.about-preview-head small{margin-left:auto;color:#788ca5;font-size:9px}
.about-preview-body{padding:20px}.about-preview-score{display:grid;grid-template-columns:1fr auto;align-items:end;padding:17px;border:1px solid rgba(113,162,224,.14);border-radius:15px;background:rgba(255,255,255,.035)}.about-preview-score small{grid-column:1;color:#8297b1;font-size:9px;text-transform:uppercase;letter-spacing:.09em}.about-preview-score strong{grid-column:1;color:#f5faff;font-size:40px;line-height:1}.about-preview-score em{color:#8194aa;font-size:11px;font-style:normal}.about-preview-score span{grid-column:2;grid-row:1/span 2;align-self:center;color:#56ddb1;font-size:10px;font-weight:800}
.about-preview-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:9px}.about-preview-metrics div{padding:12px;border:1px solid rgba(113,162,224,.10);border-radius:12px;background:rgba(255,255,255,.028)}.about-preview-metrics small,.about-preview-metrics strong{display:block}.about-preview-metrics small{color:#7c91aa;font-size:8px}.about-preview-metrics strong{margin-top:4px;color:#f4f9ff;font-size:18px}
.about-preview-chart{height:90px;display:flex;align-items:end;gap:7px;padding:15px 4px 0}.about-preview-chart i{flex:1;border-radius:999px 999px 3px 3px;background:linear-gradient(180deg,#53ddba,#3c7cec)}.about-preview-chart i:nth-child(1){height:32%}.about-preview-chart i:nth-child(2){height:45%}.about-preview-chart i:nth-child(3){height:40%}.about-preview-chart i:nth-child(4){height:58%}.about-preview-chart i:nth-child(5){height:55%}.about-preview-chart i:nth-child(6){height:74%}.about-preview-chart i:nth-child(7){height:86%}
.about-safety { display:grid; grid-template-columns:auto minmax(0,1fr); gap:22px; align-items:start; margin-block:70px 90px; padding:30px; border:1px solid color-mix(in srgb,var(--good) 24%,var(--line)); border-radius:22px; background:linear-gradient(145deg,color-mix(in srgb,var(--good) 6%,var(--surface)),var(--surface)); }
.about-safety-icon { width:50px; height:50px; display:grid; place-items:center; border-radius:15px; color:var(--good); background:color-mix(in srgb,var(--good) 11%,var(--surface-2)); border:1px solid color-mix(in srgb,var(--good) 22%,transparent); font-size:20px; font-weight:900; }
.about-safety h2 { font-size:clamp(25px,2.8vw,38px); }.about-safety p{margin:12px 0;color:var(--muted);font-size:14px;line-height:1.7}.about-safety a{color:var(--primary);font-size:13px;font-weight:850}

:root[data-theme="light"] .about-enterprise-preview { background:#f8fbfd; border-color:rgba(23,51,78,.12); box-shadow:0 24px 50px rgba(23,45,68,.12); }
:root[data-theme="light"] .about-preview-head { background:#eaf1f7; }
:root[data-theme="light"] .about-preview-score,
:root[data-theme="light"] .about-preview-metrics div { background:#fff; border-color:rgba(23,51,78,.09); }
:root[data-theme="light"] .about-preview-score strong,
:root[data-theme="light"] .about-preview-metrics strong { color:#102235; }

@media (max-width: 1100px) {
  .about-hero, .about-checks, .about-enterprise { grid-template-columns:1fr; }
  .about-hero { min-height:0; padding-top:56px; }
  .about-hero-copy { max-width:820px; }
  .about-hero-visual { width:min(580px,100%); margin-inline:auto; }
  .about-feature-grid, .about-process-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .about-checks-copy { max-width:760px; }
}

@media (max-width: 760px) {
  html { scroll-padding-top:72px; }
  body { font-size:14px; }
  .topbar { min-height:68px !important; padding-inline:14px !important; gap:8px !important; }
  .brand { gap:9px !important; }
  .brand strong { font-size:17px !important; }
  .brand small { display:none !important; }
  .account-link { max-width:92px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px !important; }
  .nav-toggle, .icon-button { width:40px !important; height:40px !important; flex:0 0 40px !important; }
  .mobile-nav-list a { min-height:48px; padding:12px; font-size:14px; }
  .mobile-nav-drawer { width:min(340px,92vw); }
  .hero { padding-top:34px !important; }
  .hero h1 { font-size:clamp(35px,10vw,46px) !important; line-height:1.04 !important; }
  .hero > .hero-content > p { font-size:15px !important; }
  .section-heading h2, .knowledge-heading h2, .platform-copy h2, .api-section h2, .home-account-copy h2 { font-size:clamp(27px,8vw,36px) !important; }
  .listing-hero h1 { font-size:clamp(34px,10vw,46px) !important; }
  .article-header h1 { font-size:clamp(31px,9vw,42px) !important; }
  .article-lead { font-size:17px !important; }
  .about-hero, .about-intro, .about-feature-grid, .about-process, .about-checks, .about-enterprise, .about-safety { width:calc(100% - 28px); }
  .about-hero { padding:46px 0 60px; gap:44px; }
  .about-hero h1 { font-size:clamp(37px,11vw,48px); }
  .about-hero-copy > p { font-size:16px; }
  .about-hero-actions { display:grid; }
  .about-hero-actions .button { width:100%; }
  .about-trust-list { display:grid; gap:9px; }
  .about-radar { width:min(340px,90vw); }
  .about-node { min-width:90px; padding:9px 11px; }
  .about-radar-core { width:76px; height:76px; border-radius:23px; font-size:29px; }
  .about-intro { grid-template-columns:1fr; gap:20px; padding:52px 0; }
  .about-intro > p { font-size:16px; }
  .about-feature-grid { grid-template-columns:1fr; gap:11px; padding-bottom:58px; }
  .about-feature-card { min-height:0; padding:20px; }
  .about-process { padding:28px 20px; border-radius:22px; }
  .about-process-grid { grid-template-columns:1fr; margin-top:26px; }
  .about-checks { gap:28px; padding:66px 0; }
  .about-check-list { grid-template-columns:1fr; }
  .about-enterprise { padding:28px 20px; gap:38px; border-radius:22px; }
  .about-enterprise-points { grid-template-columns:1fr; }
  .about-safety { grid-template-columns:1fr; margin-block:48px 64px; padding:22px; }
}

@media (max-width: 390px) {
  .top-actions { gap:5px !important; }
  .account-link { max-width:76px; }
  .about-node { min-width:80px; padding:8px 9px; }
  .about-node b { font-size:11px; }.about-node small{font-size:8px}
}

/* =========================================================
   CYBEROCENA v7.11 — authenticated public navigation
   ========================================================= */
.public-account-actions {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}
.public-user-link {
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.public-logout-form,
.footer-logout-form { margin: 0; }
.public-logout-button {
  min-height: 39px;
  padding: 0 12px;
  color: #aebed0;
  border: 1px solid rgba(111,146,186,.22);
  border-radius: 10px;
  background: rgba(255,255,255,.035);
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease;
}
.public-logout-button:hover,
.public-logout-button:focus-visible {
  color: #fff;
  border-color: rgba(255,158,91,.40);
  background: rgba(255,130,52,.10);
  outline: none;
}
.footer-logout-form button {
  display: inline;
  padding: 0;
  color: inherit;
  background: none;
  border: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.footer-logout-form button:hover { color: var(--primary); }
.mobile-nav-drawer .mobile-public-account-actions {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(108,145,190,.16);
}
.mobile-nav-drawer .mobile-public-account-actions .account-link,
.mobile-nav-drawer .mobile-public-account-actions .button,
.mobile-nav-drawer .mobile-public-account-actions .public-logout-form,
.mobile-nav-drawer .mobile-public-account-actions .public-logout-button {
  width: 100%;
  max-width: none;
}
.mobile-nav-drawer .mobile-public-account-actions .account-link,
.mobile-nav-drawer .mobile-public-account-actions .button,
.mobile-nav-drawer .mobile-public-account-actions .public-logout-button {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  text-align: center;
}
:root[data-theme="light"] .public-logout-button {
  color: #536d88;
  border-color: rgba(15,42,68,.14);
  background: #f7fafc;
}
:root[data-theme="light"] .public-logout-button:hover,
:root[data-theme="light"] .public-logout-button:focus-visible {
  color: #9a4312;
  border-color: rgba(205,93,24,.24);
  background: #fff4ec;
}
@media (max-width: 900px) {
  .top-actions > .public-account-actions { display: none; }
}
@media (max-width: 900px) {
  .top-actions > .public-account-actions { display: flex; }
  .main-nav + .top-actions > .public-account-actions { display: none; }
}

/* =========================================================
   CYBEROCENA v7.12 — consistent CTA, clocks and auth typography
   ========================================================= */

.live-clock {
  min-width: 0;
  display: inline-grid;
  justify-items: end;
  gap: 2px;
  font-variant-numeric: tabular-nums;
  line-height: 1.05;
  white-space: nowrap;
}
.live-clock [data-clock-time] {
  color: var(--text, #eef5ff);
  font-size: 13px;
  font-weight: 850;
  letter-spacing: .035em;
}
.live-clock [data-clock-date] {
  color: var(--muted, #8fa4bf);
  font-size: 9px;
  font-weight: 700;
  text-transform: capitalize;
}
.public-live-clock {
  padding-right: 12px;
  border-right: 1px solid color-mix(in srgb, var(--line) 75%, transparent);
}

/* The scan action uses one label and no sliding chevron/arrow. */
.scan-submit,
.mobile-scan-submit,
.desktop-scan-submit,
.tool-select-open .scan-submit {
  justify-content: center !important;
  overflow: visible !important;
}
.scan-submit::before,
.scan-submit::after,
.mobile-scan-submit::before,
.mobile-scan-submit::after,
.desktop-scan-submit::before,
.desktop-scan-submit::after {
  display: none !important;
  content: none !important;
}
.scan-submit-icon,
.mobile-scan-submit-icon {
  display: none !important;
}
.scan-submit-copy,
.mobile-scan-submit-copy {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}
.scan-submit-copy strong,
.mobile-scan-submit-copy strong {
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
}
.desktop-scan-submit {
  min-width: 210px !important;
  padding-inline: 22px !important;
}
.scan-submit:hover,
.mobile-scan-submit:hover,
.desktop-scan-submit:hover {
  transform: translateY(-1px) !important;
}

/* Enterprise authentication: readable, restrained typography on every viewport. */
.auth-body {
  font-size: 15px;
  line-height: 1.55;
}
.auth-showcase h1 {
  max-width: 720px;
  font-size: clamp(2rem, 3.4vw, 3.35rem) !important;
  line-height: 1.06 !important;
  letter-spacing: -.04em !important;
}
.auth-showcase > p {
  max-width: 660px;
  font-size: clamp(.98rem, 1.25vw, 1.08rem) !important;
  line-height: 1.7 !important;
}
.auth-card-heading h2 {
  font-size: clamp(1.55rem, 2vw, 1.9rem) !important;
  line-height: 1.15 !important;
}
.auth-card-heading p,
.auth-feature-list small,
.auth-onboarding-flow small,
.auth-form-support,
.auth-legal,
.auth-password-requirements {
  font-size: 13px !important;
  line-height: 1.55 !important;
}
.auth-field > span,
.auth-checkbox,
.auth-input-wrap input,
.auth-input-wrap select,
.auth-submit,
.auth-secondary-action {
  font-size: 14px !important;
}
.auth-product-badge,
.auth-card-kicker,
.auth-security-strip span {
  font-size: 10px !important;
}
.auth-input-wrap input,
.auth-input-wrap select {
  min-height: 52px !important;
}
.auth-submit,
.auth-secondary-action {
  min-height: 52px !important;
}
.auth-live-clock {
  padding-right: 14px;
  border-right: 1px solid rgba(115, 151, 198, .18);
}

@media (max-width: 1180px) {
  .public-live-clock { display: none; }
  .mobile-public-account-actions .public-live-clock {
    display: inline-grid;
    width: 100%;
    justify-items: start;
    padding: 12px 0;
    border-right: 0;
    border-bottom: 1px solid rgba(112,148,194,.16);
  }
}

@media (max-width: 760px) {
  .hero #scanForm > .mobile-scan-submit {
    justify-content: center !important;
    padding-inline: 18px !important;
  }
  .mobile-scan-submit-copy strong { font-size: 15px !important; }
  .auth-layout,
  .auth-layout-register { gap: 22px !important; }
  .auth-showcase h1 { font-size: clamp(1.85rem, 9vw, 2.45rem) !important; }
  .auth-showcase > p { font-size: 15px !important; }
  .auth-card { padding: 22px !important; }
  .auth-card-heading h2 { font-size: 1.6rem !important; }
  .auth-live-clock [data-clock-date] { display: none; }
  .auth-live-clock { padding-right: 10px; }
}

@media (max-width: 480px) {
  .auth-top-actions > a { display: none; }
  .auth-live-clock { margin-left: auto; border-right: 0; padding-right: 0; }
  .auth-card { padding: 18px !important; border-radius: 18px !important; }
  .auth-field-grid { grid-template-columns: 1fr !important; }
}
.mobile-drawer-clock {
  display: inline-grid !important;
  width: calc(100% - 30px);
  justify-items: start !important;
  margin: 0 15px 10px;
  padding: 12px 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid rgba(112,148,194,.16);
}

/* =========================================================
   Cyberocena v7.23 — legal pages, cookie consent, spacing
   ========================================================= */
:root {
  --section-space: clamp(54px, 6vw, 92px);
  --content-gap: clamp(18px, 2.2vw, 32px);
}

main > section:not(.hero):not(.feature-strip) { margin-block: var(--section-space); }
main > section + section { margin-top: 0; }
.hero { padding-bottom: clamp(64px, 7vw, 104px); }
.knowledge-section,.platform-section,.api-section,.safe-use-page,.legal-page { scroll-margin-top: 90px; }
.auth-layout { gap: clamp(28px, 4vw, 64px); }
.auth-card-heading { margin-bottom: 22px; }
.auth-field-grid { gap: 16px; align-items: start; }
.auth-field { min-width: 0; }
.auth-field > span { min-height: 22px; display: flex; align-items: flex-end; }
.auth-field-note { min-height: 20px; }
.auth-submit-note { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; text-align: center; }
.auth-inline-action { display: inline-flex; margin: -4px 0 14px; font-weight: 800; color: var(--primary); }
.auth-footer nav { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.auth-footer button { border: 0; padding: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; text-decoration: underline; }

.registration-privacy-summary { margin: 4px 0 16px; padding: 16px 18px; border: 1px solid color-mix(in srgb,var(--primary) 22%,var(--line)); border-radius: 14px; background: color-mix(in srgb,var(--primary) 5%,var(--surface-2)); }
.registration-privacy-summary strong { display: block; margin-bottom: 6px; font-size: 14px; }
.registration-privacy-summary p { margin: 0 0 8px; color: var(--muted); font-size: 13px; line-height: 1.62; }
.registration-privacy-summary a { color: var(--primary); font-weight: 800; font-size: 13px; }

.verification-shell { min-height: calc(100vh - 150px); display: grid; place-items: center; padding: 40px 18px; }
.verification-card { width: min(620px,100%); padding: clamp(28px,5vw,52px); text-align: center; border: 1px solid var(--line); border-radius: 24px; background: var(--surface); box-shadow: var(--shadow); }
.verification-icon { width: 70px; height: 70px; margin: 0 auto 18px; display: grid; place-items: center; border-radius: 22px; background: color-mix(in srgb,var(--primary) 14%,var(--surface-2)); color: var(--primary); font-size: 30px; font-weight: 900; }
.verification-success .verification-icon { color: var(--good); background: color-mix(in srgb,var(--good) 14%,var(--surface-2)); }
.verification-error .verification-icon { color: var(--bad); background: color-mix(in srgb,var(--bad) 14%,var(--surface-2)); }
.verification-card h1 { margin: 8px 0 12px; font-size: clamp(28px,5vw,44px); letter-spacing: -.035em; }
.verification-card > p { margin: 0 auto; max-width: 520px; color: var(--muted); line-height: 1.7; }
.verification-email { margin: 20px auto; padding: 12px 16px; max-width: 440px; border-radius: 12px; background: var(--surface-2); overflow-wrap: anywhere; }
.verification-email small,.verification-email strong { display:block; }
.verification-actions { display: grid; gap: 10px; max-width: 380px; margin: 24px auto 0; }
.verification-actions .auth-submit { text-decoration:none; justify-content:center; }
.verification-help { margin-top: 20px!important; font-size: 12px; }

.legal-page { width: min(1240px,calc(100% - 36px)); margin: 0 auto; }
.legal-hero { max-width: 900px; margin: 0!important; padding: clamp(50px,7vw,90px) 0 clamp(34px,5vw,60px); }
.legal-hero h1 { margin: 10px 0 16px; font-size: clamp(34px,6vw,64px); line-height: 1.02; letter-spacing: -.045em; }
.legal-hero > p { max-width: 790px; color: var(--muted); font-size: clamp(16px,2vw,19px); line-height: 1.72; }
.legal-meta { display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:22px; color:var(--muted); font-size:13px; }
.legal-meta a { color:var(--primary); }
.legal-layout { display:grid; grid-template-columns:250px minmax(0,1fr); gap:clamp(28px,5vw,70px); margin:0 0 var(--section-space)!important; align-items:start; }
.legal-toc { position:sticky; top:94px; display:grid; gap:7px; padding:18px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
.legal-toc strong { margin-bottom:5px; }
.legal-toc a { padding:7px 9px; border-radius:8px; color:var(--muted); font-size:13px; }
.legal-toc a:hover { color:var(--text); background:var(--surface-2); }
.legal-content { display:grid; gap:16px; }
.legal-content article { display:grid; grid-template-columns:42px minmax(0,1fr); gap:16px; padding:clamp(20px,3vw,30px); border:1px solid var(--line); border-radius:18px; background:var(--surface); scroll-margin-top:100px; }
.legal-content article > span { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; color:var(--primary); background:color-mix(in srgb,var(--primary) 10%,var(--surface-2)); font-weight:900; font-size:12px; }
.legal-content h2 { margin:2px 0 10px; font-size:clamp(20px,3vw,28px); }
.legal-content p,.legal-content li { color:var(--muted); line-height:1.72; }
.legal-content p { margin:0 0 12px; }
.legal-content p:last-child { margin-bottom:0; }
.legal-content ul { margin:0; padding-left:20px; display:grid; gap:9px; }

.cookie-banner[hidden],.cookie-modal[hidden],.cookie-modal-backdrop[hidden] { display:none!important; }
.cookie-banner { position:fixed; z-index:10000; left:18px; right:18px; bottom:18px; width:min(1120px,calc(100% - 36px)); margin:auto; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:22px; align-items:center; padding:20px; border:1px solid color-mix(in srgb,var(--primary) 25%,var(--line)); border-radius:20px; background:color-mix(in srgb,var(--surface) 96%,transparent); box-shadow:0 24px 70px rgba(0,0,0,.30); backdrop-filter:blur(20px); }
.cookie-kicker { color:var(--primary); font-size:10px; font-weight:900; letter-spacing:.14em; }
.cookie-banner h2,.cookie-modal h2 { margin:4px 0 7px; font-size:22px; }
.cookie-banner p,.cookie-modal p { margin:0; color:var(--muted); line-height:1.55; font-size:13px; }
.cookie-banner-links { display:flex; gap:14px; margin-top:8px; }
.cookie-banner-links a { color:var(--primary); font-weight:800; font-size:12px; }
.cookie-banner-actions,.cookie-modal footer { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.cookie-button { min-height:44px; padding:0 15px; border-radius:11px; border:1px solid var(--line); font:inherit; font-size:13px; font-weight:850; cursor:pointer; }
.cookie-button-primary { background:var(--primary); border-color:var(--primary); color:#fff; }
.cookie-button-secondary { background:var(--surface-2); color:var(--text); }
.cookie-button-ghost { background:transparent; color:var(--text); }
.cookie-modal-backdrop { position:fixed; z-index:10010; inset:0; background:rgba(0,0,0,.56); backdrop-filter:blur(4px); }
.cookie-modal { position:fixed; z-index:10020; left:50%; top:50%; transform:translate(-50%,-50%); width:min(620px,calc(100% - 30px)); max-height:min(760px,calc(100vh - 30px)); overflow:auto; padding:22px; border:1px solid var(--line); border-radius:22px; background:var(--surface); box-shadow:0 28px 90px rgba(0,0,0,.42); }
.cookie-modal > header { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; padding-bottom:16px; }
.cookie-modal-close { width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--surface-2);color:var(--text);font-size:24px;cursor:pointer; }
.cookie-category { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:center; padding:16px 0; border-top:1px solid var(--line); cursor:pointer; }
.cookie-category strong { display:block; margin-bottom:4px; }
.cookie-category.is-required span { color:var(--good); font-size:12px; font-weight:900; }
.cookie-category input { position:absolute; opacity:0; pointer-events:none; }
.cookie-category i { width:48px;height:27px;border-radius:999px;background:var(--line-strong);position:relative;transition:.2s; }
.cookie-category i::after { content:"";position:absolute;width:21px;height:21px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 2px 6px rgba(0,0,0,.25); }
.cookie-category input:checked + i { background:var(--primary); }
.cookie-category input:checked + i::after { transform:translateX(21px); }
.cookie-modal footer { padding-top:18px; border-top:1px solid var(--line); }
.cookie-modal-open { overflow:hidden; }
.footer-meta button[data-cookie-settings],.footer-nav-grid button[data-cookie-settings] { border:0; background:transparent; color:inherit; padding:0; font:inherit; cursor:pointer; text-align:left; }

@media(max-width:820px){
  .legal-layout{grid-template-columns:1fr}.legal-toc{position:static;display:flex;overflow:auto;white-space:nowrap}.legal-content article{grid-template-columns:36px minmax(0,1fr);gap:12px}.cookie-banner{grid-template-columns:1fr}.cookie-banner-actions{justify-content:stretch}.cookie-button{flex:1 1 150px}.auth-footer{gap:10px}.auth-footer nav{justify-content:center}.auth-field-grid{grid-template-columns:1fr!important}.auth-field>span,.auth-field-note{min-height:0}
}
@media(max-width:520px){
  main > section:not(.hero):not(.feature-strip){margin-block:44px}.cookie-banner{left:10px;right:10px;bottom:10px;width:calc(100% - 20px);padding:16px;border-radius:16px}.cookie-banner-actions{display:grid}.cookie-button{width:100%}.cookie-modal{padding:18px}.legal-page{width:min(100% - 28px,1240px)}.legal-content article{padding:18px}.verification-card{padding:26px 18px}
}

/* =========================================================
   CYBEROCENA v7.24 — stable dark theme, tighter rhythm, privacy UX
   ========================================================= */
:root { color-scheme: dark; }
:root[data-theme="light"] { color-scheme: light; }
html:not([data-theme]) { background:#07101d; color:#edf5ff; }

/* Tighter, consistent public-page rhythm */
.hero { padding-top: clamp(42px, 6vw, 76px) !important; padding-bottom: clamp(58px, 7vw, 92px) !important; }
.section-head, .legal-hero, .listing-hero, .account-benefits-hero { margin-bottom: clamp(22px, 3vw, 38px) !important; }
.knowledge-section, .platform-section, .api-section, .account-conversion-section, .account-benefits-section, .about-section, .legal-page { padding-top: clamp(42px, 5.5vw, 76px) !important; padding-bottom: clamp(42px, 5.5vw, 76px) !important; }
.legal-content { gap: clamp(16px, 2vw, 24px) !important; }
.legal-content article { padding: clamp(20px, 3vw, 32px) !important; }
.legal-inline-action { display:inline-flex; align-items:center; min-height:42px; margin-top:14px; padding:0 16px; border:1px solid color-mix(in srgb,var(--primary) 35%,var(--line)); border-radius:11px; color:var(--primary); font-weight:800; text-decoration:none; }
.legal-inline-action:hover { background:color-mix(in srgb,var(--primary) 9%,transparent); }

@media (max-width:760px) {
  .hero { padding-top:32px !important; padding-bottom:58px !important; }
  .knowledge-section, .platform-section, .api-section, .account-conversion-section, .account-benefits-section, .about-section, .legal-page { padding-top:34px !important; padding-bottom:34px !important; }
  .legal-content article { padding:18px !important; }
}

/* Cyberocena v7.25 — komunikat serwisowy */
.platform-maintenance-banner{max-width:1280px;margin:16px auto;padding:12px 16px;display:flex;gap:10px;align-items:flex-start;border-radius:14px;border:1px solid rgba(245,158,11,.3);background:rgba(245,158,11,.10);color:var(--text);box-shadow:0 10px 30px rgba(0,0,0,.08)}
.platform-maintenance-banner strong{color:#f6b84f;white-space:nowrap}.platform-maintenance-banner span{line-height:1.5}
:root[data-theme="light"] .platform-maintenance-banner{background:#fff8e8;border-color:#efd08a;color:#2a4059}
@media(max-width:760px){.platform-maintenance-banner{margin:12px 16px;flex-direction:column}.platform-maintenance-banner strong{white-space:normal}}

/* =========================================================
   Cyberocena v7.27 — compact rhythm, mobile buttons and consents
   ========================================================= */
:root {
  --section-space: clamp(32px, 3.8vw, 58px);
  --content-gap: clamp(14px, 1.7vw, 24px);
}

/* Reduce duplicated vertical whitespace between major public sections. */
main > section:not(.hero):not(.feature-strip) {
  margin-block: var(--section-space);
}
.workspace {
  padding-top: clamp(42px, 4.8vw, 66px);
  padding-bottom: clamp(52px, 5.8vw, 78px);
}
.result-section {
  margin-bottom: clamp(52px, 5.8vw, 78px);
  padding-top: clamp(42px, 4.8vw, 66px);
}
.knowledge-section,
.platform-section,
.api-section,
.account-conversion-section,
.account-benefits-section,
.about-section,
.legal-page {
  padding-top: clamp(30px, 4vw, 54px) !important;
  padding-bottom: clamp(30px, 4vw, 54px) !important;
}
.home-account-section {
  margin-top: clamp(46px, 5vw, 68px);
  margin-bottom: 24px;
  gap: clamp(30px, 4vw, 52px);
  padding: clamp(30px, 4vw, 46px);
}
.section-heading,
.section-head,
.account-section-head {
  margin-bottom: clamp(18px, 2.2vw, 28px) !important;
}
.section-heading h2,
.result-toolbar h2,
.platform-section h2,
.api-section h2,
.account-section-head h2,
.account-security h2,
.account-final-cta h2 {
  font-size: clamp(25px, 2.6vw, 38px) !important;
  line-height: 1.12 !important;
}
.legal-hero,
.listing-hero,
.safe-use-hero {
  padding-top: clamp(34px, 4.5vw, 58px) !important;
  padding-bottom: clamp(24px, 3.5vw, 44px) !important;
}
.legal-hero h1,
.listing-hero h1,
.safe-use-hero h1 {
  font-size: clamp(31px, 4.6vw, 52px) !important;
  line-height: 1.06 !important;
}

/* Consent labels remain separated from their controls at every width. */
.auth-checkbox,
.auth-card.auth-card-enterprise .auth-checkbox {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 12px !important;
  row-gap: 0 !important;
  min-width: 0;
  padding-block: 5px;
  line-height: 1.55 !important;
}
.auth-checkbox + .auth-checkbox { margin-top: 3px; }
.auth-checkbox input,
.auth-card.auth-card-enterprise .auth-checkbox input {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  margin: 2px 0 0 !important;
}
.auth-checkbox > span,
.auth-card.auth-card-enterprise .auth-checkbox > span {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* Every reusable control can shrink inside a flex or grid container. */
.button,
.scan-submit,
.mobile-scan-submit,
.auth-submit,
.auth-secondary-action,
.cookie-button,
.button-pdf,
.tool-detail-actions > a,
.account-hero-actions > a,
.account-final-actions > a {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
.button > span,
.scan-submit > span,
.mobile-scan-submit > span,
.auth-submit > span,
.button-pdf > span {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 760px) {
  :root {
    --section-space: 28px;
    --content-gap: 14px;
  }
  main > section:not(.hero):not(.feature-strip) { margin-block: 28px; }
  .hero { padding-top: 28px !important; padding-bottom: 46px !important; }
  .workspace { padding: 34px 0 50px; }
  .result-section { padding-top: 34px; margin-bottom: 50px; }
  .knowledge-section,
  .platform-section,
  .api-section,
  .account-conversion-section,
  .account-benefits-section,
  .about-section,
  .legal-page {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
  .home-account-section {
    margin-top: 36px;
    padding: 24px 18px;
    gap: 24px;
  }
  .section-heading h2,
  .result-toolbar h2,
  .platform-section h2,
  .api-section h2,
  .account-section-head h2,
  .account-security h2,
  .account-final-cta h2 {
    font-size: clamp(23px, 7vw, 30px) !important;
    line-height: 1.14 !important;
  }
  .legal-hero h1,
  .listing-hero h1,
  .safe-use-hero h1 {
    font-size: clamp(29px, 9vw, 40px) !important;
  }

  /* Long Polish labels wrap inside the button instead of escaping it. */
  .button,
  .scan-submit,
  .mobile-scan-submit,
  .auth-submit,
  .auth-secondary-action,
  .cookie-button,
  .button-pdf,
  .tool-detail-actions > a,
  .account-hero-actions > a,
  .account-final-actions > a {
    width: 100%;
    height: auto !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere;
    word-break: normal;
  }
  .button-pdf { justify-content: center; }
  .button-pdf > span { text-align: left; }
  .tool-detail-actions,
  .result-actions,
  .cookie-banner-actions,
  .cookie-modal footer,
  .account-hero-actions,
  .account-final-actions {
    width: 100%;
    min-width: 0;
  }
  .auth-checkbox,
  .auth-card.auth-card-enterprise .auth-checkbox {
    grid-template-columns: 24px minmax(0, 1fr) !important;
    column-gap: 13px !important;
    padding-block: 7px;
    font-size: 12px !important;
  }
  .auth-checkbox input,
  .auth-card.auth-card-enterprise .auth-checkbox input {
    width: 19px !important;
    height: 19px !important;
    min-width: 19px !important;
  }
}

@media (max-width: 420px) {
  .button,
  .scan-submit,
  .mobile-scan-submit,
  .auth-submit,
  .auth-secondary-action,
  .cookie-button,
  .button-pdf {
    font-size: 13px !important;
    padding-inline: 12px !important;
  }
}


/* =========================================================
   Cyberocena v7.28 — compact page start below public navigation
   ========================================================= */
.listing-page {
  padding-top: clamp(18px, 2vw, 30px) !important;
}
.listing-page > section {
  margin-block: 0 !important;
}
.listing-page > .listing-hero {
  margin-top: 0 !important;
  margin-bottom: clamp(18px, 2.2vw, 30px) !important;
  padding-top: clamp(16px, 2vw, 28px) !important;
  padding-bottom: clamp(12px, 1.8vw, 24px) !important;
}
@media (max-width: 650px) {
  .listing-page { padding-top: 12px !important; }
  .listing-page > .listing-hero {
    padding-top: 14px !important;
    padding-bottom: 10px !important;
    margin-bottom: 18px !important;
  }
}

/* v7.35 — DORA readiness public journey */
.dora-page main{display:grid;gap:30px;padding:28px clamp(18px,4vw,58px) 64px}.dora-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.75fr);gap:34px;align-items:center;min-height:610px;padding:clamp(32px,6vw,82px);border:1px solid var(--line);border-radius:30px;overflow:hidden;background:radial-gradient(circle at 12% 18%,color-mix(in srgb,#35d6b4 14%,transparent),transparent 30%),radial-gradient(circle at 82% 70%,color-mix(in srgb,#4d83ff 16%,transparent),transparent 32%),linear-gradient(145deg,color-mix(in srgb,var(--surface) 94%,#071628),var(--surface-2))}.dora-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(color-mix(in srgb,var(--line) 42%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--line) 42%,transparent) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to right,rgba(0,0,0,.65),transparent 85%)}.dora-hero>*{position:relative;z-index:1}.dora-kicker{display:inline-flex;align-items:center;gap:9px;color:#55ddb9;font-size:11px;font-weight:900;letter-spacing:.14em}.dora-kicker i{width:8px;height:8px;border-radius:50%;background:#55ddb9;box-shadow:0 0 18px #55ddb9}.dora-hero h1{max-width:820px;margin:20px 0 18px;font-size:clamp(42px,6vw,78px);line-height:.98;letter-spacing:-.055em}.dora-hero h1 em{display:block;color:#55ddb9;font-style:normal}.dora-hero-copy>p{max-width:760px;color:var(--muted);font-size:clamp(16px,1.7vw,20px);line-height:1.65}.dora-hero-actions,.dora-conversion-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:26px}.dora-assurance{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:22px;color:var(--muted);font-size:12px;font-weight:800}.dora-readiness-card{padding:22px;border:1px solid color-mix(in srgb,#55ddb9 28%,var(--line));border-radius:24px;background:color-mix(in srgb,var(--surface) 84%,transparent);box-shadow:0 30px 70px rgba(0,0,0,.25);backdrop-filter:blur(16px)}.dora-readiness-card header{display:flex;justify-content:space-between;align-items:center;padding-bottom:15px;border-bottom:1px solid var(--line);font-size:10px;font-weight:900;letter-spacing:.12em}.dora-readiness-card header b{padding:5px 9px;border-radius:999px;background:color-mix(in srgb,#55ddb9 13%,transparent);color:#55ddb9}.dora-radar{position:relative;width:190px;aspect-ratio:1;margin:25px auto;border:1px solid color-mix(in srgb,#55ddb9 45%,transparent);border-radius:50%;background:repeating-radial-gradient(circle,color-mix(in srgb,#55ddb9 16%,transparent) 0 1px,transparent 1px 32px),conic-gradient(from 30deg,color-mix(in srgb,#55ddb9 18%,transparent),transparent 24%,transparent 70%,color-mix(in srgb,#4d83ff 17%,transparent));box-shadow:inset 0 0 38px color-mix(in srgb,#55ddb9 8%,transparent)}.dora-radar:before,.dora-radar:after{content:"";position:absolute;background:color-mix(in srgb,#55ddb9 30%,transparent)}.dora-radar:before{left:50%;top:0;width:1px;height:100%}.dora-radar:after{top:50%;left:0;width:100%;height:1px}.dora-radar>span{position:absolute;inset:0;z-index:2;display:grid;place-content:center;text-align:center}.dora-radar strong{font-size:27px}.dora-radar small{color:#55ddb9;font-size:9px;letter-spacing:.14em}.dora-radar i{position:absolute;z-index:3;width:8px;height:8px;border-radius:50%;background:#55ddb9;box-shadow:0 0 15px #55ddb9}.dora-radar i:nth-of-type(1){top:27%;left:23%}.dora-radar i:nth-of-type(2){top:58%;right:18%}.dora-radar i:nth-of-type(3){bottom:18%;left:42%}.dora-readiness-card ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}.dora-readiness-card li{display:grid;grid-template-columns:36px 1fr;gap:11px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}.dora-readiness-card li>span{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:color-mix(in srgb,#4d83ff 10%,transparent);color:#72a1ff;font-size:10px;font-weight:900}.dora-readiness-card li div{display:grid;gap:2px}.dora-readiness-card li small{color:var(--muted);font-size:10px;line-height:1.4}.dora-disclaimer{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start;padding:22px 25px;border:1px solid color-mix(in srgb,#f0b84d 42%,var(--line));border-radius:20px;background:color-mix(in srgb,#f0b84d 7%,var(--surface))}.dora-disclaimer>span{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:color-mix(in srgb,#f0b84d 16%,transparent);color:#f0b84d;font-size:25px;font-weight:900}.dora-disclaimer strong{font-size:17px}.dora-disclaimer p{margin:7px 0 0;color:var(--muted);line-height:1.6}.dora-pillars,.dora-faq{padding:clamp(26px,5vw,62px) 0}.dora-section-head{max-width:820px;margin-bottom:28px}.dora-section-head h2{margin:9px 0 12px;font-size:clamp(30px,4vw,50px);line-height:1.06;letter-spacing:-.035em}.dora-section-head p{color:var(--muted);font-size:16px;line-height:1.65}.dora-pillar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.dora-pillar-grid article{position:relative;min-height:270px;padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--surface);overflow:hidden}.dora-pillar-grid article>b{position:absolute;right:18px;top:12px;color:color-mix(in srgb,var(--muted) 18%,transparent);font-size:58px;line-height:1}.dora-pillar-grid article>span{position:relative;color:#55ddb9;font-size:10px;font-weight:900;letter-spacing:.12em}.dora-pillar-grid h3{position:relative;max-width:260px;margin:34px 0 12px;font-size:23px;line-height:1.08}.dora-pillar-grid p{position:relative;color:var(--muted);font-size:13px;line-height:1.65}.dora-pillar-grid a{position:absolute;left:24px;bottom:22px;color:var(--primary);font-size:12px;font-weight:900;text-decoration:none}.dora-pillar-highlight{background:linear-gradient(145deg,color-mix(in srgb,#4d83ff 16%,var(--surface)),color-mix(in srgb,#55ddb9 9%,var(--surface)))!important;border-color:color-mix(in srgb,#4d83ff 40%,var(--line))!important}.dora-conversion{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;padding:clamp(28px,5vw,58px);border:1px solid var(--line);border-radius:28px;background:linear-gradient(135deg,color-mix(in srgb,#4d83ff 11%,var(--surface)),var(--surface))}.dora-conversion h2{margin:10px 0 14px;font-size:clamp(30px,4.2vw,54px);line-height:1.02}.dora-conversion p{color:var(--muted);font-size:15px;line-height:1.65}.dora-conversion-actions{grid-column:1/-1}.dora-conversion-list{display:grid;gap:9px}.dora-conversion-list>span{display:grid;gap:3px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface-2) 88%,transparent)}.dora-conversion-list b{font-size:13px}.dora-conversion-list small{color:var(--muted);font-size:11px}.dora-faq>div:last-child{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.dora-faq details{border:1px solid var(--line);border-radius:15px;background:var(--surface);overflow:hidden}.dora-faq summary{padding:17px 19px;font-weight:850;cursor:pointer}.dora-faq p{margin:0;padding:0 19px 19px;color:var(--muted);line-height:1.65}.home-dora-section{display:grid;grid-template-columns:1.15fr .85fr;gap:25px;align-items:center;margin:28px clamp(18px,4vw,58px);padding:clamp(28px,5vw,58px);border:1px solid color-mix(in srgb,#55ddb9 28%,var(--line));border-radius:26px;background:radial-gradient(circle at 90% 10%,color-mix(in srgb,#55ddb9 13%,transparent),transparent 38%),linear-gradient(135deg,var(--surface),var(--surface-2))}.home-dora-section h2{margin:10px 0 13px;font-size:clamp(30px,4vw,50px);line-height:1.04}.home-dora-section p{color:var(--muted);line-height:1.65}.home-dora-section-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.home-dora-map{display:grid;gap:9px}.home-dora-map>span{display:grid;grid-template-columns:38px 1fr;gap:11px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:13px;background:color-mix(in srgb,var(--surface) 85%,transparent)}.home-dora-map b{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:color-mix(in srgb,#55ddb9 12%,transparent);color:#55ddb9}.home-dora-map strong{display:block;font-size:12px}.home-dora-map small{color:var(--muted);font-size:10px}
@media(max-width:980px){.dora-hero,.dora-conversion,.home-dora-section{grid-template-columns:1fr}.dora-pillar-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dora-readiness-card{max-width:650px}.dora-conversion-actions{grid-column:auto}}
@media(max-width:650px){.dora-page main{padding-inline:14px}.dora-hero{padding:28px 20px;border-radius:22px}.dora-hero h1{font-size:40px}.dora-hero-actions .button,.dora-conversion-actions .button{width:100%;justify-content:center}.dora-pillar-grid,.dora-faq>div:last-child{grid-template-columns:1fr}.dora-disclaimer{grid-template-columns:1fr}.dora-conversion{padding:25px 20px}.home-dora-section{margin-inline:14px;padding:25px 20px}.dora-assurance{display:grid}}


/* CYBEROCENA v7.36 — compact typography, spacing, RWD and rendering */
:root{--space-page:clamp(18px,3vw,42px);--space-section:clamp(34px,5vw,64px);--space-card:clamp(16px,2vw,24px)}
html{font-size:16px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;overflow-wrap:anywhere}
h1,h2,h3{max-width:100%;text-wrap:balance;overflow-wrap:anywhere}
p,li,dd{max-width:78ch}
button,a,input,select,textarea{touch-action:manipulation}
.topbar{height:68px;gap:26px;padding-inline:max(18px,calc((100vw - var(--max))/2))}.main-nav{gap:22px}.main-nav a{font-size:13px}.brand strong{font-size:17px}
.hero{min-height:540px;padding:52px 22px 62px}.hero h1{max-width:820px;margin-block:15px;font-size:clamp(36px,4.4vw,58px);line-height:1.04;letter-spacing:-.04em}.hero>.hero-content>p{font-size:clamp(15px,1.35vw,17px);line-height:1.62}.scan-bar{margin-top:27px}.hero-metrics{margin-top:32px}
.section-heading{margin-bottom:20px}.section-heading h2,.result-toolbar h2,.platform-section h2,.api-section h2,.knowledge-heading h2{font-size:clamp(25px,2.8vw,38px);letter-spacing:-.03em}.section-heading p,.knowledge-heading p{font-size:15px;line-height:1.6}
.workspace{gap:28px;padding-block:56px 72px}.result-section{margin-bottom:64px;padding-top:50px}.knowledge-section,.platform-section,.api-section{margin-bottom:64px}.knowledge-section{padding:32px}.knowledge-heading{margin-bottom:24px}.knowledge-card{min-height:230px;padding:22px}.platform-section{min-height:0;gap:44px;padding:42px}.platform-points{margin-top:24px;gap:16px}.api-section{gap:36px;padding:36px 40px}
.home-account-section,.home-dora-section{margin-block:20px;padding:clamp(24px,3.7vw,42px)}.home-dora-section h2{font-size:clamp(25px,3vw,38px);line-height:1.1}.home-dora-section-actions{margin-top:16px}
.dora-page main{gap:20px;padding:20px var(--space-page) 48px}.dora-hero{min-height:0;grid-template-columns:minmax(0,1.12fr) minmax(300px,.78fr);gap:24px;padding:clamp(28px,4vw,52px);border-radius:24px}.dora-hero h1{max-width:720px;margin:15px 0 14px;font-size:clamp(34px,4.2vw,56px);line-height:1.04;letter-spacing:-.045em}.dora-hero h1 em{display:inline}.dora-hero-copy>p{font-size:clamp(15px,1.35vw,17px);line-height:1.6}.dora-hero-actions,.dora-conversion-actions{margin-top:20px}.dora-assurance{margin-top:16px}.dora-readiness-card{padding:18px;border-radius:19px}.dora-radar{width:162px;margin:19px auto}.dora-disclaimer{padding:18px 20px;border-radius:16px}.dora-pillars,.dora-faq{padding:34px 0}.dora-section-head{margin-bottom:20px}.dora-section-head h2,.dora-conversion h2{font-size:clamp(25px,3vw,39px);line-height:1.1}.dora-section-head p{font-size:15px}.dora-pillar-grid{gap:12px}.dora-pillar-grid article{min-height:245px;padding:20px}.dora-pillar-grid h3{margin-top:28px;font-size:20px}.dora-pillar-grid a{left:20px;bottom:18px}.dora-conversion{gap:20px;padding:clamp(24px,3.6vw,42px);border-radius:22px}
.legal-page{width:min(1280px,calc(100% - 36px));padding:46px 0 64px!important}.legal-hero{padding-bottom:28px}.legal-hero h1{font-size:clamp(30px,4vw,48px);line-height:1.08}.legal-hero>p{font-size:16px;line-height:1.65}.legal-layout{gap:30px}.legal-content{gap:16px!important}.legal-content article{padding:20px!important;border-radius:15px}.legal-content h2{font-size:clamp(19px,2.2vw,25px)}.legal-table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.legal-data-table{min-width:720px}.legal-data-table th,.legal-data-table td{padding:11px 12px;vertical-align:top;border-bottom:1px solid var(--line);font-size:13px;line-height:1.5}.legal-data-table th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}
.article-page{padding:88px 0 64px}.article-header h1{font-size:clamp(30px,3.2vw,46px)}.article-body{margin-top:36px}.article-cta{margin-top:42px;padding:24px}
.auth-card h1,.auth-card-enterprise h1{font-size:clamp(27px,4vw,38px)!important;line-height:1.12!important}.auth-card-enterprise{gap:14px!important;padding:clamp(22px,4vw,32px)!important}
.cookie-banner{gap:20px}.cookie-banner h2,.cookie-modal h2{font-size:clamp(20px,2.4vw,27px)}
@media(max-width:1100px){.main-nav{gap:15px}.main-nav a{font-size:12px}.workspace{grid-template-columns:210px minmax(0,1fr)}.platform-section,.api-section{grid-template-columns:1fr}.platform-visual{min-height:320px}}
@media(max-width:900px){.topbar{height:66px;padding-inline:16px}.hero{min-height:0;padding:42px 18px 50px}.hero h1{font-size:clamp(34px,7vw,48px)}.workspace{padding-block:38px 54px}.result-section{padding-top:38px}.knowledge-section,.platform-section,.api-section{margin-left:16px!important;margin-right:16px!important;padding:25px}.dora-hero{grid-template-columns:1fr}.dora-readiness-card{max-width:none}.legal-layout{grid-template-columns:1fr}.legal-toc{position:static;display:flex;gap:7px;overflow-x:auto;padding-bottom:8px;scrollbar-width:thin}.legal-toc strong{display:none}.legal-toc a{flex:0 0 auto;white-space:nowrap}}
@media(max-width:650px){.topbar{height:62px}.brand strong{font-size:15px}.hero{padding:32px 14px 42px}.hero h1{font-size:clamp(30px,9vw,39px);letter-spacing:-.035em}.hero>.hero-content>p{font-size:15px}.scan-bar{margin-top:21px}.hero-account-path{margin-top:16px}.workspace,.result-section{margin-left:12px!important;margin-right:12px!important}.tool-content,.knowledge-section,.platform-section,.api-section{padding:18px}.section-heading h2,.result-toolbar h2,.platform-section h2,.api-section h2,.knowledge-heading h2{font-size:clamp(23px,7vw,30px)}.dora-page main{padding-inline:12px}.dora-hero{padding:23px 17px;border-radius:18px}.dora-hero h1{font-size:clamp(29px,9vw,36px);line-height:1.08}.dora-hero-copy>p{font-size:15px}.dora-readiness-card{padding:15px}.dora-radar{width:138px}.dora-pillars,.dora-faq{padding:25px 0}.dora-section-head h2,.dora-conversion h2,.home-dora-section h2{font-size:clamp(23px,7.4vw,30px)}.dora-pillar-grid article{min-height:225px}.dora-disclaimer{grid-template-columns:40px 1fr;gap:12px;padding:15px}.dora-disclaimer>span{width:38px;height:38px;font-size:20px}.legal-page{width:calc(100% - 24px);padding:32px 0 46px!important}.legal-hero h1{font-size:clamp(27px,8vw,36px)}.legal-content article{grid-template-columns:32px minmax(0,1fr);gap:11px;padding:16px!important}.legal-content article>span{font-size:11px}.legal-data-table{min-width:640px}.cookie-banner-actions,.cookie-modal footer{grid-template-columns:1fr!important}.cookie-button{width:100%}input,select,textarea{font-size:16px!important}}
@media(max-width:420px){.dora-disclaimer{grid-template-columns:1fr}.dora-hero-actions .button,.dora-conversion-actions .button,.home-dora-section-actions .button{width:100%}.hero h1{font-size:30px}.legal-content article{grid-template-columns:1fr}.legal-content article>span{width:max-content}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-orb,.pulse-dot,.progress-orbit,.dora-radar{animation:none!important}.button,.tool-card,.knowledge-card,.enterprise-card,a,button{transition:none!important}}


/* =========================================================
   Cyberocena v7.37 — compact public catalog pages
   Prevents legacy section rhythm from creating oversized empty areas.
   ========================================================= */
.listing-page.listing-page--compact {
  display: block !important;
  width: 100% !important;
  max-width: 1840px !important;
  margin: 0 auto !important;
  padding: 0 clamp(18px, 2.2vw, 34px) 56px !important;
}
.listing-page--compact > .listing-hero {
  display: block !important;
  width: 100% !important;
  max-width: 1080px !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 28px 0 22px !important;
}
.listing-page--compact > .listing-hero .section-kicker {
  display: inline-flex !important;
  margin: 0 0 7px !important;
}
.listing-page--compact > .listing-hero h1 {
  max-width: 980px !important;
  margin: 7px 0 10px !important;
  font-size: clamp(34px, 4vw, 54px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.04em !important;
}
.listing-page--compact > .listing-hero p {
  max-width: 880px !important;
  margin: 0 !important;
  font-size: clamp(15px, 1.3vw, 18px) !important;
  line-height: 1.55 !important;
}
.listing-page--compact > .tools-catalog,
.listing-page--compact > .article-catalog {
  margin: 0 !important;
  padding: 0 !important;
  gap: 14px !important;
}
.tools-directory-page .catalog-tool-card {
  min-height: 258px !important;
  padding: 20px 22px !important;
  border-radius: 20px !important;
}
.tools-directory-page .catalog-tool-card h2 {
  margin: 12px 0 8px !important;
  font-size: clamp(19px, 1.45vw, 23px) !important;
  line-height: 1.2 !important;
}
.tools-directory-page .catalog-tool-card p {
  margin: 0 0 17px !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  -webkit-line-clamp: 5 !important;
}
.tools-directory-page .catalog-tool-card strong {
  font-size: 14px !important;
}
.knowledge-directory-page .knowledge-card-full {
  min-height: 260px !important;
  padding: 21px !important;
  border-radius: 20px !important;
}
.knowledge-directory-page .knowledge-card-full h2 {
  margin: 12px 0 8px !important;
  font-size: clamp(20px, 1.5vw, 24px) !important;
}
.knowledge-directory-page .knowledge-card-full p {
  margin-bottom: 17px !important;
  font-size: 14px !important;
  line-height: 1.58 !important;
}
@media (max-width: 1000px) {
  .listing-page.listing-page--compact {
    padding-inline: 20px !important;
  }
  .listing-page--compact > .listing-hero {
    padding-top: 24px !important;
    padding-bottom: 19px !important;
  }
}
@media (max-width: 650px) {
  .listing-page.listing-page--compact {
    margin-inline: 0 !important;
    padding: 0 12px 42px !important;
  }
  .listing-page--compact > .listing-hero {
    padding: 20px 2px 16px !important;
  }
  .listing-page--compact > .listing-hero h1 {
    margin-top: 5px !important;
    margin-bottom: 8px !important;
    font-size: clamp(29px, 9vw, 38px) !important;
  }
  .listing-page--compact > .listing-hero p {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
  .listing-page--compact > .tools-catalog,
  .listing-page--compact > .article-catalog {
    gap: 11px !important;
  }
  .tools-directory-page .catalog-tool-card,
  .knowledge-directory-page .knowledge-card-full {
    min-height: 0 !important;
    padding: 18px !important;
    border-radius: 17px !important;
  }
}


/* =========================================================
   Cyberocena v7.38 — compact DORA page rhythm
   ========================================================= */
.dora-page main{gap:13px!important;padding:12px clamp(14px,2.5vw,34px) 38px!important}
.dora-page .dora-hero{gap:18px!important;padding:clamp(22px,3vw,38px)!important;border-radius:21px!important}
.dora-page .dora-hero h1{margin:11px 0 11px!important;font-size:clamp(32px,3.7vw,50px)!important;line-height:1.06!important}
.dora-page .dora-hero-copy>p{line-height:1.55!important}
.dora-page .dora-hero-actions{margin-top:16px!important}
.dora-page .dora-assurance{margin-top:12px!important}
.dora-page .dora-readiness-card{padding:15px!important;border-radius:17px!important}
.dora-page .dora-readiness-card header{padding-bottom:11px!important}
.dora-page .dora-radar{width:140px!important;margin:14px auto!important}
.dora-page .dora-readiness-card ul{gap:7px!important}
.dora-page .dora-readiness-card li{padding:8px!important}
.dora-page .dora-disclaimer{gap:12px!important;padding:15px 17px!important;border-radius:15px!important}
.dora-page .dora-disclaimer>span{width:40px!important;height:40px!important;border-radius:12px!important;font-size:21px!important}
.dora-page .dora-pillars,
.dora-page .dora-faq{padding:22px 0!important}
.dora-page .dora-section-head{margin-bottom:15px!important}
.dora-page .dora-section-head h2{margin:7px 0 9px!important}
.dora-page .dora-pillar-grid{gap:10px!important}
.dora-page .dora-pillar-grid article{min-height:225px!important;padding:18px!important;border-radius:17px!important}
.dora-page .dora-pillar-grid h3{margin:24px 0 9px!important;font-size:19px!important}
.dora-page .dora-pillar-grid a{left:18px!important;bottom:16px!important}
.dora-page .dora-conversion{gap:15px!important;padding:clamp(20px,3vw,32px)!important;border-radius:19px!important}
.dora-page .dora-conversion h2{margin:7px 0 10px!important}
.dora-page .dora-conversion-actions{margin-top:14px!important}
.dora-page .dora-conversion-list{gap:7px!important}
.dora-page .dora-conversion-list>span{padding:11px 13px!important}
.dora-page .dora-faq>div:last-child{gap:8px!important}
.dora-page .dora-faq summary{padding:14px 16px!important}
.dora-page .dora-faq p{padding:0 16px 16px!important}
@media(max-width:900px){
  .dora-page main{padding-top:9px!important}
  .dora-page .dora-hero{padding:20px!important}
}
@media(max-width:650px){
  .dora-page main{gap:10px!important;padding:7px 10px 30px!important}
  .dora-page .dora-hero{gap:16px!important;padding:18px 15px!important;border-radius:16px!important}
  .dora-page .dora-hero h1{font-size:clamp(28px,8.5vw,34px)!important}
  .dora-page .dora-readiness-card{padding:13px!important}
  .dora-page .dora-radar{width:124px!important;margin:11px auto!important}
  .dora-page .dora-pillars,
  .dora-page .dora-faq{padding:17px 0!important}
  .dora-page .dora-pillar-grid article{min-height:205px!important;padding:16px!important}
  .dora-page .dora-conversion{padding:19px 16px!important}
}


/* v7.38 final rhythm guard — DORA sections must not inherit global section margins */
.dora-page main>section{margin:0!important}


/* =========================================================
   Cyberocena v7.40 — compact enterprise footer
   ========================================================= */
.footer.footer-compact,
.footer.footer-compact * { box-sizing: border-box; }

.footer.footer-compact {
  width: 100%;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 28px max(22px, calc((100vw - var(--max)) / 2)) 16px !important;
  display: block !important;
  color: #dce9fa !important;
  background:
    radial-gradient(circle at 88% 0%, rgba(31, 177, 184, .075), transparent 24%),
    linear-gradient(135deg, #041024 0%, #06172e 58%, #07192d 100%) !important;
  border-top: 1px solid rgba(88, 151, 227, .16) !important;
}

.footer-compact-main {
  width: min(var(--max), 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(220px, .78fr) minmax(0, 1.62fr);
  gap: clamp(28px, 4vw, 64px);
  align-items: start;
}

.footer.footer-compact .footer-brand-block {
  min-width: 0;
  padding: 0 !important;
  display: grid;
  align-content: start;
  gap: 11px;
}

.footer.footer-compact .footer-brand {
  width: max-content;
  max-width: 100%;
  color: inherit;
  text-decoration: none;
}

.footer.footer-compact .footer-brand strong { color: #f5f9ff !important; }
.footer.footer-compact .footer-brand small { color: #7f97b4 !important; }

.footer.footer-compact .footer-brand-block > p {
  max-width: 315px !important;
  margin: 0 !important;
  color: #91a7c1 !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
}

.footer-safety-note {
  width: fit-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 11px;
  border-radius: 12px;
  color: #dffbf7;
  background: rgba(20, 164, 153, .09);
  border: 1px solid rgba(64, 199, 186, .16);
  text-decoration: none;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.footer-safety-note:hover,
.footer-safety-note:focus-visible {
  color: #fff;
  background: rgba(20, 164, 153, .15);
  border-color: rgba(83, 220, 206, .28);
  transform: translateY(-1px);
  outline: none;
}

.footer-safety-note svg {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.footer-safety-note span { min-width: 0; display: grid; gap: 1px; }
.footer-safety-note strong { color: inherit; font-size: 11px; line-height: 1.3; }
.footer-safety-note small { color: #8faec0; font-size: 9px; line-height: 1.35; }

.footer-compact-nav {
  min-width: 0;
  display: grid;
  grid-template-columns: 1.12fr 1.12fr .9fr;
  gap: clamp(22px, 3vw, 44px);
  padding-top: 2px;
}

.footer-compact-nav > div {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 7px;
}

.footer-compact-nav strong {
  margin-bottom: 4px;
  color: #f0f6ff;
  font-size: 10px;
  line-height: 1.4;
  text-transform: uppercase;
  letter-spacing: .11em;
}

.footer-compact-nav a,
.footer-action-form button {
  width: fit-content;
  max-width: 100%;
  padding: 1px 0;
  color: #8fa6c1;
  background: transparent;
  border: 0;
  font: inherit;
  font-size: 12px;
  line-height: 1.45;
  text-align: left;
  text-decoration: none;
  overflow-wrap: anywhere;
  cursor: pointer;
}

.footer-compact-nav a:hover,
.footer-compact-nav a:focus-visible,
.footer-action-form button:hover,
.footer-action-form button:focus-visible {
  color: #6ecaff;
  outline: none;
}

.footer-action-form { margin: 0; }

.footer-compact-bottom {
  width: min(var(--max), 100%);
  margin: 22px auto 0;
  padding-top: 13px;
  display: grid;
  grid-template-columns: auto minmax(220px, 1fr) auto;
  align-items: center;
  gap: 18px;
  border-top: 1px solid rgba(104, 151, 210, .12);
}

.footer-legal-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 14px;
}

.footer-legal-links a,
.footer-legal-links button {
  padding: 0;
  color: #859bb5;
  background: transparent;
  border: 0;
  font: inherit;
  font-size: 10px;
  line-height: 1.45;
  text-decoration: none;
  cursor: pointer;
}

.footer-legal-links a:hover,
.footer-legal-links a:focus-visible,
.footer-legal-links button:hover,
.footer-legal-links button:focus-visible {
  color: #6ecaff;
  outline: none;
}

.footer.footer-compact .footer-compact-bottom > p {
  max-width: 720px !important;
  margin: 0 auto !important;
  color: #7188a4 !important;
  font-size: 9px !important;
  line-height: 1.5 !important;
  text-align: center;
}

.footer-compact-bottom > span {
  min-width: max-content;
  color: #7188a4;
  font-size: 10px;
}

:root[data-theme="light"] .footer.footer-compact {
  color: #17334f !important;
  background:
    radial-gradient(circle at 88% 0%, rgba(27, 171, 190, .055), transparent 24%),
    linear-gradient(135deg, #f8fbff 0%, #eff6fb 58%, #edf7f7 100%) !important;
  border-top-color: rgba(15, 42, 68, .11) !important;
}

:root[data-theme="light"] .footer.footer-compact .footer-brand strong,
:root[data-theme="light"] .footer-compact-nav strong { color: #102a43 !important; }

:root[data-theme="light"] .footer.footer-compact .footer-brand small,
:root[data-theme="light"] .footer.footer-compact .footer-brand-block > p,
:root[data-theme="light"] .footer-compact-nav a,
:root[data-theme="light"] .footer-action-form button,
:root[data-theme="light"] .footer-legal-links a,
:root[data-theme="light"] .footer-legal-links button,
:root[data-theme="light"] .footer.footer-compact .footer-compact-bottom > p,
:root[data-theme="light"] .footer-compact-bottom > span { color: #5d748c !important; }

:root[data-theme="light"] .footer-safety-note {
  color: #126e69;
  background: rgba(23, 154, 145, .065);
  border-color: rgba(23, 154, 145, .14);
}

:root[data-theme="light"] .footer-safety-note small { color: #587f82; }
:root[data-theme="light"] .footer-compact-bottom { border-top-color: rgba(15, 42, 68, .09); }

@media (max-width: 900px) {
  .footer-compact-main { grid-template-columns: 1fr; gap: 24px; }
  .footer.footer-compact .footer-brand-block { grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 20px; }
  .footer.footer-compact .footer-brand-block > p { grid-column: 1; max-width: 540px !important; }
  .footer-safety-note { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .footer-compact-bottom { grid-template-columns: 1fr auto; }
  .footer.footer-compact .footer-compact-bottom > p { grid-column: 1 / -1; grid-row: 2; max-width: none !important; text-align: left; }
}

@media (max-width: 640px) {
  .footer.footer-compact { padding: 23px 16px 15px !important; }
  .footer.footer-compact .footer-brand-block { grid-template-columns: 1fr; gap: 9px; }
  .footer.footer-compact .footer-brand-block > p { grid-column: 1; }
  .footer-safety-note { grid-column: 1; grid-row: auto; }
  .footer-compact-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 18px; }
  .footer-compact-nav > div:last-child { grid-column: 1 / -1; padding-top: 16px; border-top: 1px solid rgba(104, 151, 210, .11); }
  .footer-compact-bottom { margin-top: 19px; grid-template-columns: 1fr; gap: 10px; align-items: start; }
  .footer-legal-links { gap: 7px 13px; }
  .footer.footer-compact .footer-compact-bottom > p { grid-column: 1; grid-row: auto; text-align: left; }
  .footer-compact-bottom > span { min-width: 0; }
}

@media (max-width: 420px) {
  .footer-compact-nav { grid-template-columns: 1fr; gap: 0; }
  .footer-compact-nav > div,
  .footer-compact-nav > div:last-child {
    grid-column: 1;
    padding: 0 0 14px;
    margin: 0 0 14px;
    border-top: 0;
    border-bottom: 1px solid rgba(104, 151, 210, .11);
  }
  .footer-compact-nav > div:last-child { margin-bottom: 0; border-bottom: 0; }
}

/* v7.40 footer layout guard — prevent intrinsic 760 px placeholder and legacy grid areas. */
.footer.footer-compact {
  content-visibility: visible !important;
  contain-intrinsic-size: none !important;
  align-items: initial !important;
  justify-items: initial !important;
}
.footer.footer-compact .footer-brand-block { grid-area: auto !important; }

/* v7.40 mobile footer density — keep useful links in two columns on standard phones. */
@media (max-width: 420px) {
  .footer-compact-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px 16px !important;
  }
  .footer-compact-nav > div,
  .footer-compact-nav > div:last-child {
    grid-column: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }
  .footer-compact-nav > div:last-child {
    grid-column: 1 / -1 !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(104, 151, 210, .11) !important;
  }
}
@media (max-width: 340px) {
  .footer-compact-nav { grid-template-columns: 1fr !important; gap: 0 !important; }
  .footer-compact-nav > div,
  .footer-compact-nav > div:last-child {
    grid-column: 1 !important;
    padding: 0 0 13px !important;
    margin: 0 0 13px !important;
    border-top: 0 !important;
    border-bottom: 1px solid rgba(104, 151, 210, .11) !important;
  }
  .footer-compact-nav > div:last-child { margin-bottom: 0 !important; border-bottom: 0 !important; }
}

/* =========================================================
   CYBEROCENA v7.41 — managed configuration and compact About
   ========================================================= */
.managed-config-center {
  margin-bottom: 18px;
  padding: clamp(18px, 2.4vw, 28px);
}
.managed-config-header {
  align-items: flex-start !important;
  gap: 18px;
}
.managed-config-header code,
.managed-config-center code {
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-2);
  color: var(--text);
  font-size: .9em;
}
.managed-config-security {
  flex: 0 0 auto;
  padding: 8px 11px;
  border: 1px solid color-mix(in srgb, var(--good) 24%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--good) 7%, var(--surface));
  color: var(--good);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}
.managed-config-overview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0;
}
.managed-config-overview > div {
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-2) 80%, transparent);
}
.managed-config-overview strong,
.managed-config-overview span,
.managed-config-overview small { display: block; }
.managed-config-overview strong { font-size: 17px; line-height: 1.2; overflow-wrap: anywhere; }
.managed-config-overview span { margin-top: 5px; color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.managed-config-overview small { margin-top: 6px; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.managed-config-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .30fr);
  gap: 16px;
  align-items: start;
}
.managed-config-groups { display: grid; gap: 10px; }
.managed-config-group {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface) 90%, transparent);
}
.managed-config-group > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 70px;
  padding: 14px 17px;
  cursor: pointer;
  list-style: none;
}
.managed-config-group > summary::-webkit-details-marker { display: none; }
.managed-config-group > summary span { display: grid; gap: 3px; min-width: 0; }
.managed-config-group > summary small { color: var(--primary); font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.managed-config-group > summary strong { font-size: 16px; }
.managed-config-group > summary em { color: var(--muted); font-size: 12px; font-style: normal; line-height: 1.45; }
.managed-config-group > summary b {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  border: 1px solid var(--line);
  border-radius: 9px;
  font-size: 18px;
  transition: transform .2s ease;
}
.managed-config-group[open] > summary b { transform: rotate(45deg); }
.managed-config-group-body { padding: 0 17px 17px; border-top: 1px solid var(--line); }
.managed-config-form { padding-top: 16px; }
.managed-config-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.managed-config-field {
  min-width: 0;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-2);
}
.managed-config-field > label:not(.enterprise-switch-row) { display: grid; gap: 7px; }
.managed-config-field > label > span { color: var(--text); font-size: 12px; font-weight: 850; }
.managed-config-field input:not([type="checkbox"]),
.managed-config-field select {
  width: 100%;
  min-height: 42px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 14px;
}
.managed-config-field > p { margin: 8px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.managed-config-field.is-switch { grid-column: 1 / -1; padding: 0; background: transparent; }
.managed-config-field.is-switch .enterprise-switch-row { margin: 0; padding: 13px; border-radius: 13px; background: var(--surface-2); }
.managed-config-field.is-secret { border-color: color-mix(in srgb, var(--primary) 20%, var(--line)); }
.managed-secret-status {
  display: grid;
  gap: 5px;
  margin-top: 9px;
  padding: 9px 10px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--primary) 6%, var(--surface));
  font-size: 11px;
}
.managed-secret-status > span { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-weight: 800; letter-spacing: .04em; }
.managed-secret-status small { color: var(--muted); }
.managed-secret-status label { display: flex; align-items: flex-start; gap: 7px; color: var(--muted); line-height: 1.45; }
.managed-config-source {
  display: inline-flex;
  margin-top: 9px;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.managed-config-source.source-panel { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 28%, var(--line)); }
.managed-config-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 14px;
}
.managed-config-actions small { max-width: 480px; color: var(--muted); font-size: 10px; line-height: 1.45; }
.managed-config-reset { margin-top: 12px; border-top: 1px dashed var(--line); padding-top: 10px; }
.managed-config-reset > summary { cursor: pointer; color: var(--muted); font-size: 11px; font-weight: 800; }
.managed-config-reset form { display: flex; align-items: end; gap: 10px; margin-top: 10px; }
.managed-config-reset label { display: grid; gap: 5px; min-width: 220px; }
.managed-config-reset label span { font-size: 10px; font-weight: 800; }
.managed-config-reset input { min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--text); }
.managed-config-protected { position: sticky; top: 82px; padding: 17px; }
.managed-config-protected h3 { margin: 3px 0 5px; font-size: 17px; }
.managed-config-protected header p { font-size: 11px !important; line-height: 1.5 !important; }
.managed-config-protected-list { display: grid; gap: 7px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }
.managed-config-protected-list strong { font-size: 11px; }
.managed-config-protected-list span { color: var(--muted); font-size: 10px; line-height: 1.4; }

/* O portalu: krótszy hero i spójny, gęstszy rytm sekcji. */
.about-page .about-hero {
  min-height: 0 !important;
  gap: clamp(34px, 5vw, 70px) !important;
  padding: 42px 0 50px !important;
}
.about-page .about-hero h1 { margin: 14px 0 16px !important; font-size: clamp(40px, 4.5vw, 60px) !important; }
.about-page .about-hero-actions { margin-top: 20px !important; }
.about-page .about-trust-list { margin-top: 16px !important; }
.about-page .about-radar { width: min(380px, 100%) !important; }
.about-page .about-intro { gap: 42px !important; padding: 42px 0 !important; }
.about-page .about-feature-grid { padding-bottom: 48px !important; }
.about-page .about-feature-card { min-height: 220px !important; padding: 21px !important; }
.about-page .about-feature-card h2 { margin-top: 16px !important; }
.about-page .about-process { padding: 38px !important; }
.about-page .about-process-grid { margin-top: 26px !important; }
.about-page .about-checks { gap: 46px !important; padding: 54px 0 !important; }
.about-page .about-enterprise { gap: 46px !important; padding: 40px !important; }
.about-page .about-safety { margin-block: 42px 56px !important; padding: 24px !important; }

@media (max-width: 1100px) {
  .managed-config-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .managed-config-layout { grid-template-columns: 1fr; }
  .managed-config-protected { position: static; }
}
@media (max-width: 760px) {
  .managed-config-center { padding: 14px; }
  .managed-config-header { display: grid !important; }
  .managed-config-security { width: fit-content; white-space: normal; }
  .managed-config-overview { grid-template-columns: 1fr 1fr; }
  .managed-config-field-grid { grid-template-columns: 1fr; }
  .managed-config-field.is-switch { grid-column: auto; }
  .managed-config-actions { align-items: stretch; flex-direction: column; }
  .managed-config-actions .enterprise-primary-action { width: 100%; }
  .managed-config-reset form { align-items: stretch; flex-direction: column; }
  .managed-config-reset label { min-width: 0; }
  .about-page .about-hero { padding: 28px 0 34px !important; gap: 26px !important; }
  .about-page .about-hero h1 { font-size: clamp(34px, 10vw, 44px) !important; }
  .about-page .about-intro { padding: 30px 0 !important; gap: 16px !important; }
  .about-page .about-feature-grid { padding-bottom: 34px !important; }
  .about-page .about-process { padding: 23px 18px !important; }
  .about-page .about-checks { padding: 38px 0 !important; gap: 22px !important; }
  .about-page .about-enterprise { padding: 24px 18px !important; gap: 28px !important; }
  .about-page .about-safety { margin-block: 34px 44px !important; padding: 19px !important; }
}
@media (max-width: 430px) {
  .managed-config-overview { grid-template-columns: 1fr; }
  .managed-config-group > summary { padding: 13px; }
  .managed-config-group-body { padding: 0 13px 13px; }
}


/* Cyberocena v7.42 — jawny zapis konfiguracji i szybki zapis klucza NVD. */
.managed-config-quick-key {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr);
  gap: 22px;
  margin: 16px 0;
  padding: 19px;
  border: 1px solid color-mix(in srgb, var(--primary) 30%, var(--line));
  border-radius: 14px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 9%, var(--surface)), var(--surface));
}
.managed-config-quick-copy h3 { margin: 4px 0 7px; font-size: 19px; }
.managed-config-quick-copy p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.managed-config-quick-status {
  display: inline-flex;
  margin-top: 12px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
}
.managed-config-quick-status.is-configured { color: var(--success); border-color: color-mix(in srgb, var(--success) 42%, var(--line)); }
.managed-config-quick-status.is-missing { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 42%, var(--line)); }
.managed-config-quick-forms,
.managed-config-nvd-form { display: grid; gap: 10px; }
.managed-config-nvd-form label { display: grid; gap: 6px; }
.managed-config-nvd-form label > span { font-size: 11px; font-weight: 800; }
.managed-config-nvd-form input {
  width: 100%;
  min-height: 43px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text);
}
.managed-config-quick-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.managed-config-quick-actions span { color: var(--muted); font-size: 10px; line-height: 1.4; }
.managed-config-nvd-clear { display: flex; justify-content: flex-end; }
.managed-config-savebar {
  position: sticky;
  top: 70px;
  z-index: 8;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 15px;
  padding: 9px 10px;
  border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line));
  border-radius: 11px;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
  backdrop-filter: blur(10px);
}
.managed-config-savebar > div { display: grid; gap: 2px; }
.managed-config-savebar strong { font-size: 11px; }
.managed-config-savebar span { color: var(--muted); font-size: 10px; }
[data-managed-config-form].is-dirty .managed-config-savebar {
  border-color: color-mix(in srgb, var(--warning) 55%, var(--line));
}
[data-managed-config-form].is-saving [data-config-save] { opacity: .72; pointer-events: none; }
@media (max-width: 900px) {
  .managed-config-quick-key { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .managed-config-quick-key { padding: 14px; }
  .managed-config-quick-actions,
  .managed-config-savebar { align-items: stretch; flex-direction: column; }
  .managed-config-quick-actions .enterprise-primary-action,
  .managed-config-savebar .enterprise-primary-action { width: 100%; }
  .managed-config-savebar { top: 62px; }
}

/* Cyberocena v7.43 — protocol service intelligence */
.range-protocol-intelligence {
    margin-top: 8px;
    border: 1px solid color-mix(in srgb, var(--border, #29445e) 78%, transparent);
    border-radius: 10px;
    background: color-mix(in srgb, var(--surface-2, #101d2b) 88%, transparent);
}
.range-protocol-intelligence > summary {
    cursor: pointer;
    padding: 9px 11px;
    font-size: .78rem;
    font-weight: 750;
    letter-spacing: .02em;
}
.range-protocol-intelligence dl {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0 11px 9px;
}
.range-protocol-intelligence dl > div {
    display: grid;
    grid-template-columns: minmax(120px, .8fr) minmax(0, 1.3fr);
    gap: 10px;
    padding: 6px 0;
    border-top: 1px solid color-mix(in srgb, var(--border, #29445e) 55%, transparent);
}
.range-protocol-intelligence dt {
    color: var(--muted, #93a9bd);
    font-size: .72rem;
}
.range-protocol-intelligence dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    font-size: .74rem;
    color: var(--text, #eef6ff);
}
.range-protocol-intelligence > small {
    display: block;
    padding: 0 11px 9px;
    color: var(--muted, #93a9bd);
    font-size: .68rem;
}
@media (max-width: 620px) {
    .range-protocol-intelligence dl > div {
        grid-template-columns: 1fr;
        gap: 3px;
    }
}


/* Cyberocena v7.44 — explicit detected/current version comparison */
.range-version-comparison {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin: 12px 0;
  padding: 12px;
  border: 1px solid rgba(245, 158, 11, .38);
  border-radius: 12px;
  background: rgba(245, 158, 11, .08);
}
.range-version-comparison > div { min-width: 0; }
.range-version-comparison span {
  display: block;
  margin-bottom: 3px;
  color: var(--muted, #94a3b8);
  font-size: .72rem;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.range-version-comparison strong {
  display: block;
  overflow-wrap: anywhere;
  font-size: .96rem;
  line-height: 1.25;
}
.range-version-comparison i { color: #f59e0b; font-style: normal; font-weight: 800; }
.range-version-comparison small {
  grid-column: 1 / -1;
  color: var(--muted, #94a3b8);
  font-size: .75rem;
  line-height: 1.35;
}
@media (max-width: 560px) {
  .range-version-comparison { grid-template-columns: 1fr; gap: 7px; }
  .range-version-comparison i { transform: rotate(90deg); justify-self: start; }
  .range-version-comparison small { grid-column: auto; }
}

/* Cyberocena v7.45 — public Continuous Exposure Monitoring */
.home-change-monitoring {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
    gap: clamp(28px, 5vw, 72px);
    align-items: center;
    margin: clamp(26px, 4vw, 54px) 0;
    padding: clamp(30px, 5vw, 64px);
    border: 1px solid rgba(75, 139, 255, .2);
    border-radius: 30px;
    background:
        radial-gradient(circle at 88% 16%, rgba(77, 114, 255, .18), transparent 34%),
        linear-gradient(135deg, rgba(11, 24, 43, .97), rgba(7, 16, 29, .99));
    box-shadow: 0 30px 90px rgba(0, 0, 0, .24);
    overflow: hidden;
}
.home-change-copy h2 { max-width: 780px; margin: 10px 0 14px; font-size: clamp(30px, 3.7vw, 52px); line-height: 1.04; letter-spacing: -.035em; }
.home-change-copy > p { max-width: 760px; color: var(--muted); line-height: 1.72; }
.home-change-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 24px 0; }
.home-change-points > span { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 2px 12px; align-items: center; padding: 14px; border: 1px solid rgba(139, 174, 226, .15); border-radius: 17px; background: rgba(10, 23, 41, .68); }
.home-change-points b { grid-row: 1 / span 2; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; color: #8ab5ff; background: rgba(50, 116, 255, .14); font-size: 12px; }
.home-change-points strong { font-size: 14px; }
.home-change-points small { color: var(--muted); font-size: 12px; line-height: 1.4; }
.home-change-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 22px; }
.home-change-login-note { display: flex; align-items: flex-start; gap: 9px; margin: 16px 0 0 !important; font-size: 12px; color: #91a8c0 !important; }
.home-change-window { border: 1px solid rgba(148, 180, 230, .19); border-radius: 22px; background: rgba(5, 13, 24, .91); box-shadow: 0 24px 70px rgba(0, 0, 0, .34); overflow: hidden; transform: rotate(1deg); }
.home-change-window > header { display: flex; align-items: center; gap: 6px; padding: 13px 16px; border-bottom: 1px solid rgba(151, 179, 220, .12); background: rgba(255,255,255,.025); }
.home-change-window > header > span { width: 8px; height: 8px; border-radius: 50%; background: #33485e; }
.home-change-window > header > span:first-child { background: #ff6f7d; }
.home-change-window > header > span:nth-child(2) { background: #f7b84b; }
.home-change-window > header > span:nth-child(3) { background: #4bd8a0; }
.home-change-window > header small { margin-left: 8px; color: #93a9bf; }
.home-change-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; padding: 15px; }
.home-change-summary div { padding: 13px; border-radius: 14px; background: rgba(31, 49, 72, .54); }
.home-change-summary small { display: block; color: #8da4bb; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.home-change-summary strong { display: block; margin-top: 3px; font-size: 22px; }
.home-change-feed { display: grid; gap: 9px; padding: 0 15px 15px; }
.home-change-feed article { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 11px; align-items: center; padding: 13px; border: 1px solid rgba(133, 165, 212, .13); border-radius: 15px; background: rgba(15, 31, 51, .76); }
.home-change-feed article > i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; font-style: normal; font-weight: 900; }
.home-change-feed .regression > i { color: #ff818e; background: rgba(255, 76, 95, .13); }
.home-change-feed .improvement > i { color: #51dfaa; background: rgba(43, 205, 142, .13); }
.home-change-feed article strong, .home-change-feed article small { display: block; }
.home-change-feed article strong { font-size: 13px; }
.home-change-feed article small { margin-top: 3px; color: #849cb4; font-size: 11px; }
.home-change-feed article > b { color: #dce9f8; font-size: 15px; }
.home-change-window > footer { display: flex; justify-content: space-between; gap: 10px; padding: 13px 16px; border-top: 1px solid rgba(151, 179, 220, .12); color: #8198b0; font-size: 10px; }
.home-change-window > footer span { color: #70dab0; }
.home-change-window > footer i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: #4bd8a0; box-shadow: 0 0 12px #4bd8a0; }
.monitoring-change-bridge { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 18px; background: linear-gradient(135deg, rgba(39, 91, 192, .11), rgba(88, 68, 190, .08)); }
.monitoring-change-bridge > div { max-width: 870px; }
.monitoring-change-bridge h2 { margin: 5px 0 7px; font-size: clamp(19px, 2vw, 27px); }
.monitoring-change-bridge p { margin: 0; color: var(--muted); }
[data-theme="light"] .home-change-monitoring { background: radial-gradient(circle at 88% 16%, rgba(77,114,255,.13), transparent 34%), linear-gradient(135deg, #f8fbff, #eef5fd); border-color: rgba(39, 96, 181, .18); box-shadow: 0 26px 70px rgba(42, 75, 119, .12); }
[data-theme="light"] .home-change-points > span, [data-theme="light"] .home-change-window { background: rgba(255,255,255,.86); }
[data-theme="light"] .home-change-feed article { background: #f7faff; }
[data-theme="light"] .home-change-window > footer, [data-theme="light"] .home-change-window > header { border-color: rgba(47,79,120,.11); }
@media (max-width: 980px) {
    .home-change-monitoring { grid-template-columns: 1fr; padding: 32px; }
    .home-change-visual { max-width: 680px; width: 100%; margin: 0 auto; }
    .home-change-window { transform: none; }
    .monitoring-change-bridge { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 620px) {
    .home-change-monitoring { margin: 20px 0; padding: 24px 18px; border-radius: 22px; }
    .home-change-copy h2 { font-size: clamp(28px, 9vw, 36px); }
    .home-change-points { grid-template-columns: 1fr; }
    .home-change-actions, .home-change-actions .button { width: 100%; }
    .home-change-actions .button { justify-content: center; }
    .home-change-summary { gap: 6px; padding: 11px; }
    .home-change-summary div { padding: 10px 8px; }
    .home-change-summary strong { font-size: 18px; }
    .home-change-feed { padding: 0 11px 11px; }
    .home-change-feed article { grid-template-columns: 31px minmax(0, 1fr); padding: 11px; }
    .home-change-feed article > b { display: none; }
    .home-change-window > footer { align-items: flex-start; flex-direction: column; }
}


/* =========================================================
   Cyberocena v7.46 — public typography safety system
   Smaller headings, safer line-height and no mid-word wrapping.
   ========================================================= */
.public-site-page {
  --public-title-xl: clamp(33px, 3.35vw, 50px);
  --public-title-lg: clamp(30px, 3.05vw, 46px);
  --public-title-md: clamp(25px, 2.55vw, 38px);
  --public-title-sm: clamp(19px, 1.65vw, 24px);
}
.public-site-page h1,
.public-site-page h2,
.public-site-page h3 {
  max-width: 100%;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: auto;
  text-wrap: pretty;
}
.public-site-page main h1 {
  line-height: 1.12 !important;
  letter-spacing: -.026em !important;
}
.public-site-page main h2,
.public-site-page .knowledge-footer-premium h2 {
  line-height: 1.16 !important;
  letter-spacing: -.018em !important;
}
.public-site-page main h3 { line-height: 1.22 !important; letter-spacing: -.01em !important; }

/* Strona główna. */
.public-home-page .hero h1,
.public-home-page #hero-title {
  width: min(800px, 100%) !important;
  max-width: 800px !important;
  gap: 4px !important;
  font-size: var(--public-title-xl) !important;
  line-height: 1.12 !important;
  letter-spacing: -.028em !important;
}
.public-home-page .hero-title-secondary {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  column-gap: .32em;
  row-gap: 0;
}
.public-home-page .hero-title-secondary em { margin-left: 0 !important; }
.public-home-page .section-heading h2,
.public-home-page .knowledge-heading h2,
.public-home-page .platform-copy h2,
.public-home-page .api-section h2,
.public-home-page .home-account-section h2,
.public-home-page .home-dora-section h2,
.public-home-page .home-change-copy h2 {
  font-size: var(--public-title-md) !important;
  line-height: 1.16 !important;
  letter-spacing: -.02em !important;
}
.public-home-page .knowledge-footer-intro h2 {
  font-size: clamp(25px, 2.7vw, 39px) !important;
  line-height: 1.16 !important;
}

/* Katalogi, narzędzia i artykuły. */
.public-site-page .listing-page--compact > .listing-hero h1,
.public-error-page .listing-hero h1 {
  max-width: 900px !important;
  font-size: var(--public-title-lg) !important;
  line-height: 1.13 !important;
  letter-spacing: -.025em !important;
}
.public-tool-page .tool-detail-hero h1 {
  max-width: 820px !important;
  font-size: var(--public-title-lg) !important;
  line-height: 1.13 !important;
  letter-spacing: -.025em !important;
}
.public-article-page .article-header h1 {
  max-width: 920px !important;
  font-size: clamp(29px, 3vw, 44px) !important;
  line-height: 1.15 !important;
  letter-spacing: -.022em !important;
}
.public-site-page .catalog-tool-card h2,
.public-site-page .knowledge-card-full h2 {
  line-height: 1.26 !important;
  letter-spacing: -.01em !important;
}

/* DORA. */
.public-site-page.dora-page .dora-hero h1 {
  max-width: 690px !important;
  font-size: var(--public-title-lg) !important;
  line-height: 1.13 !important;
  letter-spacing: -.026em !important;
}
.public-site-page.dora-page .dora-section-head h2,
.public-site-page.dora-page .dora-conversion h2 {
  font-size: var(--public-title-md) !important;
  line-height: 1.16 !important;
}
.public-site-page.dora-page .dora-pillar-grid h3 {
  font-size: clamp(18px, 1.45vw, 21px) !important;
  line-height: 1.22 !important;
}

/* O portalu. */
.public-site-page.about-page .about-hero h1 {
  max-width: 710px !important;
  font-size: clamp(32px, 3.25vw, 48px) !important;
  line-height: 1.13 !important;
  letter-spacing: -.026em !important;
}
.public-site-page.about-page .about-hero h1 em { line-height: inherit !important; }
.public-site-page.about-page .about-intro h2,
.public-site-page.about-page .about-section-head h2,
.public-site-page.about-page .about-checks h2,
.public-site-page.about-page .about-enterprise h2,
.public-site-page.about-page .about-safety h2 {
  font-size: var(--public-title-md) !important;
  line-height: 1.16 !important;
  letter-spacing: -.018em !important;
}

/* Dokumenty prawne i bezpieczne korzystanie. */
.public-legal-page .legal-hero h1,
.public-safe-use-page .safe-use-hero h1 {
  max-width: 820px !important;
  font-size: clamp(29px, 3.1vw, 44px) !important;
  line-height: 1.15 !important;
  letter-spacing: -.022em !important;
}
.public-legal-page .legal-content h2,
.public-safe-use-page .safe-use-grid h2 {
  line-height: 1.22 !important;
  letter-spacing: -.01em !important;
}

/* Formularze publiczne i strony uwierzytelniania. */
.auth-body .auth-card h1,
.auth-body .auth-card-enterprise h1,
.enterprise-invitation-page .auth-card h1 {
  font-size: clamp(26px, 3.3vw, 34px) !important;
  line-height: 1.2 !important;
  letter-spacing: -.018em !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: auto;
}

@media (max-width: 900px) {
  .public-site-page { --public-title-xl: clamp(31px, 5.2vw, 44px); --public-title-lg: clamp(28px, 4.8vw, 40px); --public-title-md: clamp(24px, 4vw, 34px); }
  .public-site-page.dora-page .dora-hero h1,
  .public-site-page.about-page .about-hero h1 { max-width: 780px !important; }
}
@media (max-width: 680px) {
  .public-site-page { --public-title-xl: clamp(28px, 8vw, 33px); --public-title-lg: clamp(27px, 7.7vw, 33px); --public-title-md: clamp(22px, 6.5vw, 29px); }
  .public-site-page main h1 { line-height: 1.16 !important; letter-spacing: -.018em !important; }
  .public-site-page main h2,
  .public-site-page .knowledge-footer-premium h2 { line-height: 1.2 !important; letter-spacing: -.012em !important; }
  .public-home-page .hero h1,
  .public-home-page #hero-title { font-size: var(--public-title-xl) !important; line-height: 1.16 !important; gap: 3px !important; }
  .public-site-page .listing-page--compact > .listing-hero h1,
  .public-error-page .listing-hero h1,
  .public-tool-page .tool-detail-hero h1,
  .public-site-page.dora-page .dora-hero h1 { font-size: var(--public-title-lg) !important; line-height: 1.16 !important; }
  .public-article-page .article-header h1,
  .public-legal-page .legal-hero h1,
  .public-safe-use-page .safe-use-hero h1 { font-size: clamp(26px, 7.5vw, 32px) !important; line-height: 1.18 !important; }
  .public-site-page.about-page .about-hero h1 { font-size: clamp(28px, 8vw, 34px) !important; line-height: 1.16 !important; }
  .public-home-page .section-heading h2,
  .public-home-page .knowledge-heading h2,
  .public-home-page .platform-copy h2,
  .public-home-page .api-section h2,
  .public-home-page .home-account-section h2,
  .public-home-page .home-dora-section h2,
  .public-home-page .home-change-copy h2,
  .public-site-page.dora-page .dora-section-head h2,
  .public-site-page.dora-page .dora-conversion h2,
  .public-site-page.about-page .about-intro h2,
  .public-site-page.about-page .about-section-head h2,
  .public-site-page.about-page .about-checks h2,
  .public-site-page.about-page .about-enterprise h2,
  .public-site-page.about-page .about-safety h2 { font-size: var(--public-title-md) !important; }
  .public-home-page .knowledge-footer-intro h2 { font-size: clamp(23px, 6.8vw, 30px) !important; }
}
@media (max-width: 390px) {
  .public-site-page { --public-title-xl: 28px; --public-title-lg: 27px; --public-title-md: 22px; }
  .public-home-page .hero-title-secondary { column-gap: .34em; }
}


/* =========================================================
   Cyberocena v7.47 — public mobile stacking, smaller headings, safer tools layout
   ========================================================= */
.public-home-page .section-heading h2,
.tools-directory-page .listing-hero h1,
.listing-page .listing-hero h1,
.public-site-page .section-heading h2 {
  font-size: clamp(24px, 4.2vw, 36px) !important;
  line-height: 1.14 !important;
  letter-spacing: -.028em !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}
.public-home-page .section-heading p,
.public-site-page .section-heading p,
.listing-page .listing-hero p {
  max-width: 62ch;
}
@media (max-width: 780px) {
  .public-home-page .section-heading,
  .public-site-page .section-heading {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: start !important;
    gap: 12px !important;
  }
  .public-home-page .section-heading h2,
  .public-site-page .section-heading h2,
  .tools-directory-page .listing-hero h1,
  .listing-page .listing-hero h1 {
    font-size: clamp(22px, 8.5vw, 32px) !important;
    line-height: 1.12 !important;
  }
  .public-home-page .view-controls,
  .public-site-page .view-controls {
    justify-content: flex-start;
  }
}
@media (max-width: 650px) {
  .workspace,
  .public-home-page .workspace,
  .tool-select-open .workspace {
    width: calc(100% - 24px) !important;
    margin: 0 12px 42px !important;
    padding: 30px 0 42px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    overflow: hidden !important;
  }
  .tool-sidebar,
  .tool-content,
  .workspace-rail,
  .workspace-rail .rail-panel {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .tool-content,
  .tool-sidebar,
  .workspace-rail .rail-panel {
    border-radius: 16px !important;
  }
  .sidebar-sticky,
  .tool-content,
  .workspace-rail .rail-panel {
    padding: 15px !important;
  }
  .tool-search {
    width: 100% !important;
    grid-template-columns: 18px minmax(0,1fr) !important;
  }
  .tool-search input,
  .tool-search svg,
  .category-list,
  .category-button,
  .section-heading,
  .section-heading > div,
  .section-heading p,
  .all-tools-link {
    min-width: 0 !important;
  }
  .category-list {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    gap: 8px !important;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }
  .category-button {
    flex: 0 0 auto !important;
  }
  .public-home-page .section-heading,
  .public-site-page .section-heading {
    gap: 10px !important;
    margin-bottom: 14px !important;
  }
  .public-home-page .section-heading h2,
  .public-site-page .section-heading h2,
  .tools-directory-page .listing-hero h1,
  .listing-page .listing-hero h1 {
    font-size: clamp(20px, 11vw, 28px) !important;
    line-height: 1.1 !important;
    letter-spacing: -.02em !important;
  }
  .public-home-page .section-heading p,
  .public-site-page .section-heading p,
  .listing-page .listing-hero p {
    font-size: 15px !important;
    line-height: 1.62 !important;
  }
  .public-home-page .tool-grid,
  .public-home-page .knowledge-grid,
  .tool-grid {
    grid-template-columns: 1fr !important;
  }
}

/* =========================================================
   Cyberocena v7.52 - public remediation promotion
   ========================================================= */
.home-remediation-section{width:min(var(--max),calc(100% - 48px));margin:0 auto 54px;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.72fr);gap:34px;align-items:center;padding:34px;border:1px solid rgba(66,142,238,.22);border-radius:22px;background:linear-gradient(135deg,rgba(15,48,89,.92),rgba(5,29,55,.98));box-shadow:0 20px 46px rgba(0,0,0,.16)}.home-remediation-copy h2{max-width:760px;margin:8px 0 12px;font-size:clamp(27px,3.1vw,42px);line-height:1.14;letter-spacing:-.025em}.home-remediation-copy>p{max-width:760px;margin:0;color:var(--muted);font-size:15px;line-height:1.65}.home-remediation-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.home-remediation-tags span{padding:7px 10px;border:1px solid rgba(94,159,240,.2);border-radius:999px;background:rgba(43,119,232,.1);color:#9ecbff;font-size:10px;font-weight:800}.home-remediation-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.home-remediation-note{display:flex;gap:8px;align-items:flex-start;margin-top:15px!important;color:#819bbd!important;font-size:11px!important}.home-remediation-terminal{min-width:0;border:1px solid rgba(94,159,240,.23);border-radius:16px;background:#020d1f;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,.22)}.home-remediation-terminal header{display:flex;align-items:center;gap:6px;padding:11px 13px;border-bottom:1px solid rgba(94,159,240,.16);background:#071a34}.home-remediation-terminal header>span{width:8px;height:8px;border-radius:50%;background:#375b81}.home-remediation-terminal header>span:first-child{background:#ff6f83}.home-remediation-terminal header>span:nth-child(2){background:#ffbd5d}.home-remediation-terminal header>span:nth-child(3){background:#53d9b7}.home-remediation-terminal header small{margin-left:8px;color:#7894b5;font-size:9px}.home-remediation-terminal pre{margin:0;padding:24px;overflow:auto;color:#70e5cf;font:12px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap}.home-remediation-terminal footer{display:flex;justify-content:space-between;gap:10px;padding:11px 14px;border-top:1px solid rgba(94,159,240,.14);color:#7e9cbe;font-size:9px}.home-remediation-terminal footer span{color:#65dfc8;font-weight:800}.public-remediation-banner{width:min(var(--max),calc(100% - 48px));margin:28px auto 52px;display:flex;justify-content:space-between;gap:28px;align-items:center;padding:28px 30px;border:1px solid rgba(64,139,237,.22);border-radius:20px;background:linear-gradient(135deg,rgba(24,78,151,.16),rgba(17,167,148,.07))}.public-remediation-banner>div:first-child{max-width:820px}.public-remediation-banner h2{margin:7px 0 9px;font-size:clamp(24px,2.7vw,36px);line-height:1.16;letter-spacing:-.022em}.public-remediation-banner p{margin:0;color:var(--muted);line-height:1.6}.public-remediation-banner>div:last-child{display:flex;gap:9px;flex-wrap:wrap}:root[data-theme="light"] .home-remediation-section{background:linear-gradient(135deg,#fff,#f2f8fd);box-shadow:0 18px 42px rgba(39,72,105,.09)}:root[data-theme="light"] .home-remediation-copy h2,:root[data-theme="light"] .public-remediation-banner h2{color:#173754}:root[data-theme="light"] .home-remediation-terminal{background:#071729}
@media(max-width:980px){.home-remediation-section{grid-template-columns:1fr}.home-remediation-terminal{max-width:720px}.public-remediation-banner{align-items:flex-start;flex-direction:column}.public-remediation-banner>div:last-child{width:100%}}
@media(max-width:650px){.home-remediation-section,.public-remediation-banner{width:calc(100% - 24px);margin-left:12px;margin-right:12px;padding:21px 17px;border-radius:18px}.home-remediation-copy h2,.public-remediation-banner h2{font-size:clamp(23px,7.6vw,30px)}.home-remediation-actions,.public-remediation-banner>div:last-child{display:grid;grid-template-columns:1fr;width:100%}.home-remediation-actions a,.public-remediation-banner a{width:100%}.home-remediation-terminal pre{padding:17px;font-size:10px}.home-remediation-terminal footer{align-items:flex-start;flex-direction:column}}


/* =========================================================
   Cyberocena v7.56 — unified homepage grid, spacing and alignment
   ========================================================= */
.public-home-page {
  --home-shell-width: min(1400px, calc(100% - 48px));
  --home-section-gap: clamp(28px, 3.4vw, 48px);
  --home-card-radius: 24px;
  --home-card-padding: clamp(28px, 3.2vw, 44px);
}

/* One horizontal axis for the complete homepage. */
.public-home-page .feature-strip,
.public-home-page .home-account-section,
.public-home-page .home-change-monitoring,
.public-home-page .home-remediation-section,
.public-home-page .home-dora-section,
.public-home-page .workspace,
.public-home-page .result-section,
.public-home-page .connection-insight-section,
.public-home-page .knowledge-section,
.public-home-page .knowledge-footer-premium,
.public-home-page .platform-section-account,
.public-home-page .trust-metrics-counters,
.public-home-page .api-section {
  width: var(--home-shell-width) !important;
  max-width: 1400px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Hero uses the same internal axis as the remaining content. */
.public-home-page .hero {
  min-height: 570px !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(350px, .78fr) !important;
  gap: clamp(34px, 5vw, 78px) !important;
  align-items: center !important;
  padding: 54px max(24px, calc((100vw - 1400px) / 2)) 66px !important;
}
.public-home-page .hero-content {
  width: 100% !important;
  max-width: 840px !important;
  text-align: left !important;
}
.public-home-page .hero h1,
.public-home-page #hero-title {
  width: 100% !important;
  max-width: 780px !important;
  margin: 16px 0 16px !important;
}
.public-home-page .hero-title-secondary {
  justify-content: flex-start !important;
}
.public-home-page .hero > .hero-content > p {
  max-width: 720px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.public-home-page .scan-bar,
.public-home-page .hero-account-path {
  width: 100% !important;
  max-width: 900px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.public-home-page .scan-examples,
.public-home-page .hero-trust {
  justify-content: flex-start !important;
}
.public-home-page .hero-visual {
  width: min(100%, 520px) !important;
  min-width: 0 !important;
  justify-self: end !important;
}

/* Compact and even feature cards. */
.public-home-page .feature-strip {
  margin-top: -26px !important;
  margin-bottom: var(--home-section-gap) !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
.public-home-page .feature-strip button {
  min-height: 88px !important;
  height: 100% !important;
  padding: 14px !important;
  align-items: center !important;
}
.public-home-page .feature-strip .feature-icon {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
}
.public-home-page .feature-strip strong,
.public-home-page .feature-strip b,
.public-home-page .feature-strip small {
  white-space: normal !important;
  line-height: 1.25 !important;
}

/* The four conversion sections now share one visual system. */
.public-home-page .home-account-section,
.public-home-page .home-change-monitoring,
.public-home-page .home-remediation-section,
.public-home-page .home-dora-section {
  margin-top: 0 !important;
  margin-bottom: var(--home-section-gap) !important;
  padding: var(--home-card-padding) !important;
  border-radius: var(--home-card-radius) !important;
  gap: clamp(28px, 4vw, 52px) !important;
  align-items: center !important;
}
.public-home-page .home-account-section,
.public-home-page .home-change-monitoring {
  grid-template-columns: minmax(0, 1.04fr) minmax(390px, .96fr) !important;
}
.public-home-page .home-remediation-section,
.public-home-page .home-dora-section {
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr) !important;
}
.public-home-page .home-account-copy,
.public-home-page .home-change-copy,
.public-home-page .home-remediation-copy,
.public-home-page .home-dora-section > div {
  min-width: 0 !important;
}
.public-home-page .home-account-copy h2,
.public-home-page .home-change-copy h2,
.public-home-page .home-remediation-copy h2,
.public-home-page .home-dora-section h2 {
  max-width: 760px !important;
  margin: 8px 0 12px !important;
}
.public-home-page .home-account-copy > p,
.public-home-page .home-change-copy > p,
.public-home-page .home-remediation-copy > p,
.public-home-page .home-dora-section > div > p {
  max-width: 740px !important;
  margin-top: 0 !important;
}
.public-home-page .home-account-actions,
.public-home-page .home-change-actions,
.public-home-page .home-remediation-actions,
.public-home-page .home-dora-section-actions {
  align-items: center !important;
  gap: 10px !important;
  margin-top: 20px !important;
}
.public-home-page .home-account-window,
.public-home-page .home-change-window {
  transform: none !important;
}

/* Tools directory: three stable columns on wide screens. */
.public-home-page .workspace {
  margin-top: 0 !important;
  margin-bottom: var(--home-section-gap) !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 220px minmax(0, 1fr) 270px !important;
  gap: 18px !important;
  align-items: start !important;
}
.public-home-page .tool-sidebar,
.public-home-page .tool-content,
.public-home-page .workspace-rail,
.public-home-page .workspace-rail .rail-panel {
  min-width: 0 !important;
}
.public-home-page .tool-sidebar,
.public-home-page .tool-content,
.public-home-page .workspace-rail .rail-panel {
  border-radius: 20px !important;
}
.public-home-page .tool-content {
  padding: 28px !important;
}
.public-home-page .sidebar-sticky {
  padding: 22px !important;
}
.public-home-page .workspace-rail {
  display: grid !important;
  gap: 14px !important;
}
.public-home-page .workspace-rail .rail-panel {
  margin: 0 !important;
}
.public-home-page .section-heading {
  align-items: flex-start !important;
  margin-bottom: 22px !important;
}
.public-home-page .tool-grid {
  align-items: stretch !important;
  grid-auto-rows: 1fr !important;
}
.public-home-page .tool-card {
  height: 100% !important;
}

/* Remaining sections share the same rhythm and card geometry. */
.public-home-page .connection-insight-section,
.public-home-page .knowledge-section,
.public-home-page .knowledge-footer-premium,
.public-home-page .platform-section-account,
.public-home-page .api-section {
  margin-top: 0 !important;
  margin-bottom: var(--home-section-gap) !important;
  border-radius: var(--home-card-radius) !important;
}
.public-home-page .connection-insight-section,
.public-home-page .knowledge-section,
.public-home-page .platform-section-account,
.public-home-page .api-section {
  padding: var(--home-card-padding) !important;
}
.public-home-page .knowledge-heading,
.public-home-page .knowledge-heading > div,
.public-home-page .platform-copy,
.public-home-page .api-section > div {
  min-width: 0 !important;
}
.public-home-page .knowledge-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 1fr !important;
  gap: 14px !important;
}
.public-home-page .knowledge-card {
  min-height: 0 !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
.public-home-page .knowledge-card > strong {
  margin-top: auto !important;
  padding-top: 18px !important;
}
.public-home-page .knowledge-section-actions {
  display: flex !important;
  justify-content: center !important;
  margin-top: 24px !important;
}
.public-home-page .knowledge-footer-premium {
  padding: clamp(26px, 3vw, 38px) !important;
  gap: 34px !important;
}
.public-home-page .platform-section-account {
  min-height: 0 !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr) !important;
  gap: clamp(30px, 4vw, 54px) !important;
  align-items: center !important;
}
.public-home-page .platform-points {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.public-home-page .trust-metrics-counters {
  margin-top: 0 !important;
  margin-bottom: var(--home-section-gap) !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.public-home-page .trust-metrics-counters .metric-card {
  min-height: 120px !important;
  height: 100% !important;
}
.public-home-page .api-section {
  grid-template-columns: minmax(0, 1fr) minmax(360px, .8fr) !important;
  gap: 38px !important;
  align-items: center !important;
}
.public-home-page .api-section pre {
  width: 100% !important;
  min-width: 0 !important;
}

/* Intermediate desktop/tablet. */
@media (max-width: 1260px) {
  .public-home-page .feature-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  .public-home-page .workspace {
    grid-template-columns: 210px minmax(0, 1fr) !important;
  }
  .public-home-page .workspace-rail {
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1020px) {
  .public-home-page {
    --home-shell-width: min(100% - 32px, 1400px);
    --home-section-gap: 30px;
  }
  .public-home-page .hero {
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    padding: 44px 24px 58px !important;
  }
  .public-home-page .hero-content {
    max-width: 900px !important;
    margin: 0 auto !important;
    text-align: center !important;
  }
  .public-home-page .hero h1,
  .public-home-page #hero-title,
  .public-home-page .hero > .hero-content > p,
  .public-home-page .scan-bar,
  .public-home-page .hero-account-path {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .public-home-page .hero-title-secondary,
  .public-home-page .scan-examples,
  .public-home-page .hero-trust {
    justify-content: center !important;
  }
  .public-home-page .hero-visual {
    display: none !important;
  }
  .public-home-page .home-account-section,
  .public-home-page .home-change-monitoring,
  .public-home-page .home-remediation-section,
  .public-home-page .home-dora-section,
  .public-home-page .platform-section-account,
  .public-home-page .api-section {
    grid-template-columns: 1fr !important;
  }
  .public-home-page .home-account-visual,
  .public-home-page .home-change-visual,
  .public-home-page .home-remediation-terminal,
  .public-home-page .home-dora-map,
  .public-home-page .platform-visual,
  .public-home-page .api-section pre {
    width: min(100%, 760px) !important;
    justify-self: center !important;
  }
  .public-home-page .knowledge-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .public-home-page {
    --home-shell-width: calc(100% - 24px);
    --home-card-radius: 18px;
    --home-card-padding: 20px;
    --home-section-gap: 24px;
  }
  .public-home-page .hero {
    padding: 32px 12px 44px !important;
  }
  .public-home-page .hero-content {
    text-align: left !important;
  }
  .public-home-page .hero h1,
  .public-home-page #hero-title,
  .public-home-page .hero > .hero-content > p,
  .public-home-page .scan-bar,
  .public-home-page .hero-account-path {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .public-home-page .hero-title-secondary,
  .public-home-page .scan-examples,
  .public-home-page .hero-trust {
    justify-content: flex-start !important;
  }
  .public-home-page .feature-strip {
    margin-top: -18px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .public-home-page .feature-strip button {
    min-height: 76px !important;
  }
  .public-home-page .workspace {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
  }
  .public-home-page .tool-sidebar,
  .public-home-page .tool-content,
  .public-home-page .workspace-rail {
    width: 100% !important;
  }
  .public-home-page .workspace-rail {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
  .public-home-page .tool-content,
  .public-home-page .sidebar-sticky,
  .public-home-page .workspace-rail .rail-panel {
    padding: 18px !important;
  }
  .public-home-page .home-account-benefits,
  .public-home-page .home-change-points,
  .public-home-page .platform-points,
  .public-home-page .knowledge-grid,
  .public-home-page .trust-metrics-counters {
    grid-template-columns: 1fr !important;
  }
  .public-home-page .home-account-actions,
  .public-home-page .home-change-actions,
  .public-home-page .home-remediation-actions,
  .public-home-page .home-dora-section-actions,
  .public-home-page .platform-account-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }
  .public-home-page .home-account-actions .button,
  .public-home-page .home-change-actions .button,
  .public-home-page .home-remediation-actions .button,
  .public-home-page .home-dora-section-actions .button,
  .public-home-page .platform-account-actions .button {
    width: 100% !important;
  }
  .public-home-page .knowledge-footer-premium {
    grid-template-columns: 1fr !important;
  }
  .public-home-page .knowledge-footer-links {
    grid-template-columns: 1fr 1fr !important;
    gap: 22px !important;
  }
}

@media (max-width: 440px) {
  .public-home-page .feature-strip {
    grid-template-columns: 1fr !important;
  }
  .public-home-page .feature-strip button:nth-child(n) {
    display: flex !important;
  }
  .public-home-page .knowledge-footer-links {
    grid-template-columns: 1fr !important;
  }
  .public-home-page .home-change-summary {
    grid-template-columns: 1fr !important;
  }
}


/* =========================================================
   Cyberocena v7.57 — modern homepage tests overview and DORA shell alignment
   ========================================================= */
.public-home-page .home-tests-overview {
  width: var(--home-shell-width) !important;
  max-width: 1400px !important;
  margin: 24px auto var(--home-section-gap) !important;
  padding: clamp(26px, 3vw, 38px) !important;
  border: 1px solid rgba(76, 148, 238, .22);
  border-radius: var(--home-card-radius);
  background:
    radial-gradient(circle at 94% 0, rgba(52, 199, 180, .09), transparent 28%),
    linear-gradient(145deg, rgba(12, 38, 75, .98), rgba(5, 25, 50, .98));
  box-shadow: 0 20px 50px rgba(0, 0, 0, .18);
  overflow: hidden;
}
.public-home-page .home-tests-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 32px;
  align-items: end;
  margin-bottom: 24px;
}
.public-home-page .home-tests-heading > div:first-child {
  min-width: 0;
  max-width: 820px;
}
.public-home-page .home-tests-heading h2 {
  margin: 8px 0 10px;
  max-width: 780px;
  font-size: clamp(29px, 3vw, 42px) !important;
  line-height: 1.12 !important;
  letter-spacing: -.03em !important;
}
.public-home-page .home-tests-heading p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
}
.public-home-page .home-tests-process {
  display: grid;
  grid-template-columns: repeat(3, minmax(92px, 1fr));
  gap: 8px;
}
.public-home-page .home-tests-process span {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-height: 48px;
  padding: 9px 11px;
  border: 1px solid rgba(84, 155, 242, .18);
  border-radius: 13px;
  background: rgba(32, 91, 166, .09);
}
.public-home-page .home-tests-process b {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: rgba(47, 128, 237, .18);
  color: #79b7ff;
  font-size: 11px;
}
.public-home-page .home-tests-process small {
  color: #b8c9dd;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.3;
}
.public-home-page .home-test-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.public-home-page .home-test-grid > button,
.public-home-page .home-test-grid > a {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  min-height: 94px;
  padding: 15px;
  border: 1px solid rgba(91, 157, 238, .19);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(12, 43, 81, .96), rgba(7, 29, 58, .98));
  color: #fff;
  text-align: left;
  text-decoration: none;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .13);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.public-home-page .home-test-grid > button:hover,
.public-home-page .home-test-grid > a:hover {
  transform: translateY(-3px);
  border-color: rgba(81, 164, 255, .48);
  box-shadow: 0 18px 36px rgba(0, 0, 0, .22);
}
.public-home-page .home-test-grid .feature-icon {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  border-radius: 13px !important;
  font-size: 15px;
}
.public-home-page .home-test-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.public-home-page .home-test-copy strong {
  color: #f7fbff;
  font-size: 13px;
  line-height: 1.25;
}
.public-home-page .home-test-copy small {
  color: #89a2c2;
  font-size: 10px;
  line-height: 1.45;
}
.public-home-page .home-test-grid > button > b,
.public-home-page .home-test-grid > a > b {
  align-self: start;
  padding: 5px 7px;
  border-radius: 8px;
  background: rgba(47, 128, 237, .12);
  color: #79b7ff;
  font-size: 9px;
  letter-spacing: .04em;
}
.public-home-page .home-test-catalog-card {
  background: linear-gradient(145deg, rgba(31, 100, 192, .24), rgba(13, 65, 114, .2)) !important;
  border-color: rgba(74, 176, 227, .34) !important;
}
.public-home-page .hero-account-path {
  margin-top: 20px !important;
  margin-bottom: 0 !important;
}
/* Old negative feature-strip positioning cannot collide with the new block. */
.public-home-page .home-tests-overview + .home-account-section {
  margin-top: 0 !important;
}

/* Standalone DORA page now follows the same 1400px public shell. */
.public-site-page.dora-page main {
  width: min(1400px, calc(100% - 48px)) !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.public-site-page.dora-page main > section {
  width: 100% !important;
  max-width: none !important;
}

:root[data-theme="light"] .public-home-page .home-tests-overview {
  background: radial-gradient(circle at 94% 0, rgba(27, 159, 142, .08), transparent 28%), linear-gradient(145deg, #fff, #f3f8fd);
  box-shadow: 0 18px 42px rgba(31, 67, 102, .09);
}
:root[data-theme="light"] .public-home-page .home-test-grid > button,
:root[data-theme="light"] .public-home-page .home-test-grid > a {
  background: #fff;
  color: #142f4a;
  box-shadow: 0 10px 26px rgba(31, 67, 102, .07);
}
:root[data-theme="light"] .public-home-page .home-test-copy strong {
  color: #142f4a;
}
:root[data-theme="light"] .public-home-page .home-test-copy small,
:root[data-theme="light"] .public-home-page .home-tests-process small {
  color: #637d9b;
}

@media (max-width: 1180px) {
  .public-home-page .home-tests-heading {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 18px;
  }
  .public-home-page .home-tests-process {
    width: min(100%, 520px);
  }
  .public-home-page .home-test-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .public-home-page .home-tests-overview {
    width: calc(100% - 24px) !important;
    margin: 16px 12px var(--home-section-gap) !important;
    padding: 20px 16px !important;
    border-radius: 18px !important;
  }
  .public-home-page .home-tests-heading {
    margin-bottom: 18px;
  }
  .public-home-page .home-tests-heading h2 {
    font-size: clamp(24px, 8vw, 31px) !important;
  }
  .public-home-page .home-tests-process {
    display: flex;
    width: 100%;
    overflow-x: auto;
    padding-bottom: 3px;
  }
  .public-home-page .home-tests-process span {
    flex: 0 0 138px;
  }
  .public-home-page .home-test-grid {
    grid-template-columns: 1fr;
  }
  .public-home-page .home-test-grid > button,
  .public-home-page .home-test-grid > a {
    min-height: 84px;
  }
  .public-site-page.dora-page main {
    width: calc(100% - 24px) !important;
  }
}
@media (max-width: 420px) {
  .public-home-page .home-test-grid > button,
  .public-home-page .home-test-grid > a {
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 13px;
  }
  .public-home-page .home-test-grid .feature-icon {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
  }
}


/* =========================================================
   Cyberocena v7.58 — dynamic Security Spectrum
   ========================================================= */
.platform-spectrum-visual {
  min-width: 0;
  display: flex;
  align-items: stretch;
}
.security-spectrum-panel {
  width: 100%;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(94, 158, 241, .24);
  border-radius: 20px;
  background:
    radial-gradient(circle at 15% 8%, rgba(45, 226, 196, .12), transparent 28%),
    radial-gradient(circle at 88% 22%, rgba(155, 97, 255, .14), transparent 30%),
    linear-gradient(145deg, rgba(7, 26, 57, .96), rgba(5, 19, 43, .98));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 24px 60px rgba(0, 10, 32, .22);
  overflow: hidden;
}
.security-spectrum-head,
.security-spectrum-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.security-spectrum-head > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.security-spectrum-head > div > span {
  color: #68a9ff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .15em;
}
.security-spectrum-head > div > strong {
  color: #f6f9ff;
  font-size: 14px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.security-spectrum-live {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid rgba(69, 214, 186, .2);
  border-radius: 999px;
  background: rgba(30, 192, 163, .08);
  color: #75e7ce;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.security-spectrum-live i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2de2c4;
  box-shadow: 0 0 0 5px rgba(45, 226, 196, .1), 0 0 15px rgba(45, 226, 196, .7);
  animation: spectrumPulse 2.2s ease-in-out infinite;
}
.security-spectrum-live b { font-weight: 800; }
.security-spectrum-layout {
  display: grid;
  grid-template-columns: minmax(240px, .94fr) minmax(180px, .72fr);
  align-items: center;
  gap: 18px;
  margin-top: 10px;
}
.security-spectrum-chart {
  position: relative;
  min-width: 0;
  aspect-ratio: 1.09;
  display: grid;
  place-items: center;
}
.security-spectrum-chart svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 330px;
  overflow: visible;
}
.spectrum-grid polygon,
.spectrum-grid path {
  fill: none;
  stroke: rgba(113, 159, 218, .16);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.spectrum-grid polygon:last-of-type { stroke: rgba(113, 159, 218, .28); }
.spectrum-area {
  fill: url(#spectrumFill);
  stroke: url(#spectrumStroke);
  stroke-width: 3;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  transition: points .4s ease;
}
.spectrum-nodes circle {
  fill: #eef8ff;
  stroke: #3f8cff;
  stroke-width: 3;
  vector-effect: non-scaling-stroke;
}
.spectrum-nodes circle:nth-child(1) { stroke: #2de2c4; }
.spectrum-nodes circle:nth-child(2) { stroke: #3f8cff; }
.spectrum-nodes circle:nth-child(3) { stroke: #ffbd4a; }
.spectrum-nodes circle:nth-child(4) { stroke: #a260ff; }
.spectrum-nodes circle:nth-child(5) { stroke: #ff5f91; }
.spectrum-nodes circle:nth-child(6) { stroke: #52c8df; }
.security-spectrum-score {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 78px;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  display: grid;
  grid-template-columns: auto auto;
  place-content: center;
  align-items: end;
  border: 1px solid rgba(96, 158, 240, .26);
  border-radius: 50%;
  background: rgba(4, 22, 50, .92);
  box-shadow: 0 0 0 9px rgba(13, 52, 100, .32), 0 12px 35px rgba(0, 11, 34, .42);
  backdrop-filter: blur(10px);
}
.security-spectrum-score strong {
  color: #fff;
  font-size: 26px;
  line-height: 1;
}
.security-spectrum-score span {
  color: #86a4cb;
  font-size: 9px;
  padding-bottom: 2px;
}
.security-spectrum-score small {
  grid-column: 1 / -1;
  justify-self: center;
  margin-top: 4px;
  color: #51dfc3;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
}
.security-spectrum-legend {
  display: grid;
  gap: 7px;
  min-width: 0;
}
.security-spectrum-legend > div {
  display: grid;
  grid-template-columns: 10px minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(101, 153, 220, .11);
  border-radius: 11px;
  background: rgba(4, 22, 49, .42);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.security-spectrum-legend > div:hover {
  transform: translateX(3px);
  border-color: rgba(89, 152, 240, .28);
  background: rgba(10, 37, 77, .62);
}
.security-spectrum-legend i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  box-shadow: 0 0 12px currentColor;
}
.security-spectrum-legend .spectrum-www { color:#2de2c4; background:#2de2c4; }
.security-spectrum-legend .spectrum-tls { color:#3f8cff; background:#3f8cff; }
.security-spectrum-legend .spectrum-dns { color:#ffbd4a; background:#ffbd4a; }
.security-spectrum-legend .spectrum-mail { color:#a260ff; background:#a260ff; }
.security-spectrum-legend .spectrum-cve { color:#ff5f91; background:#ff5f91; }
.security-spectrum-legend .spectrum-exposure { color:#52c8df; background:#52c8df; }
.security-spectrum-legend span {
  display: grid;
  min-width: 0;
  gap: 2px;
}
.security-spectrum-legend strong {
  color: #ecf5ff;
  font-size: 10px;
}
.security-spectrum-legend small {
  overflow: hidden;
  color: #7893b7;
  font-size: 8px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.security-spectrum-legend b {
  min-width: 27px;
  color: #f7fbff;
  font-size: 13px;
  text-align: right;
}
.security-spectrum-legend > div.is-strong b { color:#5ee6c9; }
.security-spectrum-legend > div.is-medium b { color:#ffcb62; }
.security-spectrum-legend > div.is-low b { color:#ff769c; }
.security-spectrum-footer {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(94, 149, 218, .13);
}
.security-spectrum-footer span {
  max-width: 58ch;
  color: #7f9abc;
  font-size: 8px;
  line-height: 1.5;
}
.security-spectrum-footer a {
  flex: 0 0 auto;
  color: #50e2c6;
  font-size: 9px;
  font-weight: 850;
  text-decoration: none;
}
[data-security-spectrum][data-spectrum-mode="result"] .security-spectrum-panel {
  border-color: rgba(45, 226, 196, .32);
}
[data-security-spectrum][data-spectrum-mode="result"] .security-spectrum-live {
  color: #b8fbee;
  background: rgba(45, 226, 196, .12);
}
@keyframes spectrumPulse {
  0%,100% { transform: scale(.9); opacity:.78; }
  50% { transform: scale(1.15); opacity:1; }
}
@media (max-width: 1120px) {
  .security-spectrum-layout { grid-template-columns: minmax(230px, .9fr) minmax(170px, .72fr); gap: 12px; }
  .security-spectrum-panel { padding: 15px; }
}
@media (max-width: 980px) {
  .platform-spectrum-visual { width: 100%; }
  .security-spectrum-layout { grid-template-columns: minmax(260px, .82fr) minmax(240px, 1fr); }
  .security-spectrum-chart svg { max-height: 300px; }
}
@media (max-width: 680px) {
  .security-spectrum-panel { padding: 14px; border-radius: 17px; }
  .security-spectrum-head { align-items: flex-start; }
  .security-spectrum-live b { display:none; }
  .security-spectrum-live { padding: 8px; }
  .security-spectrum-layout { grid-template-columns: 1fr; gap: 4px; }
  .security-spectrum-chart { max-width: 380px; width: 100%; margin-inline: auto; }
  .security-spectrum-legend { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .security-spectrum-legend > div { padding: 8px; }
  .security-spectrum-footer { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 420px) {
  .security-spectrum-legend { grid-template-columns: 1fr; }
  .security-spectrum-legend small { white-space: normal; }
  .security-spectrum-score { width: 68px; }
  .security-spectrum-score strong { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  .security-spectrum-live i { animation: none; }
  .security-spectrum-legend > div { transition: none; }
}
:root[data-theme="light"] .security-spectrum-panel {
  background:
    radial-gradient(circle at 15% 8%, rgba(19, 181, 151, .1), transparent 30%),
    radial-gradient(circle at 88% 22%, rgba(128, 77, 232, .1), transparent 30%),
    linear-gradient(145deg, #f9fcff, #eef5fd);
  border-color: rgba(70, 121, 187, .2);
  box-shadow: 0 20px 50px rgba(47, 79, 121, .12);
}
:root[data-theme="light"] .security-spectrum-head > div > strong,
:root[data-theme="light"] .security-spectrum-legend strong,
:root[data-theme="light"] .security-spectrum-legend b { color:#102846; }
:root[data-theme="light"] .security-spectrum-legend > div { background:rgba(255,255,255,.62); border-color:rgba(71,119,179,.13); }
:root[data-theme="light"] .security-spectrum-score { background:rgba(246,250,255,.95); border-color:rgba(64,116,184,.22); }
:root[data-theme="light"] .security-spectrum-score strong { color:#102846; }
:root[data-theme="light"] .spectrum-grid polygon,
:root[data-theme="light"] .spectrum-grid path { stroke:rgba(61,105,163,.16); }

/* =========================================================
   Cyberocena v7.59 — wider homepage hero and modern scan preview
   ========================================================= */
.public-home-page .hero.hero-wide-v759 {
  min-height: 650px !important;
  display: grid !important;
  grid-template-columns: minmax(680px, 1.12fr) minmax(430px, .88fr) !important;
  gap: clamp(42px, 5vw, 84px) !important;
  align-items: center !important;
  padding: 62px max(24px, calc((100vw - 1500px) / 2)) 72px !important;
  overflow: hidden !important;
}
.public-home-page .hero.hero-wide-v759 .hero-content {
  width: 100% !important;
  max-width: 920px !important;
  text-align: left !important;
}
.public-home-page .hero.hero-wide-v759 h1,
.public-home-page .hero.hero-wide-v759 #hero-title {
  max-width: 860px !important;
  margin: 16px 0 16px !important;
  font-size: clamp(50px, 4.5vw, 72px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
}
.public-home-page .hero.hero-wide-v759 > .hero-content > p {
  max-width: 760px !important;
  margin: 0 !important;
  font-size: 17px !important;
  line-height: 1.66 !important;
}
.public-home-page .hero-value-chips {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: min(100%, 780px);
  margin-top: 20px;
}
.public-home-page .hero-value-chips > span {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  min-height: 50px;
  padding: 10px 12px;
  border: 1px solid rgba(91,157,238,.16);
  border-radius: 13px;
  background: rgba(8,31,64,.54);
}
.public-home-page .hero-value-chips b {
  color: #5de4c7;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .04em;
}
.public-home-page .hero-value-chips small {
  min-width: 0;
  color: #8ea5c3;
  font-size: 10px;
  line-height: 1.35;
}
.public-home-page .hero.hero-wide-v759 .scan-bar {
  width: 100% !important;
  max-width: 960px !important;
  margin-top: 22px !important;
}
.public-home-page .hero.hero-wide-v759 .hero-account-path {
  max-width: 960px !important;
}
.public-home-page .hero-command-visual {
  display: flex !important;
  width: 100% !important;
  max-width: 540px !important;
  min-width: 0 !important;
  height: auto !important;
  justify-self: end !important;
  align-items: center;
}
.public-home-page .hero-command-card {
  width: 100%;
  padding: 20px;
  border: 1px solid rgba(91,157,238,.24);
  border-radius: 26px;
  background:
    radial-gradient(circle at 92% 6%, rgba(45,226,196,.12), transparent 28%),
    radial-gradient(circle at 8% 92%, rgba(84,116,255,.13), transparent 34%),
    linear-gradient(145deg, rgba(8,32,68,.98), rgba(4,20,45,.98));
  box-shadow: 0 36px 90px rgba(0,8,28,.42), inset 0 1px 0 rgba(255,255,255,.035);
}
.public-home-page .hero-command-head,
.public-home-page .hero-command-target,
.public-home-page .hero-command-overview,
.public-home-page .hero-command-events article,
.public-home-page .hero-command-card footer {
  display: flex;
  align-items: center;
}
.public-home-page .hero-command-head {
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(109,159,223,.13);
}
.public-home-page .hero-command-head > div {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.public-home-page .hero-command-head small,
.public-home-page .hero-command-head b {
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.public-home-page .hero-command-head small { color: #8ea7c8; }
.public-home-page .hero-command-head b {
  padding: 6px 8px;
  border-radius: 999px;
  color: #66e7cc;
  background: rgba(45,226,196,.1);
  border: 1px solid rgba(45,226,196,.18);
}
.public-home-page .hero-command-live {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2de2c4;
  box-shadow: 0 0 0 5px rgba(45,226,196,.09), 0 0 16px rgba(45,226,196,.6);
}
.public-home-page .hero-command-target {
  gap: 12px;
  margin-top: 16px;
  padding: 13px;
  border: 1px solid rgba(99,157,233,.14);
  border-radius: 16px;
  background: rgba(7,27,59,.65);
}
.public-home-page .hero-command-target-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  border-radius: 12px;
  color: #061929;
  background: linear-gradient(135deg,#57e4c6,#58a7ff);
  font-size: 14px;
  font-weight: 950;
}
.public-home-page .hero-command-target > div { display:grid; min-width:0; }
.public-home-page .hero-command-target small { color:#738eaf; font-size:9px; }
.public-home-page .hero-command-target strong { margin-top:3px; color:#eff7ff; font-size:13px; }
.public-home-page .hero-command-target em {
  margin-left:auto;
  padding:5px 7px;
  border-radius:8px;
  color:#7db7ff;
  background:rgba(52,125,226,.1);
  font-size:8px;
  font-style:normal;
  text-transform:uppercase;
}
.public-home-page .hero-command-overview {
  gap: 18px;
  margin-top: 16px;
}
.public-home-page .hero-command-score {
  --score: 92;
  position: relative;
  width: 116px;
  aspect-ratio: 1;
  flex: 0 0 116px;
  display: grid;
  grid-template-columns: auto auto;
  place-content: center;
  align-items: end;
  border-radius: 50%;
  background:
    radial-gradient(circle at center, #071b3a 0 55%, transparent 56%),
    conic-gradient(#2de2c4 calc(var(--score) * 1%), rgba(61,111,176,.17) 0);
  box-shadow: 0 18px 38px rgba(0,10,35,.32);
}
.public-home-page .hero-command-score strong { color:#fff; font-size:34px; line-height:1; }
.public-home-page .hero-command-score > span { color:#7892b3; font-size:10px; padding-bottom:4px; }
.public-home-page .hero-command-score small {
  grid-column:1/-1;
  justify-self:center;
  margin-top:5px;
  color:#54dfc1;
  font-size:11px;
  font-weight:950;
}
.public-home-page .hero-command-summary {
  flex:1;
  display:grid;
  gap:8px;
}
.public-home-page .hero-command-summary > span {
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:9px 11px;
  border-radius:11px;
  background:rgba(8,29,60,.72);
  border:1px solid rgba(89,145,214,.11);
}
.public-home-page .hero-command-summary small { color:#86a0c1; font-size:9px; }
.public-home-page .hero-command-summary b { font-size:12px; }
.public-home-page .hero-command-summary .is-good { color:#52dfbd; }
.public-home-page .hero-command-summary .is-medium { color:#ffc75b; }
.public-home-page .hero-command-spectrum {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  align-items:end;
  height:92px;
  margin-top:16px;
  padding:12px 12px 9px;
  border:1px solid rgba(96,150,218,.11);
  border-radius:15px;
  background:rgba(5,22,48,.46);
}
.public-home-page .hero-command-spectrum span {
  position:relative;
  height:100%;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}
.public-home-page .hero-command-spectrum i {
  width:100%;
  max-width:32px;
  height:calc(var(--value) * .64%);
  min-height:18px;
  border-radius:8px 8px 4px 4px;
  background:linear-gradient(180deg,var(--tone),color-mix(in srgb,var(--tone) 28%,transparent));
  box-shadow:0 0 18px color-mix(in srgb,var(--tone) 25%,transparent);
}
.public-home-page .hero-command-spectrum small {
  position:absolute;
  bottom:-1px;
  transform:translateY(100%);
  color:#6f89aa;
  font-size:7px;
  font-weight:900;
}
.public-home-page .hero-command-events {
  display:grid;
  gap:8px;
  margin-top:20px;
}
.public-home-page .hero-command-events article {
  gap:10px;
  padding:10px 11px;
  border:1px solid rgba(98,151,218,.11);
  border-radius:12px;
  background:rgba(7,26,55,.62);
}
.public-home-page .hero-command-events article > span {
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  flex:0 0 28px;
  border-radius:9px;
  font-size:11px;
  font-weight:950;
}
.public-home-page .hero-command-events .is-good { color:#53dfbe; background:rgba(45,226,196,.1); }
.public-home-page .hero-command-events .is-warning { color:#ffc55b; background:rgba(255,189,74,.1); }
.public-home-page .hero-command-events article > div { display:grid; min-width:0; }
.public-home-page .hero-command-events strong { color:#edf6ff; font-size:10px; }
.public-home-page .hero-command-events small { margin-top:2px; color:#708baa; font-size:8px; }
.public-home-page .hero-command-events article > b { margin-left:auto; color:#92b7e8; font-size:10px; }
.public-home-page .hero-command-card footer {
  justify-content:space-between;
  gap:12px;
  margin-top:14px;
  padding-top:13px;
  border-top:1px solid rgba(101,154,220,.12);
}
.public-home-page .hero-command-card footer span,
.public-home-page .hero-command-card footer strong { font-size:8px; }
.public-home-page .hero-command-card footer span { color:#6f8aa9; }
.public-home-page .hero-command-card footer i {
  display:inline-block;
  width:6px;
  height:6px;
  margin-right:6px;
  border-radius:50%;
  background:#2de2c4;
}
.public-home-page .hero-command-card footer strong { color:#63e3c8; }

@media (max-width: 1240px) {
  .public-home-page .hero.hero-wide-v759 {
    grid-template-columns: minmax(560px,1.1fr) minmax(360px,.9fr) !important;
    gap: 34px !important;
  }
  .public-home-page .hero-command-card { padding:16px; }
  .public-home-page .hero-command-score { width:102px; flex-basis:102px; }
}
@media (max-width: 1020px) {
  .public-home-page .hero.hero-wide-v759 {
    min-height:0 !important;
    grid-template-columns:1fr !important;
    padding:44px 24px 56px !important;
  }
  .public-home-page .hero.hero-wide-v759 .hero-content {
    max-width:940px !important;
    margin-inline:auto !important;
    text-align:center !important;
  }
  .public-home-page .hero.hero-wide-v759 h1,
  .public-home-page .hero.hero-wide-v759 #hero-title,
  .public-home-page .hero.hero-wide-v759 > .hero-content > p,
  .public-home-page .hero.hero-wide-v759 .scan-bar,
  .public-home-page .hero.hero-wide-v759 .hero-account-path,
  .public-home-page .hero-value-chips {
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .public-home-page .hero-title-secondary,
  .public-home-page .scan-examples,
  .public-home-page .hero-trust { justify-content:center !important; }
  .public-home-page .hero-command-visual { display:none !important; }
}
@media (max-width: 760px) {
  .public-home-page .hero.hero-wide-v759 { padding:32px 12px 44px !important; }
  .public-home-page .hero.hero-wide-v759 .hero-content { text-align:left !important; }
  .public-home-page .hero.hero-wide-v759 h1,
  .public-home-page .hero.hero-wide-v759 #hero-title { font-size:clamp(36px,11vw,50px) !important; }
  .public-home-page .hero.hero-wide-v759 > .hero-content > p { font-size:15px !important; }
  .public-home-page .hero-title-secondary,
  .public-home-page .scan-examples,
  .public-home-page .hero-trust { justify-content:flex-start !important; }
  .public-home-page .hero-value-chips {
    grid-template-columns:1fr;
    margin-left:0 !important;
    margin-right:0 !important;
  }
}

:root[data-theme="light"] .public-home-page .hero-value-chips > span,
:root[data-theme="light"] .public-home-page .hero-command-target,
:root[data-theme="light"] .public-home-page .hero-command-summary > span,
:root[data-theme="light"] .public-home-page .hero-command-spectrum,
:root[data-theme="light"] .public-home-page .hero-command-events article {
  background:rgba(255,255,255,.72);
  border-color:rgba(61,106,164,.15);
}
:root[data-theme="light"] .public-home-page .hero-command-card {
  background:radial-gradient(circle at 92% 6%,rgba(45,226,196,.1),transparent 28%),linear-gradient(145deg,#f9fcff,#edf5fd);
  box-shadow:0 30px 70px rgba(44,74,112,.16);
}
:root[data-theme="light"] .public-home-page .hero-command-target strong,
:root[data-theme="light"] .public-home-page .hero-command-events strong,
:root[data-theme="light"] .public-home-page .hero-command-score strong { color:#102846; }

/* v7.59 final grid corrections for legacy hero rules. */
.public-home-page .hero.hero-wide-v759 > .hero-orb {
  position: absolute !important;
  pointer-events: none !important;
}
.public-home-page .hero.hero-wide-v759 .hero-command-visual {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
}
.public-home-page .hero.hero-wide-v759 .hero-content {
  grid-column: 1 !important;
  grid-row: 1 !important;
}
@media (max-width:1020px) {
  .public-home-page .hero.hero-wide-v759 .hero-content { grid-column:1 !important; grid-row:auto !important; }
  .public-home-page .hero.hero-wide-v759 .hero-command-visual { display:none !important; }
}

/* =========================================================
   Cyberocena v7.60 — responsive public UI, contrast and live hero dashboard
   ========================================================= */

/* Readability and resilient layout shared by all public subpages. */
:root:not([data-theme="light"]) {
  --muted: #a8bbcf;
  --muted-2: #89a0b8;
  --line: rgba(159, 188, 226, .19);
  --line-strong: rgba(159, 188, 226, .32);
}
.public-site-page,
.public-site-page * { min-width: 0; }
.public-site-page :where(p, li) { overflow-wrap: break-word; }
.public-site-page :where(img, video, iframe, canvas) { max-width: 100%; }
.public-site-page :where(input, select, textarea) {
  color: var(--text);
  caret-color: var(--primary);
}
.public-site-page :where(input, textarea)::placeholder { color: color-mix(in srgb, var(--muted) 86%, transparent); opacity: 1; }
.public-site-page :where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--blue) 38%, transparent);
  outline-offset: 3px;
}
.public-site-page :where(button, .button, summary, select) { touch-action: manipulation; }
.public-site-page table { display: block; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
:root:not([data-theme="light"]) .public-site-page :where(.listing-hero p, .section-heading p, .tool-card p, .catalog-tool-card p, .knowledge-card-full p, .legal-content p, .safe-use-grid p, .about-page p, .dora-page p, .home-account-section p, .home-change-copy p, .home-remediation-copy p, .platform-copy p, .api-section p) {
  color: #b2c3d6;
}
:root:not([data-theme="light"]) .public-site-page :where(.tool-category, .section-kicker, small) { color: #98aec6; }
:root[data-theme="light"] .public-site-page :where(.tool-category, .section-kicker, small) { color: #587188; }

/* Approved v7.60 homepage hero. */
.public-home-page .hero.hero-wide-v760 {
  position: relative;
  min-height: 690px !important;
  display: grid !important;
  grid-template-columns: minmax(600px, 1.08fr) minmax(460px, .92fr) !important;
  align-items: center !important;
  gap: clamp(34px, 4.5vw, 72px) !important;
  padding: 58px max(24px, calc((100vw - 1500px) / 2)) 66px !important;
  overflow: hidden !important;
  isolation: isolate;
  background:
    radial-gradient(circle at 80% 16%, rgba(53, 89, 255, .17), transparent 31%),
    radial-gradient(circle at 11% 15%, rgba(31, 218, 190, .1), transparent 28%),
    linear-gradient(180deg, #050d19 0%, #061426 68%, var(--bg) 100%);
}
.public-home-page .hero.hero-wide-v760::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  opacity: .24;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(110, 151, 211, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(110, 151, 211, .12) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, #000 0%, rgba(0,0,0,.82) 62%, transparent 100%);
}
.public-home-page .hero.hero-wide-v760::after { height: 80px; }
.public-home-page .hero.hero-wide-v760 > .hero-orb { position: absolute !important; pointer-events: none !important; z-index: -1; }
.public-home-page .hero.hero-wide-v760 .hero-content {
  width: 100%;
  max-width: 850px;
  text-align: left !important;
  position: relative;
  z-index: 2;
}
.public-home-page .hero.hero-wide-v760 .eyebrow {
  width: fit-content;
  margin: 0;
  color: #6be7c8;
  background: rgba(21, 177, 144, .09);
  border-color: rgba(80, 226, 194, .22);
}
.public-home-page .hero.hero-wide-v760 h1,
.public-home-page .hero.hero-wide-v760 #hero-title {
  width: min(860px, 100%) !important;
  max-width: 860px !important;
  display: grid !important;
  justify-items: start !important;
  gap: 0 !important;
  margin: 18px 0 19px !important;
  font-size: clamp(52px, 5vw, 78px) !important;
  line-height: .99 !important;
  letter-spacing: -.05em !important;
  text-wrap: balance;
}
.public-home-page .hero.hero-wide-v760 .hero-title-primary { color: #f8fbff; }
.public-home-page .hero.hero-wide-v760 .hero-title-secondary {
  display: block !important;
  margin: 0 !important;
  color: transparent;
  background: linear-gradient(90deg, #287cff 0%, #16c8f5 56%, #59e4c4 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
.public-home-page .hero.hero-wide-v760 > .hero-content > p {
  width: min(720px, 100%);
  margin: 0 !important;
  color: #c7d4e4;
  font-size: clamp(16px, 1.3vw, 18px) !important;
  line-height: 1.65 !important;
}
.public-home-page .hero.hero-wide-v760 .hero-value-chips {
  width: min(760px, 100%);
  margin: 20px 0 0 !important;
}
.public-home-page .hero.hero-wide-v760 .hero-value-chips > span {
  min-height: 56px;
  border-color: rgba(88, 157, 244, .2);
  background: linear-gradient(145deg, rgba(12, 38, 73, .72), rgba(7, 25, 52, .64));
}
.public-home-page .hero.hero-wide-v760 .hero-value-chips b { color: #61e9c9; font-size: 13px; }
.public-home-page .hero.hero-wide-v760 .hero-value-chips small { color: #a7bbd1; font-size: 10.5px; }

/* Long scan field and predictable dropdown order. */
.public-home-page .hero.hero-wide-v760 .scan-bar {
  width: min(900px, 100%) !important;
  max-width: 900px !important;
  min-height: 82px;
  display: grid !important;
  grid-template-columns: minmax(300px, 1fr) minmax(210px, .42fr) 184px;
  grid-template-areas: "target scope submit";
  align-items: stretch;
  gap: 10px !important;
  margin: 24px 0 0 !important;
  padding: 9px !important;
  border: 1px solid rgba(91, 151, 231, .34) !important;
  border-radius: 17px !important;
  background: rgba(5, 20, 43, .88) !important;
  box-shadow: 0 22px 58px rgba(0, 8, 28, .36), inset 0 1px 0 rgba(255,255,255,.03) !important;
  backdrop-filter: blur(18px);
  overflow: visible !important;
  z-index: 20 !important;
}
.public-home-page .hero.hero-wide-v760 .scan-tool-icon { display: none !important; }
.public-home-page .hero.hero-wide-v760 .scan-target-field { grid-area: target; width: 100%; min-width: 0; }
.public-home-page .hero.hero-wide-v760 .scan-target-entry {
  min-height: 61px;
  height: 100%;
  padding-inline: 15px;
  border: 1px solid rgba(105, 158, 225, .2) !important;
  border-radius: 12px !important;
  background: rgba(10, 31, 61, .74) !important;
}
.public-home-page .hero.hero-wide-v760 .scan-target-entry input {
  width: 100%;
  min-width: 0;
  color: #f4f8ff !important;
  font-size: 15px !important;
}
.public-home-page .hero.hero-wide-v760 .target-label-icon { filter: saturate(.65); opacity: .84; }
.public-home-page .hero.hero-wide-v760 .target-input-hint,
.public-home-page .hero.hero-wide-v760 .target-input-error { padding-left: 8px; color: #9fb2c9 !important; }
.public-home-page .hero.hero-wide-v760 .custom-tool-select { grid-area: scope; min-width: 0 !important; }
.public-home-page .hero.hero-wide-v760 .custom-tool-select > label { position: absolute; width: 1px; height: 1px; clip: rect(0 0 0 0); overflow: hidden; }
.public-home-page .hero.hero-wide-v760 .tool-select-button {
  min-height: 61px !important;
  height: 100%;
  border-radius: 12px !important;
  border-color: rgba(105, 158, 225, .2) !important;
  background: rgba(10, 31, 61, .74) !important;
}
.public-home-page .hero.hero-wide-v760 .tool-select-button-copy strong { color: #eef6ff; }
.public-home-page .hero.hero-wide-v760 .tool-select-button-copy small { color: #9fb4cb; }
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit {
  grid-area: submit;
  display: inline-flex !important;
  min-height: 61px !important;
  height: 100% !important;
  justify-content: center;
  gap: 12px;
  padding: 0 17px !important;
  color: white !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #176cff, #074ee3 58%, #1644cf) !important;
  box-shadow: 0 13px 28px rgba(26, 97, 255, .34) !important;
}
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit { display: none !important; }
.public-home-page .hero.hero-wide-v760 .selector-wrap:not(.is-hidden) {
  grid-column: 1 / 3;
  grid-row: 2;
}
.public-home-page .hero.hero-wide-v760 .tool-select-dropdown {
  z-index: 500 !important;
  width: min(430px, calc(100vw - 32px));
  right: 0;
  left: auto;
}
.public-home-page .hero.hero-wide-v760 .scan-examples { margin-top: 12px; justify-content: flex-start; }
.public-home-page .hero.hero-wide-v760 .scan-examples > span { color: #9eb1c7; }
.public-home-page .hero.hero-wide-v760 .scan-examples button { color: #b8c9dc; border-color: rgba(123, 166, 222, .2); }
.public-home-page .hero.hero-wide-v760 .hero-trust { justify-content: flex-start; gap: 12px 24px; margin-top: 18px; color: #a9bfd4; }
.public-home-page .hero.hero-wide-v760 .hero-trust span::first-letter { color: #42d9a7; }
.public-home-page .hero.hero-wide-v760 .scan-consent { max-width: 820px; color: #93a9c0 !important; }
.public-home-page .hero.hero-wide-v760 .scan-consent a { color: #79b9ff; text-decoration: underline; text-decoration-color: rgba(121,185,255,.4); text-underline-offset: 3px; }
.public-home-page .hero.hero-wide-v760 .hero-account-path {
  width: min(900px, 100%);
  max-width: 900px !important;
  margin: 18px 0 0 !important;
  border-color: rgba(88, 151, 231, .2);
  background: rgba(7, 25, 51, .66);
}
.public-home-page .hero.hero-wide-v760 .hero-account-path small { color: #9db1c7; }

/* Colorful dynamic right-side dashboard. */
.public-home-page .hero-security-overview {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  max-width: 610px !important;
  min-width: 0 !important;
  height: auto !important;
  justify-self: end !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 3;
}
.security-live-card {
  position: relative;
  width: 100%;
  padding: 18px;
  overflow: hidden;
  border: 1px solid rgba(93, 140, 242, .31);
  border-radius: 25px;
  background:
    radial-gradient(circle at 91% 8%, rgba(58, 89, 255, .18), transparent 31%),
    radial-gradient(circle at 5% 93%, rgba(117, 70, 255, .13), transparent 31%),
    linear-gradient(145deg, rgba(9, 27, 59, .98), rgba(4, 16, 36, .98));
  box-shadow: 0 38px 90px rgba(0, 5, 25, .52), inset 0 1px 0 rgba(255,255,255,.045);
}
.security-live-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .36;
  background: linear-gradient(120deg, transparent 0 42%, rgba(68, 154, 255, .06) 52%, transparent 62%);
  transform: translateX(-80%);
  animation: security-card-shine 9s ease-in-out infinite;
}
@keyframes security-card-shine { 0%,70%,100% { transform: translateX(-80%); } 82% { transform: translateX(80%); } }
.security-live-head,
.security-trend-panel header,
.security-distribution-panel header,
.security-activity-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.security-live-head {
  position: relative;
  z-index: 1;
  padding: 0 2px 15px;
  border-bottom: 1px solid rgba(122, 164, 223, .14);
}
.security-live-head > div { display: inline-flex; align-items: center; gap: 10px; }
.security-live-head strong { color: #f5f8ff; font-size: 13px; }
.security-live-dot { width: 8px; height: 8px; border-radius: 50%; background: #39e6b5; box-shadow: 0 0 0 5px rgba(57,230,181,.09), 0 0 18px rgba(57,230,181,.62); }
.security-live-status { color: #5bf0bd; font-size: 8px; font-weight: 950; letter-spacing: .13em; }
.security-live-primary {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 13px;
  margin-top: 14px;
}
.security-score-panel,
.security-trend-panel,
.security-distribution-panel,
.security-activity-panel {
  border: 1px solid rgba(104, 151, 219, .14);
  border-radius: 16px;
  background: linear-gradient(150deg, rgba(10, 34, 70, .76), rgba(5, 23, 51, .68));
}
.security-score-panel {
  display: grid;
  justify-items: center;
  align-content: center;
  padding: 15px 10px;
}
.security-score-ring {
  --score: 82;
  width: 112px;
  aspect-ratio: 1;
  display: grid;
  grid-template-columns: auto auto;
  place-content: center;
  align-items: end;
  border-radius: 50%;
  background:
    radial-gradient(circle at center, #071a38 0 57%, transparent 58%),
    conic-gradient(from -45deg, #6a50ff 0 22%, #1fc7ff 37%, #36e4ae calc(var(--score) * 1%), rgba(75, 111, 170, .18) 0);
  box-shadow: 0 18px 35px rgba(0,9,34,.34), 0 0 26px rgba(45,133,255,.12);
  transition: background .65s ease;
}
.security-score-ring strong { color: #fff; font-size: 33px; line-height: 1; letter-spacing: -.05em; }
.security-score-ring span { padding-bottom: 4px; color: #91a9c6; font-size: 9px; }
.security-score-panel > b { margin-top: 9px; padding: 5px 10px; color: #62e7bf; border-radius: 999px; background: rgba(54, 227, 174, .1); font-size: 9px; }
[data-score-tone="excellent"] .security-score-panel > b { color: #6cf2c8; }
[data-score-tone="warning"] .security-score-panel > b { color: #ffd06c; background: rgba(255,190,70,.1); }
[data-score-tone="danger"] .security-score-panel > b { color: #ff8392; background: rgba(255,87,112,.1); }
.security-score-panel > small { margin-top: 7px; color: #9bb0c9; font-size: 8.5px; }
.security-trend-panel { min-width: 0; padding: 13px 13px 9px; overflow: hidden; }
.security-trend-panel header strong,
.security-distribution-panel header strong,
.security-activity-panel header strong { display: block; color: #eaf3ff; font-size: 10px; }
.security-trend-panel header small,
.security-distribution-panel header small,
.security-activity-panel header small { display: block; margin-top: 2px; color: #91a8c2; font-size: 8px; }
.security-trend-panel header > span { color: #52e3b4; font-size: 8px; font-weight: 900; }
.security-trend-legend { display: flex; gap: 12px; margin-top: 8px; color: #9aafc5; font-size: 7px; }
.security-trend-legend span::before { content: ""; display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; vertical-align: 1px; }
.security-trend-legend .is-score::before { background: #25bfff; }
.security-trend-legend .is-risk::before { background: #ffac45; }
.security-trend-legend .is-errors::before { background: #ff5d73; }
.security-trend-chart { display: block; width: 100%; height: 120px; margin-top: 5px; overflow: visible; }
.security-trend-grid path { fill: none; stroke: rgba(132, 169, 219, .13); stroke-width: 1; vector-effect: non-scaling-stroke; }
.security-trend-area { fill: url(#heroTrendArea); transition: d .75s cubic-bezier(.22,.8,.22,1); }
.security-trend-line { fill: none; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; transition: points .75s cubic-bezier(.22,.8,.22,1); filter: drop-shadow(0 0 5px rgba(48,154,255,.25)); }
.security-trend-line.is-score { stroke: url(#heroTrendLine); stroke-width: 3; }
.security-trend-line.is-risk { stroke: #ffad49; }
.security-trend-line.is-errors { stroke: #ff6078; }
.security-trend-days { display: grid; grid-template-columns: repeat(7,1fr); color: #7f96af; font-size: 7px; text-align: center; }
.security-live-secondary {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: 13px;
  margin-top: 13px;
}
.security-distribution-panel,
.security-activity-panel { padding: 13px; }
.security-distribution-body { display: grid; grid-template-columns: 88px 1fr; gap: 12px; align-items: center; margin-top: 10px; }
.security-distribution-ring {
  --good: 68;
  --warn: 22;
  width: 82px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(#36d998 0 calc(var(--good) * 1%), #ffad3d 0 calc((var(--good) + var(--warn)) * 1%), #ff5d6f 0 100%);
  box-shadow: 0 0 24px rgba(53, 216, 154, .1);
  transition: background .65s ease;
}
.security-distribution-ring span { width: 55%; aspect-ratio: 1; border-radius: 50%; background: #071a39; box-shadow: inset 0 0 16px rgba(0,0,0,.3); }
.security-distribution-legend { display: grid; gap: 7px; }
.security-distribution-legend > span { display: grid; grid-template-columns: 7px 1fr auto; align-items: center; gap: 7px; }
.security-distribution-legend i { width: 6px; height: 6px; border-radius: 50%; }
.security-distribution-legend .is-good i { background: #36d998; }
.security-distribution-legend .is-warn i { background: #ffad3d; }
.security-distribution-legend .is-bad i { background: #ff5d6f; }
.security-distribution-legend b { color: #a6bad0; font-size: 7.5px; font-weight: 650; }
.security-distribution-legend strong { color: #edf5ff; font-size: 8px; }
.security-activity-panel header > span { display: grid; justify-items: end; }
.security-activity-panel header > span b { color: #f6f9ff; font-size: 20px; line-height: 1; }
.security-activity-panel header > span em { margin-top: 3px; color: #50e4ac; font-size: 7px; font-style: normal; font-weight: 900; }
.security-activity-bars { height: 81px; display: grid; grid-template-columns: repeat(7, 1fr); align-items: end; gap: 7px; margin-top: 17px; padding: 0 3px; border-bottom: 1px solid rgba(121,160,213,.13); }
.security-activity-bars i {
  height: calc(var(--bar) * .72%);
  min-height: 14px;
  border-radius: 5px 5px 2px 2px;
  background: linear-gradient(180deg, #765eff, #2b77ff 55%, rgba(33, 110, 245, .25));
  box-shadow: 0 0 13px rgba(81, 86, 255, .23);
  transition: height .75s cubic-bezier(.22,.8,.22,1);
}
.security-live-footer {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 7px;
  margin-top: 13px;
}
.security-live-footer > span {
  min-width: 0;
  display: grid;
  grid-template-columns: 25px auto;
  grid-template-rows: auto auto;
  column-gap: 7px;
  align-items: center;
  padding: 9px;
  border: 1px solid rgba(102, 149, 215, .12);
  border-radius: 12px;
  background: rgba(6, 24, 51, .58);
}
.security-live-footer i { grid-row: 1 / 3; width: 25px; height: 25px; display: grid; place-items: center; border-radius: 8px; font-size: 9px; font-style: normal; font-weight: 950; }
.security-live-footer .is-blue { color: #4da2ff; background: rgba(50,129,255,.11); }
.security-live-footer .is-red { color: #ff6d7e; background: rgba(255,82,105,.1); }
.security-live-footer .is-orange { color: #ffba52; background: rgba(255,174,61,.1); }
.security-live-footer .is-green { color: #53e5b4; background: rgba(53,220,164,.1); }
.security-live-footer b { color: #edf5ff; font-size: 11px; }
.security-live-footer small { overflow: hidden; color: #91a6be; font-size: 6.8px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }

/* Light theme for the live dashboard. */
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 {
  background: radial-gradient(circle at 80% 16%, rgba(50, 94, 240, .13), transparent 31%), linear-gradient(180deg,#f9fcff,#eef5fb 72%,var(--bg));
}
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .hero-title-primary { color: #10263e; }
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 > .hero-content > p { color: #405c77; }
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-bar { background: rgba(255,255,255,.92) !important; border-color: rgba(49,102,176,.24) !important; box-shadow: 0 22px 52px rgba(42,74,112,.14) !important; }
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-target-entry,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .tool-select-button { background: #f5f9fd !important; border-color: rgba(50,97,157,.16) !important; }
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-target-entry input,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .tool-select-button-copy strong { color: #17314d !important; }
:root[data-theme="light"] .security-live-card { background: radial-gradient(circle at 91% 8%,rgba(67,98,255,.11),transparent 31%),linear-gradient(145deg,#f9fcff,#eaf2fb); box-shadow: 0 32px 76px rgba(41,72,112,.18); }
:root[data-theme="light"] .security-score-panel,
:root[data-theme="light"] .security-trend-panel,
:root[data-theme="light"] .security-distribution-panel,
:root[data-theme="light"] .security-activity-panel,
:root[data-theme="light"] .security-live-footer > span { background: rgba(255,255,255,.76); border-color: rgba(54,101,166,.13); }
:root[data-theme="light"] .security-live-head strong,
:root[data-theme="light"] .security-trend-panel header strong,
:root[data-theme="light"] .security-distribution-panel header strong,
:root[data-theme="light"] .security-activity-panel header strong,
:root[data-theme="light"] .security-activity-panel header > span b,
:root[data-theme="light"] .security-distribution-legend strong,
:root[data-theme="light"] .security-live-footer b { color: #17314d; }
:root[data-theme="light"] .security-score-ring { background: radial-gradient(circle at center,#f8fbff 0 57%,transparent 58%),conic-gradient(from -45deg,#6a50ff 0 22%,#1b9fd4 37%,#19ae82 calc(var(--score) * 1%),rgba(92,125,169,.18) 0); }
:root[data-theme="light"] .security-distribution-ring span { background: #f8fbff; }

/* Remaining homepage and subpage alignment. */
.public-home-page .home-tests-overview,
.public-home-page .home-account-section,
.public-home-page .home-change-monitoring,
.public-home-page .home-remediation-section,
.public-home-page .platform-section,
.public-home-page .trust-metrics,
.public-home-page .api-section { width: min(1400px, calc(100% - 40px)); margin-inline: auto; }
.public-home-page .home-tests-heading p { color: var(--muted); }
.public-site-page .catalog-tool-card,
.public-site-page .knowledge-card-full,
.public-site-page .tool-card { height: 100%; }

@media (max-width: 1240px) {
  .public-home-page .hero.hero-wide-v760 {
    grid-template-columns: minmax(520px, 1fr) minmax(400px, .86fr) !important;
    gap: 30px !important;
    padding-inline: 24px !important;
  }
  .public-home-page .hero.hero-wide-v760 h1,
  .public-home-page .hero.hero-wide-v760 #hero-title { font-size: clamp(48px, 5.1vw, 68px) !important; }
  .security-live-card { padding: 15px; }
  .security-live-primary { grid-template-columns: 135px minmax(0,1fr); }
  .security-score-ring { width: 101px; }
}

@media (max-width: 1020px) {
  .public-home-page .hero.hero-wide-v760 {
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 34px !important;
    padding: 42px 24px 58px !important;
  }
  .public-home-page .hero.hero-wide-v760 .hero-content { max-width: 920px; margin-inline: auto; }
  .public-home-page .hero.hero-wide-v760 .hero-security-overview {
    display: block !important;
    width: min(760px, 100%) !important;
    max-width: 760px !important;
    justify-self: center !important;
    margin-inline: auto;
  }
  .public-home-page .hero.hero-wide-v760 .scan-bar { max-width: 920px !important; }
  .security-live-primary { grid-template-columns: 175px minmax(0,1fr); }
  .security-score-ring { width: 122px; }
}

@media (max-width: 780px) {
  .public-home-page .hero.hero-wide-v760 { padding: 32px 14px 46px !important; }
  .public-home-page .hero.hero-wide-v760 h1,
  .public-home-page .hero.hero-wide-v760 #hero-title {
    font-size: clamp(39px, 11.6vw, 56px) !important;
    line-height: 1.02 !important;
  }
  .public-home-page .hero.hero-wide-v760 > .hero-content > p { font-size: 15px !important; line-height: 1.58 !important; }
  .public-home-page .hero.hero-wide-v760 .hero-value-chips { grid-template-columns: 1fr; gap: 8px; }
  .public-home-page .hero.hero-wide-v760 .hero-value-chips > span { min-height: 50px; }
  .public-home-page .hero.hero-wide-v760 .scan-bar {
    grid-template-columns: 1fr !important;
    grid-template-areas: "target" "mobile-submit" "scope" !important;
    min-height: 0;
    padding: 9px !important;
    gap: 9px !important;
  }
  .public-home-page .hero.hero-wide-v760 .scan-target-field { grid-area: target; }
  .public-home-page .hero.hero-wide-v760 .mobile-scan-submit {
    grid-area: mobile-submit;
    display: inline-flex !important;
    width: 100%;
    min-height: 56px !important;
    justify-content: center;
    gap: 14px;
    color: white !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg,#176cff,#0750e4 58%,#1643cc) !important;
    box-shadow: 0 12px 25px rgba(26,97,255,.3) !important;
  }
  .public-home-page .hero.hero-wide-v760 .desktop-scan-submit { display: none !important; }
  .public-home-page .hero.hero-wide-v760 .custom-tool-select { grid-area: scope; }
  .public-home-page .hero.hero-wide-v760 .tool-select-button { min-height: 54px !important; }
  .public-home-page .hero.hero-wide-v760 .selector-wrap:not(.is-hidden) { grid-column: 1; grid-row: auto; }
  .public-home-page .hero.hero-wide-v760 .scan-examples { gap: 7px; }
  .public-home-page .hero.hero-wide-v760 .scan-examples button { min-height: 34px; padding-inline: 9px; }
  .public-home-page .hero.hero-wide-v760 .hero-trust { display: grid; grid-template-columns: 1fr; gap: 7px; }
  .public-home-page .hero.hero-wide-v760 .hero-account-path { align-items: flex-start; flex-direction: column; gap: 13px; padding: 15px; }
  .public-home-page .hero.hero-wide-v760 .hero-account-path > a { width: 100%; justify-content: center; min-height: 44px; }
  .security-live-card { border-radius: 20px; }
  .security-live-primary { grid-template-columns: 140px minmax(0,1fr); }
  .security-score-ring { width: 104px; }
  .security-live-secondary { grid-template-columns: 1fr 1fr; }
  .security-live-footer { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .security-live-footer small { font-size: 7.3px; }
  .public-home-page .home-tests-overview,
  .public-home-page .home-account-section,
  .public-home-page .home-change-monitoring,
  .public-home-page .home-remediation-section,
  .public-home-page .platform-section,
  .public-home-page .trust-metrics,
  .public-home-page .api-section { width: min(100% - 24px, 1400px); }
}

@media (max-width: 560px) {
  .public-home-page .hero.hero-wide-v760 { padding-inline: 11px !important; }
  .public-home-page .hero.hero-wide-v760 .eyebrow { font-size: 9px; }
  .public-home-page .hero.hero-wide-v760 h1,
  .public-home-page .hero.hero-wide-v760 #hero-title { font-size: clamp(36px, 12vw, 48px) !important; letter-spacing: -.045em !important; }
  .public-home-page .hero.hero-wide-v760 .scan-target-entry { min-height: 56px; padding-inline: 11px; }
  .public-home-page .hero.hero-wide-v760 .scan-target-entry input { font-size: 14px !important; }
  .public-home-page .hero.hero-wide-v760 .target-input-hint { font-size: 9px; }
  .public-home-page .hero.hero-wide-v760 .scan-examples { display: none; }
  .public-home-page .hero.hero-wide-v760 .scan-consent { font-size: 10px; }
  .security-live-card { padding: 12px; border-radius: 18px; }
  .security-live-head { padding-bottom: 12px; }
  .security-live-primary { grid-template-columns: 1fr; }
  .security-score-panel { grid-template-columns: auto auto; grid-template-rows: auto auto; justify-content: center; column-gap: 15px; padding: 12px; }
  .security-score-ring { grid-row: 1 / 3; width: 94px; }
  .security-score-panel > b { align-self: end; justify-self: start; margin: 0 0 2px; }
  .security-score-panel > small { align-self: start; justify-self: start; margin-top: 3px; }
  .security-trend-chart { height: 104px; }
  .security-live-secondary { grid-template-columns: 1fr; }
  .security-distribution-body { grid-template-columns: 82px 1fr; }
  .security-activity-bars { height: 72px; }
  .security-live-footer > span { padding: 8px; }
}

@media (max-width: 390px) {
  .public-home-page .hero.hero-wide-v760 h1,
  .public-home-page .hero.hero-wide-v760 #hero-title { font-size: 36px !important; }
  .public-home-page .hero.hero-wide-v760 .hero-value-chips small { font-size: 10px; }
  .security-live-head strong { font-size: 11px; }
  .security-live-footer { grid-template-columns: 1fr 1fr; }
  .security-live-footer small { white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .security-live-card::before { animation: none; }
  .security-trend-area,
  .security-trend-line,
  .security-activity-bars i { transition: none; }
}

/* v7.60 cascade corrections for legacy high-specificity hero rules. */
.public-home-page .hero.hero-wide-v760 .hero-title-primary {
  color: #f8fbff !important;
  -webkit-text-fill-color: #f8fbff !important;
  background: none !important;
}
.public-home-page .hero.hero-wide-v760 .hero-title-secondary {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  background: linear-gradient(90deg, #287cff 0%, #16c8f5 56%, #59e4c4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

@media (max-width: 780px) {
  .public-home-page .hero.hero-wide-v760 .hero-value-chips,
  .public-home-page .hero.hero-wide-v760 .scan-examples,
  .public-home-page .hero.hero-wide-v760 .hero-trust,
  .public-home-page .hero.hero-wide-v760 .hero-account-path { display: none !important; }

  .public-home-page .hero.hero-wide-v760 #scanForm {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) !important;
    grid-template-areas: "target" "mobile-submit" "tool" !important;
  }
  .public-home-page .hero.hero-wide-v760 #scanForm > .scan-target-field {
    grid-area: target !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  .public-home-page .hero.hero-wide-v760 #scanForm > .mobile-scan-submit {
    grid-area: mobile-submit !important;
    grid-column: 1 !important;
    grid-row: 2 !important;
    display: inline-flex !important;
    color: #fff !important;
    background: linear-gradient(135deg,#176cff,#0750e4 58%,#1643cc) !important;
    box-shadow: 0 12px 25px rgba(26,97,255,.3) !important;
  }
  .public-home-page .hero.hero-wide-v760 #scanForm > .custom-tool-select {
    grid-area: tool !important;
    grid-column: 1 !important;
    grid-row: 3 !important;
    width: 100% !important;
  }
  .public-home-page .hero.hero-wide-v760 #scanForm > .desktop-scan-submit { display: none !important; }
  .public-home-page .hero.hero-wide-v760 .scan-consent {
    margin: 10px 3px 0 !important;
    font-size: 10px !important;
    line-height: 1.45 !important;
  }
}

@media (max-width: 560px) {
  .public-home-page .hero.hero-wide-v760 { gap: 20px !important; }
  .public-home-page .hero.hero-wide-v760 .hero-security-overview { margin-top: 0 !important; }
  .security-live-card { padding: 10px; }
  .security-live-primary { grid-template-columns: 101px minmax(0,1fr) !important; gap: 8px; }
  .security-score-panel {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto !important;
    justify-items: center !important;
    align-content: center !important;
    padding: 9px 6px !important;
  }
  .security-score-ring { grid-row: auto !important; width: 78px !important; }
  .security-score-ring strong { font-size: 25px; }
  .security-score-panel > b { justify-self: center !important; align-self: auto !important; margin: 6px 0 0 !important; padding: 4px 7px; font-size: 7px; }
  .security-score-panel > small { justify-self: center !important; align-self: auto !important; margin-top: 4px !important; font-size: 6.5px; text-align: center; }
  .security-trend-panel { padding: 9px 8px 7px; }
  .security-trend-chart { height: 82px !important; }
  .security-trend-legend { gap: 6px; font-size: 6px; }
  .security-trend-days { font-size: 6px; }
  .security-live-secondary { grid-template-columns: 1fr 1fr !important; gap: 8px; margin-top: 8px; }
  .security-distribution-panel,
  .security-activity-panel { padding: 9px 8px; }
  .security-distribution-body { grid-template-columns: 56px minmax(0,1fr) !important; gap: 7px; margin-top: 7px; }
  .security-distribution-ring { width: 54px !important; }
  .security-distribution-legend { gap: 4px; }
  .security-distribution-legend > span { grid-template-columns: 5px minmax(0,1fr) auto; gap: 4px; }
  .security-distribution-legend b { font-size: 6px; }
  .security-distribution-legend strong { font-size: 6.5px; }
  .security-activity-panel header > span b { font-size: 16px; }
  .security-activity-bars { height: 55px !important; gap: 4px; margin-top: 11px; }
  .security-live-footer { gap: 6px; margin-top: 8px; }
  .security-live-footer > span { padding: 7px; grid-template-columns: 22px auto; column-gap: 5px; }
  .security-live-footer i { width: 22px; height: 22px; }
  .security-live-footer b { font-size: 10px; }
  .security-live-footer small { font-size: 6px; }
}


/* =========================================================
   CYBEROCENA v7.61 — homepage account chart redesign
   ========================================================= */
.home-account-window { border-color: rgba(86, 142, 216, .24); box-shadow: 0 32px 84px rgba(0,0,0,.34), 0 0 0 1px rgba(84, 225, 174, .06) inset; }
.home-account-window-body { padding: 22px; }
.home-account-score { position: relative; overflow: hidden; }
.home-account-score::after { content: ""; position: absolute; inset: auto 18px 14px auto; width: 112px; height: 30px; background: radial-gradient(circle at 0% 90%, rgba(86, 200, 255, .14), transparent 45%), linear-gradient(135deg, rgba(86,200,255,.12), rgba(88,223,174,.05)); mask: linear-gradient(to right, transparent 0 6%, #000 6% 12%, transparent 12% 18%, #000 18% 24%, transparent 24% 30%, #000 30% 36%, transparent 36% 42%, #000 42% 48%, transparent 48% 54%, #000 54% 60%, transparent 60% 66%, #000 66% 72%, transparent 72% 78%, #000 78% 84%, transparent 84% 100%); opacity: .75; pointer-events: none; }
.home-account-mini-grid article { min-height: 86px; display: grid; align-content: center; }
.home-account-chart-card { margin-top: 14px; padding: 16px 16px 12px; border-radius: 18px; background: linear-gradient(180deg, rgba(8, 23, 41, .96), rgba(6, 18, 33, .98)); border: 1px solid rgba(113, 163, 224, .12); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.home-account-chart-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.home-account-chart-meta > small { color: #8fa9c6; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.home-account-chart-legend { display: flex; flex-wrap: wrap; gap: 14px; color: #dbe8f7; font-size: 10px; font-weight: 700; }
.home-account-chart-legend span { position: relative; padding-left: 16px; }
.home-account-chart-legend span::before { content: ""; position: absolute; left: 0; top: 50%; width: 10px; height: 10px; border-radius: 999px; transform: translateY(-50%); }
.home-account-chart-legend .is-bar::before { background: linear-gradient(180deg, #64ddc0, #2f6df4); box-shadow: 0 0 0 2px rgba(47,109,244,.12); }
.home-account-chart-legend .is-line::before { width: 14px; height: 3px; border-radius: 999px; background: linear-gradient(90deg, #56c8ff, #58dfae); box-shadow: 0 0 10px rgba(88,223,174,.45); }
.home-account-chart-shell { display: grid; grid-template-columns: 28px minmax(0, 1fr) 34px; gap: 12px; align-items: stretch; }
.home-account-chart-axis { display: flex; flex-direction: column; justify-content: space-between; min-height: 247px; padding-block: 10px 26px; color: #6d87a1; font-size: 10px; font-weight: 700; }
.home-account-chart-axis.right { color: #55dbad; text-align: right; }
.home-account-chart-axis.right strong { margin-bottom: 4px; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.home-account-chart-canvas { min-width: 0; }
.home-account-chart-svg { display: block; width: 100%; height: auto; }
.home-account-chart-svg .chart-grid line { stroke: rgba(132, 166, 212, .16); stroke-width: 1; stroke-dasharray: 4 7; }
.home-account-chart-svg .chart-bars rect { fill: url(#homeAccountBars); opacity: .96; }
.home-account-chart-svg .chart-area { fill: url(#homeAccountArea); opacity: .9; }
.home-account-chart-svg .chart-line { fill: none; stroke: url(#homeAccountLine); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; filter: url(#homeAccountGlow); }
.home-account-chart-svg .chart-dots circle { fill: #f5fffb; stroke: #58dfae; stroke-width: 3; filter: url(#homeAccountGlow); }
.home-account-chart-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); margin-top: 6px; color: #97acc3; font-size: 10px; font-weight: 700; text-align: center; }
.home-account-event { margin-top: 12px; }
.about-preview-chart i { background: linear-gradient(180deg, #56c8ff, #58dfae); box-shadow: 0 10px 22px rgba(41, 127, 255, .18); }
@media (max-width: 1100px) {
  .home-account-chart-meta { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 700px) {
  .home-account-chart-card { padding: 13px 10px 10px; border-radius: 16px; }
  .home-account-chart-meta { gap: 8px; margin-bottom: 10px; }
  .home-account-chart-meta > small, .home-account-chart-legend, .home-account-chart-axis, .home-account-chart-axis.right strong, .home-account-chart-days { font-size: 8px; }
  .home-account-chart-shell { grid-template-columns: 22px minmax(0,1fr) 24px; gap: 6px; }
  .home-account-chart-axis { min-height: 205px; padding-block: 8px 20px; }
}
:root[data-theme="light"] .home-account-chart-card { background: linear-gradient(180deg, rgba(255,255,255,.97), rgba(245,250,255,.99)); border-color: rgba(20, 48, 78, .10); box-shadow: inset 0 1px 0 rgba(255,255,255,.65); }
:root[data-theme="light"] .home-account-chart-meta > small { color: #48627f; }
:root[data-theme="light"] .home-account-chart-legend { color: #1a3148; }
:root[data-theme="light"] .home-account-chart-axis { color: #698198; }
:root[data-theme="light"] .home-account-chart-axis.right { color: #1ea877; }
:root[data-theme="light"] .home-account-chart-days { color: #50697f; }
:root[data-theme="light"] .home-account-chart-svg .chart-grid line { stroke: rgba(24, 52, 82, .12); }

/* =========================================================
   CYBEROCENA v7.62 — grouped tools, mobile picker and refined account chart
   ========================================================= */

/* Pomarańczowy CTA analizy — oddzielony od pozostałych przycisków platformy. */
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit {
  position: relative;
  overflow: hidden;
  color: #fff !important;
  border: 1px solid rgba(255, 196, 102, .52) !important;
  background: linear-gradient(128deg, #ff5c00 0%, #ff7a18 42%, #ffae35 100%) !important;
  box-shadow: 0 15px 34px rgba(255, 101, 16, .34), inset 0 1px 0 rgba(255,255,255,.34) !important;
  text-shadow: 0 1px 1px rgba(96, 35, 0, .32);
}
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit::before,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 15%, rgba(255,255,255,.25) 42%, transparent 68%);
  transform: translateX(-130%);
  transition: transform .55s ease;
  pointer-events: none;
}
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit:hover,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 20px 40px rgba(255, 101, 16, .43), inset 0 1px 0 rgba(255,255,255,.38) !important;
}
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit:hover::before,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit:hover::before { transform: translateX(130%); }
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit:focus-visible,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit:focus-visible { outline: 3px solid rgba(255, 176, 66, .38) !important; outline-offset: 3px; }
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit:disabled,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit:disabled { filter: saturate(.55); opacity: .72; transform: none !important; }

/* Mobilny selektor narzędzia jako czytelny bottom sheet. */
.tool-select-mobile-head { display: none; }
@media (max-width: 760px) {
  html.tool-select-open { overflow: hidden; }
  html.tool-select-open body::before {
    content: "";
    position: fixed;
    z-index: 2180;
    inset: 0;
    background: rgba(0, 8, 20, .76);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
  }
  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select .tool-select-dropdown,
  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
    position: fixed !important;
    z-index: 2200 !important;
    inset: auto 10px calc(10px + env(safe-area-inset-bottom)) 10px !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(78dvh, 670px) !important;
    padding: 12px !important;
    border: 1px solid rgba(99, 162, 241, .32) !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #0b2341 0%, #06162c 100%) !important;
    box-shadow: 0 30px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.04) !important;
    overflow: hidden !important;
  }
  .public-home-page .hero.hero-wide-v760 .tool-select-dropdown::before { display: none !important; }
  .tool-select-mobile-head {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 2px 2px 10px;
  }
  .tool-select-mobile-head > div { min-width: 0; display: grid; gap: 1px; }
  .tool-select-mobile-head small { color: #79a7d9; font-size: 8px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
  .tool-select-mobile-head strong { color: #f4f8ff; font-size: 17px; line-height: 1.2; }
  .tool-select-mobile-head button {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border: 1px solid rgba(112, 166, 232, .22);
    border-radius: 12px;
    color: #dceaff;
    background: rgba(255,255,255,.045);
    font-size: 25px;
    line-height: 1;
  }
  .public-home-page .hero.hero-wide-v760 .tool-select-search {
    min-height: 50px !important;
    margin-bottom: 9px !important;
    border-radius: 14px !important;
    background: #06172d !important;
    border-color: rgba(83, 148, 231, .24) !important;
  }
  .public-home-page .hero.hero-wide-v760 .tool-select-search input { font-size: 16px !important; }
  .public-home-page .hero.hero-wide-v760 .tool-select-options {
    max-height: calc(min(78dvh, 670px) - 132px) !important;
    padding: 0 3px 8px 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }
  .public-home-page .hero.hero-wide-v760 .tool-option-group { margin: 0 !important; padding: 0 0 8px !important; border: 0 !important; }
  .public-home-page .hero.hero-wide-v760 .tool-option-group + .tool-option-group { margin-top: 5px !important; padding-top: 7px !important; border-top: 1px solid rgba(97, 153, 221, .1) !important; }
  .public-home-page .hero.hero-wide-v760 .tool-option-category {
    position: sticky;
    z-index: 2;
    top: 0;
    min-height: 34px;
    padding: 7px 8px !important;
    color: #7db6f2 !important;
    background: linear-gradient(180deg, rgba(8,28,54,.98), rgba(8,28,54,.92));
    backdrop-filter: blur(8px);
  }
  .public-home-page .hero.hero-wide-v760 .tool-option {
    min-height: 54px !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0,1fr) 28px !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 7px 8px !important;
    border-radius: 13px !important;
  }
  .public-home-page .hero.hero-wide-v760 .tool-option-icon { width: 38px !important; height: 38px !important; border-radius: 11px !important; }
  .public-home-page .hero.hero-wide-v760 .tool-option-copy strong { font-size: 13px !important; line-height: 1.25 !important; white-space: normal !important; }
  .public-home-page .hero.hero-wide-v760 .tool-option-copy small { display: none !important; }
  .public-home-page .hero.hero-wide-v760 .tool-option-check { width: 26px; height: 26px; }
  .public-home-page .hero.hero-wide-v760 .tool-select-scroll-hint { display: none !important; }
}

/* Katalog pogrupowany według obszaru. */
.mobile-tool-search { display: none; }
.public-home-page .workspace {
  width: min(1480px, calc(100% - 32px)) !important;
  grid-template-columns: 205px minmax(0, 1fr) 250px !important;
  gap: 16px !important;
}
.public-home-page .tool-content { padding: 24px !important; }
.public-home-page .tool-grid.is-grouped {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
  align-items: stretch !important;
}
.tool-group {
  overflow: hidden;
  border: 1px solid rgba(91, 151, 225, .18);
  border-radius: 18px;
  background: linear-gradient(150deg, rgba(9, 35, 67, .92), rgba(5, 24, 48, .96));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}
.tool-group-heading {
  width: 100%;
  min-height: 76px;
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) auto 22px;
  gap: 13px;
  align-items: center;
  padding: 14px 16px;
  border: 0;
  color: #eef6ff;
  background: linear-gradient(90deg, rgba(28, 91, 166, .12), transparent 65%);
  text-align: left;
  cursor: pointer;
}
.tool-group-heading:hover { background: linear-gradient(90deg, rgba(39, 113, 213, .19), rgba(14, 42, 77, .04)); }
.tool-group-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(91, 159, 243, .22);
  border-radius: 13px;
  color: #68b1ff;
  background: linear-gradient(145deg, rgba(42, 112, 222, .28), rgba(27, 213, 176, .10));
  font-size: 15px;
  font-weight: 900;
}
.tool-group-copy { min-width: 0; display: grid; gap: 3px; }
.tool-group-copy strong { color: #f3f8ff; font-size: 15px; line-height: 1.25; }
.tool-group-copy small { color: #8fa6c2; font-size: 11px; line-height: 1.45; }
.tool-group-count {
  min-width: 30px;
  padding: 5px 8px;
  border-radius: 999px;
  color: #69e0c2;
  background: rgba(31, 189, 151, .11);
  border: 1px solid rgba(55, 211, 173, .15);
  text-align: center;
  font-size: 10px;
  font-weight: 900;
}
.tool-group-heading > svg { width: 20px; height: 20px; fill: none; stroke: #8ba6c4; stroke-width: 2; transition: transform .22s ease; }
.tool-group.is-open .tool-group-heading > svg { transform: rotate(180deg); }
.tool-group-panel { padding: 0 14px 14px; }
.tool-group-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
  gap: 10px;
}
.public-home-page .tool-group-grid .tool-card { min-height: 205px !important; padding: 16px !important; border-radius: 15px !important; }
.public-home-page .tool-group-grid .tool-card-copy { margin-top: 16px !important; }
.public-home-page .tool-group-grid .tool-card h3 { font-size: 15px !important; }
.public-home-page .tool-group-grid .tool-card p { font-size: 11.5px !important; line-height: 1.55 !important; }
.public-home-page .tool-group-grid .tool-card-footer { padding-top: 14px !important; }

/* Dopracowany panel i wykres w sekcji konta. */
.public-home-page .home-account-window {
  overflow: hidden;
  border: 1px solid rgba(91, 158, 237, .28) !important;
  background: radial-gradient(circle at 92% 8%, rgba(37, 91, 196, .13), transparent 32%), #06111f !important;
  box-shadow: 0 34px 86px rgba(0,0,0,.38), 0 0 42px rgba(49, 116, 255, .06) !important;
}
.public-home-page .home-account-window-body { padding: 20px !important; }
.public-home-page .home-account-score {
  min-height: 104px;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  gap: 18px;
  align-items: center !important;
  padding: 19px 21px !important;
  border-radius: 18px !important;
  background: radial-gradient(circle at 90% 10%, rgba(57, 114, 224, .13), transparent 35%), linear-gradient(135deg, rgba(22, 58, 102, .78), rgba(8, 31, 60, .94)) !important;
  border: 1px solid rgba(102, 161, 232, .19) !important;
}
.home-account-score-value { min-width: 0; display: grid; gap: 5px; }
.public-home-page .home-account-score-value small { color: #81a5ca !important; font-size: 9px !important; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.public-home-page .home-account-score-value strong { display: flex; align-items: baseline; gap: 5px; color: #f6fbff !important; font-size: 46px !important; line-height: .95 !important; }
.public-home-page .home-account-score-value em { color: #718ca8 !important; font-size: 13px !important; font-style: normal; }
.home-account-score-trend { display: grid; justify-items: end; gap: 7px; }
.public-home-page .home-account-score-trend b { color: #55e2ae !important; font-size: 10px !important; white-space: nowrap; }
.home-account-score-trend svg { width: 118px; height: 34px; overflow: visible; }
.home-account-score-trend path { fill: none; stroke: #55e2ae; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 5px rgba(85,226,174,.45)); }
.home-account-score-trend circle { fill: #d8fff1; stroke: #55e2ae; stroke-width: 2; }
.public-home-page .home-account-mini-grid { gap: 10px !important; margin-top: 10px !important; }
.public-home-page .home-account-mini-grid article {
  min-height: 78px !important;
  display: flex !important;
  align-items: center !important;
  gap: 11px;
  padding: 13px !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.032) !important;
  border-color: rgba(111, 160, 220, .12) !important;
}
.home-account-metric-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  font-size: 14px;
  font-weight: 900;
}
.home-account-metric-icon.is-blue { color: #5cb4ff; background: rgba(42, 112, 226, .18); }
.home-account-metric-icon.is-violet { color: #8f83ff; background: rgba(110, 84, 234, .16); }
.home-account-metric-icon.is-cyan { color: #5ee0d0; background: rgba(38, 184, 173, .14); }
.public-home-page .home-account-mini-grid article > div { min-width: 0; display: grid; gap: 4px; }
.public-home-page .home-account-mini-grid small { color: #879fba !important; font-size: 9px !important; }
.public-home-page .home-account-mini-grid strong { margin: 0 !important; color: #f2f8ff !important; font-size: 20px !important; line-height: 1 !important; }
.public-home-page .home-account-chart-card {
  margin-top: 12px !important;
  padding: 15px 15px 10px !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(7, 25, 47, .94), rgba(4, 17, 34, .98)) !important;
  border: 1px solid rgba(105, 158, 221, .13) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}
.public-home-page .home-account-chart-meta { align-items: flex-start !important; margin-bottom: 5px !important; }
.home-account-chart-meta > div:first-child { display: grid; gap: 2px; }
.public-home-page .home-account-chart-meta > div:first-child small { color: #83a1c0 !important; font-size: 8px !important; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.public-home-page .home-account-chart-meta > div:first-child strong { color: #eef6ff; font-size: 12px; }
.public-home-page .home-account-chart-legend { gap: 13px !important; font-size: 8.5px !important; }
.public-home-page .home-account-chart-svg { width: 100% !important; height: auto !important; display: block; overflow: visible; }
.home-account-chart-svg .chart-grid line { stroke: rgba(122, 159, 207, .16) !important; stroke-width: 1; stroke-dasharray: 4 7; }
.home-account-chart-svg .chart-y-labels text,
.home-account-chart-svg .chart-x-labels text,
.home-account-chart-svg .chart-axis-title { fill: #718aa7; font: 9px/1.2 system-ui, sans-serif; }
.home-account-chart-svg .chart-y-labels-left text { text-anchor: end; }
.home-account-chart-svg .chart-y-labels-right text { text-anchor: start; fill: #55dcae; }
.home-account-chart-svg .chart-x-labels text { text-anchor: middle; fill: #94aac1; }
.home-account-chart-svg .chart-axis-title { font-size: 9px; font-weight: 800; text-transform: uppercase; }
.home-account-chart-svg .chart-axis-title-right { text-anchor: end; fill: #55dcae; }
.home-account-chart-svg .chart-bars rect { fill: url(#homeAccountBars) !important; opacity: .96; transform-box: fill-box; transform-origin: center bottom; animation: accountBarRise .8s cubic-bezier(.2,.8,.25,1) both; }
.home-account-chart-svg .chart-bars rect:nth-child(2) { animation-delay: .06s; }
.home-account-chart-svg .chart-bars rect:nth-child(3) { animation-delay: .12s; }
.home-account-chart-svg .chart-bars rect:nth-child(4) { animation-delay: .18s; }
.home-account-chart-svg .chart-bars rect:nth-child(5) { animation-delay: .24s; }
.home-account-chart-svg .chart-bars rect:nth-child(6) { animation-delay: .30s; }
.home-account-chart-svg .chart-bars rect:nth-child(7) { animation-delay: .36s; }
.home-account-chart-svg .chart-area { fill: url(#homeAccountArea) !important; opacity: 0; animation: accountAreaFade .65s .55s ease forwards; }
.home-account-chart-svg .chart-line { fill: none !important; stroke: url(#homeAccountLine) !important; stroke-width: 3.2 !important; stroke-linecap: round; stroke-linejoin: round; filter: url(#homeAccountGlow); stroke-dasharray: 720; stroke-dashoffset: 720; animation: accountLineDraw 1.25s .25s ease forwards; }
.home-account-chart-svg .chart-dots circle { fill: #effff9 !important; stroke: #56e1aa !important; stroke-width: 3 !important; filter: url(#homeAccountGlow); opacity: 0; animation: accountDotIn .32s .9s ease forwards; }
.public-home-page .home-account-event { min-height: 57px; margin-top: 12px !important; padding: 12px 14px !important; }
.public-home-page .home-account-event > b { margin-left: auto; color: #7f9ab8; font-size: 22px; font-weight: 400; }
@keyframes accountBarRise { from { transform: scaleY(.04); opacity: .2; } to { transform: scaleY(1); opacity: .96; } }
@keyframes accountLineDraw { to { stroke-dashoffset: 0; } }
@keyframes accountAreaFade { to { opacity: .9; } }
@keyframes accountDotIn { from { opacity: 0; transform: scale(.3); transform-origin: center; } to { opacity: 1; transform: scale(1); } }

@media (max-width: 1260px) {
  .public-home-page .workspace { grid-template-columns: 205px minmax(0,1fr) !important; }
  .public-home-page .workspace-rail { grid-column: 1 / -1 !important; }
}
@media (max-width: 760px) {
  .public-home-page .workspace { width: calc(100% - 20px) !important; margin-inline: 10px !important; display: block !important; }
  .public-home-page .tool-sidebar,
  .public-home-page .workspace-rail { display: none !important; }
  .public-home-page .tool-content { padding: 15px !important; border-radius: 18px !important; }
  .public-home-page .view-controls { display: none !important; }
  .mobile-tool-search { display: grid !important; margin: 0 0 12px !important; background: #06172d !important; border-color: rgba(87, 150, 229, .23) !important; }
  .mobile-tool-search input { color: #f0f6ff !important; font-size: 16px !important; }
  .tool-group { border-radius: 15px; }
  .tool-group-heading { min-height: 68px; grid-template-columns: 40px minmax(0,1fr) auto 20px; gap: 10px; padding: 11px 12px; }
  .tool-group-icon { width: 40px; height: 40px; border-radius: 12px; }
  .tool-group-copy strong { font-size: 13px; }
  .tool-group-copy small { overflow: hidden; font-size: 9px; white-space: nowrap; text-overflow: ellipsis; }
  .tool-group-count { min-width: 27px; padding: 4px 7px; font-size: 9px; }
  .tool-group-panel { padding: 0 10px 10px; }
  .tool-group-grid { grid-template-columns: 1fr; gap: 8px; }
  .public-home-page .tool-group-grid .tool-card {
    min-height: 132px !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0,1fr) !important;
    grid-template-rows: auto auto !important;
    gap: 0 12px !important;
    padding: 13px !important;
  }
  .public-home-page .tool-group-grid .tool-card-top { grid-column: 1; grid-row: 1 / 3; display: block !important; }
  .public-home-page .tool-group-grid .tool-icon { width: 42px !important; height: 42px !important; }
  .public-home-page .tool-group-grid .tool-badge { position: absolute; top: 11px; right: 11px; }
  .public-home-page .tool-group-grid .tool-card-copy { grid-column: 2; margin-top: 0 !important; padding-right: 42px; }
  .public-home-page .tool-group-grid .tool-card h3 { margin: 3px 0 5px !important; font-size: 14px !important; }
  .public-home-page .tool-group-grid .tool-card p { display: -webkit-box; overflow: hidden; font-size: 10.5px !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .public-home-page .tool-group-grid .tool-card-footer { grid-column: 2; margin-top: 9px !important; padding-top: 9px !important; }
  .public-home-page .home-account-score { grid-template-columns: minmax(0,1fr) auto !important; padding: 15px !important; }
  .public-home-page .home-account-score-value strong { font-size: 38px !important; }
  .home-account-score-trend svg { width: 92px; }
  .public-home-page .home-account-mini-grid { grid-template-columns: 1fr !important; }
  .public-home-page .home-account-mini-grid article:nth-child(3) { grid-column: auto !important; }
  .public-home-page .home-account-chart-card { padding: 13px 8px 8px !important; }
  .public-home-page .home-account-chart-meta { padding-inline: 5px; }
  .public-home-page .home-account-chart-legend { display: none !important; }
}
@media (max-width: 430px) {
  .public-home-page .home-account-score { grid-template-columns: 1fr !important; gap: 10px; }
  .home-account-score-trend { justify-items: start; }
  .home-account-score-trend svg { display: none; }
  .home-account-chart-svg .chart-y-labels-right,
  .home-account-chart-svg .chart-axis-title-right { display: none; }
}
:root[data-theme="light"] .tool-group { background: linear-gradient(145deg,#fff,#f1f7fc); border-color: rgba(30, 76, 126, .12); }
:root[data-theme="light"] .tool-group-heading { color: #173650; background: linear-gradient(90deg,rgba(47,117,209,.07),transparent); }
:root[data-theme="light"] .tool-group-copy strong { color: #173650; }
:root[data-theme="light"] .tool-group-copy small { color: #60788f; }
:root[data-theme="light"] .public-home-page .home-account-chart-card { background: linear-gradient(180deg,#fff,#f2f7fc) !important; }
:root[data-theme="light"] .public-home-page .home-account-chart-meta > div:first-child strong { color: #173650; }
:root[data-theme="light"] .home-account-chart-svg .chart-y-labels text,
:root[data-theme="light"] .home-account-chart-svg .chart-x-labels text,
:root[data-theme="light"] .home-account-chart-svg .chart-axis-title { fill: #60788f; }
@media (prefers-reduced-motion: reduce) {
  .home-account-chart-svg .chart-bars rect,
  .home-account-chart-svg .chart-area,
  .home-account-chart-svg .chart-line,
  .home-account-chart-svg .chart-dots circle { animation: none !important; opacity: 1 !important; stroke-dashoffset: 0 !important; }
}

/* Pogrupowany katalog na podstronie /narzedzia/. */
.tools-directory-groups {
  width: min(var(--max), calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  gap: 16px;
}
.directory-tool-group {
  overflow: hidden;
  border: 1px solid rgba(91, 151, 225, .18);
  border-radius: 20px;
  background: linear-gradient(150deg, rgba(9, 35, 67, .94), rgba(5, 24, 48, .98));
  box-shadow: 0 18px 42px rgba(0,0,0,.16);
}
.directory-tool-group summary {
  min-height: 82px;
  display: grid;
  grid-template-columns: 46px minmax(0,1fr) auto 22px;
  gap: 14px;
  align-items: center;
  padding: 16px 20px;
  color: #edf6ff;
  cursor: pointer;
  list-style: none;
  background: linear-gradient(90deg, rgba(31, 100, 187, .14), transparent 70%);
}
.directory-tool-group summary::-webkit-details-marker { display: none; }
.directory-tool-group summary > span:nth-child(2) { min-width: 0; display: grid; gap: 4px; }
.directory-tool-group summary strong { font-size: 16px; line-height: 1.25; }
.directory-tool-group summary small { color: #8ea6c1; font-size: 12px; }
.directory-tool-group summary b { min-width: 32px; padding: 5px 8px; border-radius: 999px; color: #67e0be; background: rgba(37, 195, 157, .10); text-align: center; font-size: 10px; }
.directory-tool-group summary i { color: #91a9c4; font-size: 20px; font-style: normal; transition: transform .2s ease; }
.directory-tool-group[open] summary i { transform: rotate(180deg); }
.directory-group-icon { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(91, 159, 243, .22); border-radius: 14px; color: #69b1ff; background: linear-gradient(145deg, rgba(42, 112, 222, .28), rgba(27, 213, 176, .10)); font-weight: 900; }
.directory-tool-group .tools-catalog { width: auto; margin: 0; padding: 0 18px 18px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
@media (max-width: 680px) {
  .tools-directory-groups { width: calc(100% - 24px); gap: 12px; }
  .directory-tool-group { border-radius: 16px; }
  .directory-tool-group summary { min-height: 70px; grid-template-columns: 40px minmax(0,1fr) auto 18px; gap: 10px; padding: 12px; }
  .directory-group-icon { width: 40px; height: 40px; border-radius: 12px; }
  .directory-tool-group summary strong { font-size: 13px; }
  .directory-tool-group summary small { overflow: hidden; font-size: 9px; white-space: nowrap; text-overflow: ellipsis; }
  .directory-tool-group .tools-catalog { padding: 0 10px 10px; grid-template-columns: 1fr; }
}
:root[data-theme="light"] .directory-tool-group { background: linear-gradient(145deg,#fff,#f2f7fc); border-color: rgba(30, 76, 126, .12); }
:root[data-theme="light"] .directory-tool-group summary { color: #173650; }
:root[data-theme="light"] .directory-tool-group summary small { color: #60788f; }


/* v7.63 — grouped catalog first-row preview + orange CTA */
.tool-card.is-preview-hidden,
.catalog-tool-card.is-preview-hidden { display: none !important; }
.tool-group-panel-actions,
.directory-group-actions { display: flex; justify-content: flex-start; padding-top: 10px; }
.tool-group-preview-toggle,
.directory-group-preview-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(255, 170, 84, .24);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(255, 137, 38, .18), rgba(255, 96, 18, .10));
  color: #ffd7b2;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .02em;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.tool-group-preview-toggle:hover,
.directory-group-preview-toggle:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 175, 92, .45);
  background: linear-gradient(135deg, rgba(255, 150, 49, .24), rgba(255, 109, 27, .14));
}
.tool-group.is-preview .tool-group-panel,
.directory-tool-group.is-preview .tools-catalog { position: relative; }
.tool-group.is-preview .tool-group-panel::after,
.directory-tool-group.is-preview .tools-catalog::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 54px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(4, 18, 37, 0), rgba(4, 18, 37, .88));
}
.tool-group:not(.is-preview) .tool-group-panel::after,
.directory-tool-group:not(.is-preview) .tools-catalog::after { display: none; }
@media (max-width: 760px) {
  .tool-group-panel-actions,
  .directory-group-actions { padding-top: 8px; }
  .tool-group-preview-toggle,
  .directory-group-preview-toggle { min-height: 38px; width: 100%; font-size: 11px; }
}
:root[data-theme="light"] .tool-group-preview-toggle,
:root[data-theme="light"] .directory-group-preview-toggle {
  border-color: rgba(255, 130, 32, .18);
  background: linear-gradient(135deg, rgba(255, 156, 77, .16), rgba(255, 125, 58, .08));
  color: #9b4300;
}
:root[data-theme="light"] .tool-group.is-preview .tool-group-panel::after,
:root[data-theme="light"] .directory-tool-group.is-preview .tools-catalog::after {
  background: linear-gradient(180deg, rgba(242, 247, 252, 0), rgba(242, 247, 252, .94));
}
.hero .scan-submit,
.hero .mobile-scan-submit,
.tool-select-open .hero .scan-submit,
.tool-select-open .hero .mobile-scan-submit {
  color: #1f1102 !important;
  border: 1px solid rgba(255, 170, 77, .45) !important;
  background: linear-gradient(135deg, #ffb347 0%, #ff8a1f 46%, #ff6a00 100%) !important;
  box-shadow: 0 16px 36px rgba(255, 123, 23, .34), inset 0 1px 0 rgba(255,255,255,.26) !important;
}
.hero .scan-submit .scan-submit-copy strong,
.hero .mobile-scan-submit .mobile-scan-submit-copy strong,
.hero .scan-submit .scan-submit-copy small,
.hero .mobile-scan-submit .mobile-scan-submit-copy small,
.hero .scan-submit > svg,
.hero .mobile-scan-submit > svg { color: #1f1102 !important; fill: #1f1102 !important; stroke: #1f1102 !important; }
.hero .scan-submit:hover,
.hero .mobile-scan-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 42px rgba(255, 123, 23, .40), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
:root[data-theme="light"] .hero .scan-submit,
:root[data-theme="light"] .hero .mobile-scan-submit,
:root[data-theme="light"] .tool-select-open .hero .scan-submit,
:root[data-theme="light"] .tool-select-open .hero .mobile-scan-submit {
  color: #281400 !important;
  background: linear-gradient(135deg, #ffbe5c 0%, #ff992f 46%, #ff7308 100%) !important;
  box-shadow: 0 14px 30px rgba(255, 132, 34, .26), inset 0 1px 0 rgba(255,255,255,.35) !important;
}


/* v7.64 — home hero/account refinements */
.public-home-page .hero.hero-wide-v760 {
  gap: clamp(28px, 3vw, 44px) !important;
  align-items: center !important;
}

.public-home-page .hero.hero-wide-v760 .hero-content {
  min-width: 0;
}

.public-home-page .hero.hero-wide-v760 h1,
.public-home-page .hero.hero-wide-v760 #hero-title,
.public-home-page .section-heading h2,
.public-home-page .knowledge-heading h2,
.public-home-page .platform-copy h2,
.public-home-page .api-section h2,
.public-home-page .home-account-copy h2,
.public-home-page .home-change-copy h2,
.public-home-page .home-remediation-copy h2,
.public-home-page .trust-metrics-header h2 {
  line-height: 1.08 !important;
  letter-spacing: -.038em !important;
  text-wrap: balance;
  overflow-wrap: anywhere;
}

.public-home-page .hero.hero-wide-v760 > .hero-content > p,
.public-home-page .section-heading p,
.public-home-page .home-account-copy > p,
.public-home-page .home-change-copy > p,
.public-home-page .home-remediation-copy > p,
.public-home-page .platform-copy > p {
  line-height: 1.68 !important;
  text-wrap: pretty;
}

.public-home-page .hero.hero-wide-v760 .scan-bar {
  grid-template-columns: minmax(0, 1fr) 176px !important;
  align-items: stretch !important;
}

.public-home-page .hero.hero-wide-v760 .scan-submit,
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit,
.public-home-page .hero.hero-wide-v760 #scanForm > .mobile-scan-submit {
  color: #2b1500 !important;
  border: 1px solid rgba(255, 167, 75, .48) !important;
  background: linear-gradient(135deg, #ffb548 0%, #ff8c1a 50%, #ff6b00 100%) !important;
  box-shadow: 0 18px 36px rgba(255, 123, 22, .32), inset 0 1px 0 rgba(255,255,255,.30) !important;
}

.public-home-page .hero.hero-wide-v760 .scan-submit:hover,
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit:hover,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit:hover,
.public-home-page .hero.hero-wide-v760 #scanForm > .mobile-scan-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 22px 40px rgba(255, 123, 22, .38), inset 0 1px 0 rgba(255,255,255,.34) !important;
}

.public-home-page .hero.hero-wide-v760 .scan-submit .scan-submit-copy strong,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit .mobile-scan-submit-copy strong,
.public-home-page .hero.hero-wide-v760 .scan-submit > span:last-child,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit > span:last-child {
  color: #2b1500 !important;
}

.public-home-page .hero.hero-wide-v760 .hero-security-overview {
  width: min(100%, 560px) !important;
  max-width: 560px !important;
  min-width: 0 !important;
  justify-self: end !important;
}

.public-home-page .hero.hero-wide-v760 .security-live-card {
  width: 100% !important;
  padding: 16px !important;
  border-radius: 24px !important;
}

.public-home-page .hero.hero-wide-v760 .security-live-head strong {
  font-size: 14px !important;
}

.public-home-page .hero.hero-wide-v760 .security-live-primary {
  grid-template-columns: 132px minmax(0,1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}

.public-home-page .hero.hero-wide-v760 .security-live-secondary {
  grid-template-columns: minmax(0, 1fr) minmax(0, .92fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}

.public-home-page .hero.hero-wide-v760 .security-score-panel,
.public-home-page .hero.hero-wide-v760 .security-trend-panel,
.public-home-page .hero.hero-wide-v760 .security-distribution-panel,
.public-home-page .hero.hero-wide-v760 .security-activity-panel,
.public-home-page .hero.hero-wide-v760 .security-live-footer > span {
  min-width: 0 !important;
}

.public-home-page .hero.hero-wide-v760 .security-score-ring {
  width: 106px !important;
}

.public-home-page .hero.hero-wide-v760 .security-score-ring strong {
  font-size: 31px !important;
}

.public-home-page .hero.hero-wide-v760 .security-trend-panel header strong,
.public-home-page .hero.hero-wide-v760 .security-distribution-panel header strong,
.public-home-page .hero.hero-wide-v760 .security-activity-panel header strong {
  font-size: 10.5px !important;
}

.public-home-page .hero.hero-wide-v760 .security-trend-days,
.public-home-page .hero.hero-wide-v760 .security-live-footer small {
  white-space: normal !important;
}

.public-home-page .tool-card h3,
.public-home-page .catalog-tool-card h2,
.public-home-page .directory-tool-group summary strong,
.public-home-page .tool-group-copy strong {
  line-height: 1.22 !important;
  overflow-wrap: anywhere;
}

.public-home-page .home-account-chart-card {
  margin-top: 16px !important;
  padding: 18px 18px 14px !important;
}

.public-home-page .home-account-chart-meta {
  margin-bottom: 10px !important;
}

.public-home-page .home-account-chart-meta > div:first-child strong {
  font-size: 13px !important;
}

.public-home-page .home-account-chart-legend {
  gap: 12px !important;
  font-size: 9px !important;
}

@media (max-width: 1180px) {
  .public-home-page .hero.hero-wide-v760 {
    gap: 28px !important;
  }

  .public-home-page .hero.hero-wide-v760 .hero-security-overview {
    justify-self: center !important;
  }
}

@media (max-width: 780px) {
  .public-home-page .hero.hero-wide-v760 h1,
  .public-home-page .hero.hero-wide-v760 #hero-title,
  .public-home-page .section-heading h2,
  .public-home-page .knowledge-heading h2,
  .public-home-page .platform-copy h2,
  .public-home-page .api-section h2,
  .public-home-page .home-account-copy h2,
  .public-home-page .home-change-copy h2,
  .public-home-page .home-remediation-copy h2,
  .public-home-page .trust-metrics-header h2 {
    line-height: 1.1 !important;
    letter-spacing: -.032em !important;
  }

  .public-home-page .hero.hero-wide-v760 .security-live-card {
    padding: 14px !important;
  }
}

@media (max-width: 560px) {
  .public-home-page .hero.hero-wide-v760 .scan-bar {
    grid-template-columns: 1fr !important;
  }

  .public-home-page .hero.hero-wide-v760 .mobile-scan-submit,
  .public-home-page .hero.hero-wide-v760 #scanForm > .mobile-scan-submit {
    min-height: 58px !important;
    border-radius: 14px !important;
  }

  .public-home-page .hero.hero-wide-v760 .hero-security-overview {
    width: 100% !important;
    max-width: none !important;
  }

  .public-home-page .hero.hero-wide-v760 .security-live-primary {
    grid-template-columns: 108px minmax(0,1fr) !important;
    gap: 9px !important;
  }

  .public-home-page .hero.hero-wide-v760 .security-live-secondary {
    grid-template-columns: 1fr !important;
  }

  .public-home-page .home-account-chart-card {
    padding: 14px 10px 10px !important;
  }
}

:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-submit,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .desktop-scan-submit,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .mobile-scan-submit,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 #scanForm > .mobile-scan-submit {
  color: #331700 !important;
  background: linear-gradient(135deg, #ffc36b 0%, #ffa137 52%, #ff7b08 100%) !important;
  box-shadow: 0 16px 34px rgba(255, 136, 37, .24), inset 0 1px 0 rgba(255,255,255,.38) !important;
}


/* v7.65 — grouped tools visual consistency */
.tool-group-panel[hidden] {
  display: none !important;
}

.tool-group-panel-actions,
.directory-group-actions {
  padding-top: 12px;
}

.tool-group-preview-toggle,
.directory-group-preview-toggle {
  position: relative;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(87, 151, 228, .22);
  border-radius: 11px;
  background: linear-gradient(180deg, rgba(11, 39, 73, .96), rgba(7, 27, 53, .96));
  color: #d8ebff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 22px rgba(0, 0, 0, .16);
}

.tool-group-preview-toggle::before,
.directory-group-preview-toggle::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(66, 170, 255, .08), rgba(47, 224, 196, .05) 58%, transparent 100%);
}

.tool-group-preview-toggle:hover,
.directory-group-preview-toggle:hover {
  border-color: rgba(96, 177, 255, .38);
  background: linear-gradient(180deg, rgba(13, 48, 91, .98), rgba(8, 30, 58, .98));
  color: #f2f8ff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 14px 28px rgba(0, 0, 0, .20), 0 0 0 1px rgba(49, 164, 255, .06);
}

.tool-group-preview-toggle:focus-visible,
.directory-group-preview-toggle:focus-visible {
  outline: 0;
  border-color: rgba(95, 189, 255, .52);
  box-shadow: 0 0 0 3px rgba(52, 145, 255, .18), inset 0 1px 0 rgba(255,255,255,.04);
}

.tool-group.is-preview .tool-group-grid,
.directory-tool-group.is-preview .tools-catalog {
  align-content: start;
}

.tool-group.is-preview-empty .tool-group-grid,
.directory-tool-group.is-preview-empty .tools-catalog {
  display: none !important;
}

.tool-group.is-preview-empty .tool-group-panel,
.directory-tool-group.is-preview-empty .tools-catalog {
  padding-bottom: 0 !important;
  min-height: 0 !important;
}

.tool-group.is-preview .tool-group-panel::after,
.directory-tool-group.is-preview .tools-catalog::after {
  height: 44px;
}

:root[data-theme="light"] .tool-group-preview-toggle,
:root[data-theme="light"] .directory-group-preview-toggle {
  border-color: rgba(41, 95, 168, .16);
  background: linear-gradient(180deg, #ffffff, #eef5fb);
  color: #173754;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 10px 22px rgba(44, 70, 103, .09);
}

:root[data-theme="light"] .tool-group-preview-toggle:hover,
:root[data-theme="light"] .directory-group-preview-toggle:hover {
  border-color: rgba(54, 121, 204, .28);
  background: linear-gradient(180deg, #ffffff, #e8f2fb);
  color: #102f4e;
}

@media (max-width: 760px) {
  .tool-group-preview-toggle,
  .directory-group-preview-toggle {
    min-height: 38px;
    width: 100%;
    font-size: 11px;
  }
}


/* v7.66 — stronger grouped-tools toggle contrast */
.public-home-page .tool-group-preview-toggle,
.public-home-page .directory-group-preview-toggle,
.tools-directory-page .tool-group-preview-toggle,
.tools-directory-page .directory-group-preview-toggle {
  color: #f4f9ff !important;
  -webkit-text-fill-color: #f4f9ff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .012em !important;
  line-height: 1.2 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.45), 0 0 12px rgba(91,176,255,.16) !important;
  border-color: rgba(93, 164, 243, .34) !important;
  background: linear-gradient(180deg, #12335d 0%, #0a274c 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 10px 24px rgba(0,0,0,.2) !important;
  opacity: 1 !important;
}

.public-home-page .tool-group-preview-toggle::before,
.public-home-page .directory-group-preview-toggle::before,
.tools-directory-page .tool-group-preview-toggle::before,
.tools-directory-page .directory-group-preview-toggle::before {
  opacity: .65 !important;
}

.public-home-page .tool-group-preview-toggle:hover,
.public-home-page .directory-group-preview-toggle:hover,
.tools-directory-page .tool-group-preview-toggle:hover,
.tools-directory-page .directory-group-preview-toggle:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: rgba(107, 190, 255, .58) !important;
  background: linear-gradient(180deg, #174579 0%, #0c315d 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 14px 30px rgba(0,0,0,.24), 0 0 0 1px rgba(68,165,255,.08) !important;
}

.public-home-page .tool-group-preview-toggle:focus-visible,
.public-home-page .directory-group-preview-toggle:focus-visible,
.tools-directory-page .tool-group-preview-toggle:focus-visible,
.tools-directory-page .directory-group-preview-toggle:focus-visible {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(72, 164, 255, .24), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

:root[data-theme="light"] .public-home-page .tool-group-preview-toggle,
:root[data-theme="light"] .public-home-page .directory-group-preview-toggle,
:root[data-theme="light"] .tools-directory-page .tool-group-preview-toggle,
:root[data-theme="light"] .tools-directory-page .directory-group-preview-toggle {
  color: #123553 !important;
  -webkit-text-fill-color: #123553 !important;
  text-shadow: none !important;
  border-color: rgba(41, 100, 171, .24) !important;
  background: linear-gradient(180deg, #ffffff 0%, #e9f3fc 100%) !important;
}

@media (max-width: 760px) {
  .public-home-page .tool-group-preview-toggle,
  .public-home-page .directory-group-preview-toggle,
  .tools-directory-page .tool-group-preview-toggle,
  .tools-directory-page .directory-group-preview-toggle {
    font-size: 11.5px !important;
  }
}


/* v7.67 — stable desktop tool picker overlay */
@media (min-width: 761px) {
  /* Otwarcie listy nie może zmieniać wysokości hero ani położenia prawego panelu. */
  html.tool-select-open,
  html.tool-select-open body {
    overflow-x: clip !important;
  }

  .public-home-page .hero.hero-wide-v760,
  .tool-select-open .public-home-page .hero.hero-wide-v760 {
    align-items: center !important;
    min-height: 0 !important;
    padding-bottom: 48px !important;
  }

  .public-home-page .hero.hero-wide-v760 .hero-content,
  .public-home-page .hero.hero-wide-v760 #scanForm,
  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select {
    overflow: visible !important;
  }

  .public-home-page .hero.hero-wide-v760 #scanForm {
    position: relative !important;
    z-index: 80 !important;
    align-items: stretch !important;
  }

  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select,
  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select.is-open {
    position: relative !important;
    z-index: 260 !important;
    contain: none !important;
  }

  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select .tool-select-dropdown,
  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
    position: absolute !important;
    z-index: 2800 !important;
    top: calc(100% + 12px) !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    width: min(650px, calc(100vw - 48px)) !important;
    max-width: 650px !important;
    height: min(430px, 58vh) !important;
    min-height: 330px !important;
    max-height: 430px !important;
    margin: 0 !important;
    padding: 12px !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    gap: 8px !important;
    overflow: hidden !important;
    contain: paint !important;
    transform: none !important;
    border: 1px solid rgba(95, 159, 239, .34) !important;
    border-radius: 17px !important;
    background: linear-gradient(180deg, #0a2344 0%, #06172f 100%) !important;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .58), 0 0 0 1px rgba(255,255,255,.025) !important;
  }

  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select .tool-select-dropdown[hidden] {
    display: none !important;
  }

  .public-home-page .hero.hero-wide-v760 .tool-select-dropdown::before {
    display: block !important;
    top: -7px !important;
    right: 62px !important;
    left: auto !important;
  }

  .public-home-page .hero.hero-wide-v760 .tool-select-search {
    position: relative !important;
    z-index: 2 !important;
    min-height: 50px !important;
    margin: 0 !important;
  }

  .public-home-page .hero.hero-wide-v760 .tool-select-options {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 7px 6px 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
  }

  .public-home-page .hero.hero-wide-v760 .tool-select-scroll-hint {
    min-height: 34px !important;
    margin: 0 !important;
  }

  /* CTA oraz panel po prawej pozostają w stałej pozycji. */
  .tool-select-open .public-home-page .hero.hero-wide-v760 .desktop-scan-submit,
  .public-home-page .hero.hero-wide-v760 .desktop-scan-submit {
    align-self: stretch !important;
    height: 100% !important;
    min-height: 61px !important;
  }

  .tool-select-open .public-home-page .hero.hero-wide-v760 .hero-security-overview,
  .public-home-page .hero.hero-wide-v760 .hero-security-overview {
    align-self: center !important;
    transform: none !important;
  }

  /* Lista nakłada się nad kolejnymi sekcjami zamiast je spychać. */
  .public-home-page .hero.hero-wide-v760 {
    position: relative !important;
    z-index: 20 !important;
    overflow: visible !important;
  }

  .public-home-page .workspace,
  .public-home-page .feature-strip,
  .public-home-page .home-tests-overview {
    position: relative !important;
    z-index: 1 !important;
  }
}

@media (min-width: 761px) and (max-width: 1050px) {
  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select .tool-select-dropdown,
  .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
    width: min(620px, calc(100vw - 40px)) !important;
    right: -174px !important;
  }
}

:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select .tool-select-dropdown,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-test-wrap.custom-tool-select.is-open .tool-select-dropdown {
  background: linear-gradient(180deg, #ffffff 0%, #f3f8fc 100%) !important;
  border-color: rgba(30, 74, 126, .18) !important;
  box-shadow: 0 30px 70px rgba(26, 49, 74, .22), 0 0 0 1px rgba(255,255,255,.5) !important;
}


/* v7.68 — compact grouped tools without empty blue space */
.public-home-page .tool-grid.is-grouped {
  grid-auto-rows: max-content !important;
  align-items: start !important;
  align-content: start !important;
}

.public-home-page .tool-grid.is-grouped > .tool-group {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  align-self: start !important;
}

.public-home-page .tool-grid.is-grouped .tool-group-panel,
.public-home-page .tool-grid.is-grouped .tool-group-grid,
.public-home-page .tool-grid.is-grouped .tool-group-panel-actions {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}

.public-home-page .tool-grid.is-grouped .tool-group-grid {
  grid-auto-rows: auto !important;
  align-items: stretch !important;
  align-content: start !important;
}

.public-home-page .tool-grid.is-grouped .tool-group-panel-actions {
  position: static !important;
  margin: 0 !important;
  padding: 11px 0 0 !important;
}

/* The old fade occupied the bottom of a compact preview and looked like an empty panel. */
.public-home-page .tool-group.is-preview .tool-group-panel::after {
  display: none !important;
  content: none !important;
}

.public-home-page .tool-content,
.public-home-page .tool-content > .tool-grid.is-grouped {
  height: auto !important;
  min-height: 0 !important;
}

@media (max-width: 760px) {
  .public-home-page .tool-grid.is-grouped {
    gap: 10px !important;
    grid-auto-rows: max-content !important;
  }

  .public-home-page .tool-grid.is-grouped > .tool-group,
  .public-home-page .tool-grid.is-grouped .tool-group-panel,
  .public-home-page .tool-grid.is-grouped .tool-group-grid {
    height: auto !important;
    min-height: 0 !important;
  }

  .public-home-page .tool-grid.is-grouped .tool-group-panel {
    padding-bottom: 10px !important;
  }

  .public-home-page .tool-grid.is-grouped .tool-group-panel-actions {
    padding-top: 9px !important;
  }
}


/* CYBEROCENA v7.69 — progressive enhancement and accessible controls. */
.tool-noscript-fallback {
  display: grid;
  gap: 9px;
  padding: 20px;
  border: 1px solid rgba(91, 151, 225, .22);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(10, 36, 69, .95), rgba(5, 23, 47, .98));
}
.tool-noscript-fallback strong { color: #f2f8ff; font-size: 15px; }
.tool-noscript-fallback p { margin: 0; color: #9ab0c8; line-height: 1.55; }
.tool-noscript-fallback .button { width: max-content; margin-top: 4px; }
.trace-action { min-height: 40px; padding: 9px 12px; }
.footer-meta button[data-cookie-settings],
.footer-nav-grid button[data-cookie-settings] {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  padding: 6px 0;
  font-weight: 750;
}
.footer-meta button[data-cookie-settings]:focus-visible,
.footer-nav-grid button[data-cookie-settings]:focus-visible,
.trace-action:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
@media (max-width: 760px) {
  .footer-meta button[data-cookie-settings],
  .footer-nav-grid button[data-cookie-settings],
  .trace-action { min-height: 44px; }
}
:root[data-theme="light"] .tool-noscript-fallback {
  background: linear-gradient(145deg, #fff, #f1f7fc);
  border-color: rgba(30, 76, 126, .14);
}
:root[data-theme="light"] .tool-noscript-fallback strong { color: #163450; }
:root[data-theme="light"] .tool-noscript-fallback p { color: #5e748a; }

/* CYBEROCENA v7.69 — remaining auth/footer touch targets. */
.auth-footer button[data-cookie-settings] {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  padding: 6px 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}
.auth-footer button[data-cookie-settings]:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
@media (max-width: 760px) {
  .auth-footer button[data-cookie-settings] { min-height: 44px; }
}


/* v7.70 — navy CTA text instead of black */
.public-home-page .hero.hero-wide-v760 .scan-submit,
.public-home-page .hero.hero-wide-v760 .desktop-scan-submit,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit,
.public-home-page .hero.hero-wide-v760 #scanForm > .mobile-scan-submit,
.tool-select-open .public-home-page .hero.hero-wide-v760 .scan-submit,
.tool-select-open .public-home-page .hero.hero-wide-v760 .mobile-scan-submit {
  color: #10213d !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.16) !important;
}

.public-home-page .hero.hero-wide-v760 .scan-submit .scan-submit-copy,
.public-home-page .hero.hero-wide-v760 .scan-submit .scan-submit-copy strong,
.public-home-page .hero.hero-wide-v760 .scan-submit .scan-submit-copy small,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit .mobile-scan-submit-copy,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit .mobile-scan-submit-copy strong,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit .mobile-scan-submit-copy small,
.public-home-page .hero.hero-wide-v760 .scan-submit > span,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit > span,
.public-home-page .hero.hero-wide-v760 .scan-submit svg,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit svg {
  color: #10213d !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

.public-home-page .hero.hero-wide-v760 .scan-submit .scan-submit-copy strong,
.public-home-page .hero.hero-wide-v760 .mobile-scan-submit .mobile-scan-submit-copy strong {
  font-weight: 900 !important;
  letter-spacing: -.01em !important;
}

:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-submit,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .desktop-scan-submit,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .mobile-scan-submit,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 #scanForm > .mobile-scan-submit,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-submit .scan-submit-copy strong,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .mobile-scan-submit .mobile-scan-submit-copy strong,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .scan-submit > span,
:root[data-theme="light"] .public-home-page .hero.hero-wide-v760 .mobile-scan-submit > span {
  color: #10213d !important;
}

/* v7.71 mobile tool-card badge fix: keep badges horizontal and move them into a stable top row */
.tool-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  line-height: 1.1;
}

@media (max-width: 760px) {
  .public-home-page .tool-group-grid .tool-card {
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto !important;
    gap: 0 !important;
  }

  .public-home-page .tool-group-grid .tool-card-top {
    position: static !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: 100% !important;
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
  }

  .public-home-page .tool-group-grid .tool-icon {
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
  }

  .public-home-page .tool-group-grid .tool-badge {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    align-self: flex-start !important;
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: calc(100% - 54px) !important;
    min-height: 24px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    font-size: 8px !important;
    letter-spacing: .08em !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-align: center !important;
    writing-mode: horizontal-tb !important;
    transform: none !important;
  }

  .public-home-page .tool-group-grid .tool-card-copy {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    margin-top: 10px !important;
    padding-right: 0 !important;
  }

  .public-home-page .tool-group-grid .tool-card-footer {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    margin-top: 9px !important;
    padding-top: 9px !important;
  }
}


/* v7.72 — final mobile badge layout */
@media (max-width: 760px) {
  .public-home-page .tool-group-grid .tool-card {
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    column-gap: 12px !important;
    row-gap: 0 !important;
    padding: 13px !important;
  }

  .public-home-page .tool-group-grid .tool-card.has-badge {
    grid-template-rows: auto auto auto !important;
  }

  .public-home-page .tool-group-grid .tool-card-top {
    display: contents !important;
    position: static !important;
  }

  .public-home-page .tool-group-grid .tool-icon {
    grid-column: 1 !important;
    grid-row: 1 / -1 !important;
    align-self: start !important;
    justify-self: start !important;
    flex: none !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    padding: 0 6px !important;
  }

  .public-home-page .tool-group-grid .tool-badge {
    position: static !important;
    inset: auto !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: start !important;
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 24px !important;
    padding: 0 9px !important;
    margin: 0 0 7px !important;
    border-radius: 7px !important;
    color: #ffffff !important;
    background: linear-gradient(135deg, #7451f6, #5d37e8) !important;
    border: 1px solid rgba(157, 132, 255, .38) !important;
    box-shadow: 0 6px 14px rgba(78, 47, 212, .20) !important;
    font-size: 8px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: .075em !important;
    text-align: center !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    transform: none !important;
  }

  .public-home-page .tool-group-grid .tool-card-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: start !important;
    min-width: 0 !important;
    margin-top: 0 !important;
    padding-right: 0 !important;
  }

  .public-home-page .tool-group-grid .tool-card.has-badge .tool-card-copy {
    grid-row: 2 !important;
  }

  .public-home-page .tool-group-grid .tool-card-footer {
    grid-column: 2 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
    margin-top: 10px !important;
    padding-top: 10px !important;
  }

  .public-home-page .tool-group-grid .tool-card.has-badge .tool-card-footer {
    grid-row: 3 !important;
  }

  .public-home-page .tool-group-grid .tool-card h3,
  .public-home-page .tool-group-grid .tool-card p,
  .public-home-page .tool-group-grid .tool-category {
    max-width: 100% !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}


/* v7.73 — grouped tool action row spacing fix */
.public-home-page .tool-grid.is-grouped .tool-group-panel,
.tools-directory-page .directory-tool-group {
  overflow: visible !important;
}

.public-home-page .tool-grid.is-grouped .tool-group-panel {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

.public-home-page .tool-grid.is-grouped .tool-group-grid {
  margin-bottom: 0 !important;
}

.public-home-page .tool-grid.is-grouped .tool-group-panel-actions,
.tools-directory-page .directory-group-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  margin-top: 12px !important;
  padding: 14px 0 2px !important;
  border-top: 1px solid rgba(77, 124, 183, .14);
}

.public-home-page .tool-grid.is-grouped .tool-group-preview-toggle,
.tools-directory-page .directory-group-preview-toggle {
  position: static !important;
  display: inline-flex !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  vertical-align: top !important;
}

@media (max-width: 980px) {
  .public-home-page .tool-grid.is-grouped .tool-group-panel-actions,
  .tools-directory-page .directory-group-actions {
    margin-top: 10px !important;
    padding-top: 12px !important;
  }
}

@media (max-width: 760px) {
  .public-home-page .tool-grid.is-grouped .tool-group-panel-actions,
  .tools-directory-page .directory-group-actions {
    margin-top: 8px !important;
    padding: 10px 0 2px !important;
  }

  .public-home-page .tool-grid.is-grouped .tool-group-preview-toggle,
  .tools-directory-page .directory-group-preview-toggle {
    width: 100% !important;
  }
}