/* PXLSec — original visual system, October 2026. */
.choice-hero { padding: 100px 0 88px; background: radial-gradient(ellipse at 80% 50%,#35261d 0,transparent 55%),#0b0c0e; color: #f5f5f2; overflow: hidden; }
.choice-hero-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: 60px; align-items: center; }
.choice-hero .kicker { color: #ffae7c; }
.choice-hero h1 { color: #f5f5f2; font-size: clamp(42px,5.4vw,78px); line-height: 1.07; letter-spacing: -.045em; margin-bottom: 28px; }
.choice-hero .lead { color: #b7b9c0; max-width: 610px; font-size: 18px; line-height: 1.75; }
.choice-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 32px; }
.choice-text-link { display: inline-block; padding-block: 12px; text-decoration: underline; text-underline-offset: 5px; }
.choice-hero .choice-text-link, .choice-evidence .choice-text-link { color: #ffae7c; }
.choice-diagram { position: relative; aspect-ratio: 560 / 340; width: 100%; border: 1px solid #ffffff18; border-radius: 16px; background: #11131588; box-shadow: 0 30px 90px #0005; }
.choice-diagram svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.choice-grid-lines { stroke: #ffffff07; stroke-width: 1; fill: none; }
.choice-connector { stroke: #ff9a5b; stroke-width: 1.5; fill: none; }
.choice-diagram circle { fill: #ff9a5b; }
.choice-node { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 12px; width: 36%; min-height: 58px; transform: translate(-50%,-50%); border: 1px solid #ffffff30; border-radius: 8px; color: #f0f1f3; background: #1a1c20; text-align: center; font-size: clamp(11px,1.1vw,15px); line-height: 1.4; }
.choice-node small { color: #ffae7c; font: 10px ui-monospace,monospace; letter-spacing: .1em; }
.choice-node-0 { top: 14%; left: 50%; }
.choice-node-1 { top: 57%; left: 22%; }
.choice-node-2 { top: 57%; left: 78%; }
.choice-node-3 { top: 90%; left: 50%; min-height: 40px; width: 58%; padding: 8px; border-color: #739d874d; background: #18251f; }
.choice-node-3 small { display: none; }
.choice-diagram-ai .choice-node-1 { border-color: #b0a2d36b; }
.choice-jump { display: flex; flex-wrap: wrap; gap: 8px 28px; padding-block: 20px; border-bottom: 1px solid var(--rule); }
.choice-jump a { padding-block: 10px; color: var(--slate); text-decoration: none; }
.choice-jump a:hover { color: var(--signal-ink); }
.choice-page section[id] { scroll-margin-top: 100px; }
.choice-comparison { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.choice-card, .choice-resource { position: relative; min-width: 0; padding: 38px; border: 1px solid var(--rule); border-radius: 10px; background: #fff; }
.choice-card h3, .choice-resource h3 { font-size: clamp(24px,2.5vw,34px); line-height: 1.2; margin: 18px 0; max-width: 90%; }
.choice-card p, .choice-card li, .choice-resource p { color: var(--slate); line-height: 1.75; }
.choice-card ul { padding-left: 20px; margin: 22px 0 0; }
.choice-card li { margin-bottom: 10px; }
.choice-index { display: block; color: #b5b6bb; font: 15px ui-monospace,monospace; margin-bottom: 25px; }
.choice-boundary { margin-top: 30px; padding: 30px 36px; border-left: 3px solid #ff6a00; background: var(--mist); }
.choice-boundary h3 { font-size: 22px; margin-bottom: 12px; }
.choice-boundary p { color: var(--slate); line-height: 1.75; max-width: 1000px; }
.choice-scope { background: var(--mist); }
.choice-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; list-style: none; margin: 0; padding: 0; }
.choice-steps li { border-top: 1px solid #b6b8bb; padding-top: 24px; }
.choice-steps li > span { color: var(--signal-ink); font: 30px/1.2 var(--display); }
.choice-steps h3 { font-size: 24px; margin: 18px 0 12px; }
.choice-steps p { color: var(--slate); line-height: 1.75; }
.choice-evidence { background: #0b0c0e; color: #f5f5f2; }
.choice-evidence .sec-head h2 { color: #f5f5f2; }
.choice-evidence .sec-head p, .choice-case p { color: #abaeb6; }
.choice-case-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; margin-bottom: 22px; }
.choice-case { min-width: 0; border: 1px solid #ffffff26; border-radius: 9px; overflow: hidden; background: #151719; color: #f5f5f2; text-decoration: none; transition: border-color .2s; }
.choice-case:hover, .choice-case:focus-visible { border-color: #ff9a5b; }
.choice-case .case-art { display: block; aspect-ratio: 600 / 240; width: 100%; overflow: hidden; }
.choice-case .case-art svg { display: block; width: 100%; height: 100%; }
.choice-case > div { padding: 28px; }
.choice-case h3 { color: #f5f5f2; font-size: 25px; line-height: 1.3; margin-bottom: 16px; }
.choice-case p { line-height: 1.75; margin-bottom: 20px; }
.choice-case > div > span { color: #ffae7c; }
.choice-case-grid:has(> :only-child) { grid-template-columns: minmax(0,780px); }
.choice-faq { display: grid; grid-template-columns: 1fr 1.3fr; gap: 60px; }
.choice-faq h2 { font-size: clamp(32px,4vw,50px); }
.choice-faq details { border-top: 1px solid var(--rule); padding: 22px 0; }
.choice-faq summary { cursor: pointer; font-size: 19px; line-height: 1.5; padding-right: 20px; }
.choice-faq details p { color: var(--slate); margin: 20px 0 0; line-height: 1.75; }
.choice-final { background: #eaece7; }
.choice-final h2 { font-size: clamp(36px,5vw,64px); max-width: 1000px; }
.choice-final p:not(.kicker) { color: var(--slate); margin: 24px 0 30px; max-width: 720px; font-size: 18px; line-height: 1.7; }
.choice-related { display: block; margin-top: 28px; max-width: 750px; text-underline-offset: 4px; }
.choice-resource { display: block; text-decoration: none; color: var(--text); transition: border-color .2s; }
.choice-resource:hover, .choice-resource:focus-visible { border-color: #ff6a00; }
.choice-resource > span { color: var(--signal-ink); font: 14px ui-monospace,monospace; }
.choice-resource b { display: inline-block; margin-top: 20px; color: var(--signal-ink); font-weight: 500; }
footer.site .footer-choice-title { font: 600 15px/1.4 var(--body); color: #fff; margin: 28px 0 12px; }
@media (min-width: 981px) { .dd-simple { max-height: calc(100dvh - 120px); overflow-y: auto; overscroll-behavior: contain; } }
@media (max-width: 900px) {
 .choice-hero { padding: 55px 0; }
 .choice-hero-layout, .choice-comparison, .choice-case-grid, .choice-faq { grid-template-columns: 1fr; gap: 28px; }
 .choice-diagram { max-width: 620px; margin-inline: auto; }
 .choice-node { font-size: clamp(11px,2.5vw,16px); }
 .choice-steps { grid-template-columns: 1fr; gap: 28px; }
 .choice-card, .choice-resource { padding: 26px; }
 .choice-boundary { padding: 24px; }
 .choice-jump { gap: 8px 20px; }
}
.pxl-home .home-positioning { border-top: 1px solid var(--rule); }
.positioning-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; }
.positioning-item { min-width: 0; border-top: 2px solid var(--signal); padding-top: 24px; }
.positioning-item h3 { margin: 0 0 16px; font-size: clamp(22px,2vw,28px); line-height: 1.3; }
.positioning-item p { margin: 0 0 20px; color: var(--slate); line-height: 1.75; }
.positioning-item a, .positioning-note a { text-decoration: underline; text-underline-offset: 4px; }
.positioning-note { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--rule); }
.positioning-note p { max-width: 900px; color: var(--slate); line-height: 1.75; margin-bottom: 16px; }
.positioning-guide { display: inline-block; padding-block: 10px; }
@media (max-width: 900px) { .positioning-grid { grid-template-columns: 1fr; gap: 28px; } }
@font-face { font-family: Manrope; src: url('/assets/fonts/manrope-var.woff2') format('woff2'); font-style: normal; font-weight: 200 800; font-display: swap; }
:root { --ink: #0b0c0e; --ink-2: #141518; --text: #191b20; --mist: #f4f4f2; --rule: #dededb; --slate: #61636a; --on-ink: #f5f5f2; --on-ink-2: #abaeb6; --display: Manrope, 'IBM Plex Sans', sans-serif; --ease: cubic-bezier(.16,1,.3,1); }
h1,h2,h3,.h1,:lang(bg) h1,:lang(bg) h2,:lang(bg) h3,:lang(bg) .h1 { font-family: var(--display); font-stretch: normal; letter-spacing: -.045em; }
h3 { letter-spacing: -.025em; }
.wrap { max-width: 1344px; padding-inline: 48px; }
.btn { min-height: 46px; border-radius: 5px; gap: 24px; font-weight: 500; transition: background .25s, color .25s, border-color .25s, transform .25s var(--ease); }
.btn:hover { transform: translateY(-2px); }
.btn-lg { min-height: 54px; padding: 17px 24px; }
.btn span[aria-hidden] { font-size: 20px; line-height: 1; }
.btn-primary { background: #ff792c; color: #111214; }
.btn-primary:hover { background: #ff9354; color: #111214; }
.topbar { display: none; }
header.site { background: rgba(11,12,14,.94); border-color: #ffffff13; color: #fff; backdrop-filter: blur(18px); }
header.site .bar { height: 84px; gap: 24px; }
header.site .logo, header.site .logo:hover { color: #f5f5f2; }
.logo .word { font-family: Manrope, sans-serif; font-size: 21px; letter-spacing: -.055em; font-weight: 500; }
header.site .logo .word b, footer.site .logo .word b { color: #ff792c; }
.logo .mark { width: 31px; height: 35px; }
nav.menu { gap: 28px; }
nav.menu > a, .has-dd > a { color: #d8d9dc; font-size: 14px; font-weight: 400; }
nav.menu > a:hover, .has-dd > a:hover { color: #fff; }
header.site .menu a[aria-current] { color: #ffae7c; }
nav.menu > .btn { color: #111214; }
.langsw { border-color: #ffffff20; }
.langsw a { color: #bfc1c8; }
.langsw a.on { color: #fff; background: #ffffff12; }
.langsw a:hover { color: #fff; background: #ffffff16; }
.navtoggle svg { stroke: #fff; }
.dd { border-radius: 7px; background: #151619; border-color: #ffffff1c; box-shadow: 0 30px 80px #0007; }
.dd a, .dd b, .dd-col h3, .dd-req h3 { color: #ebebed; }
.dd small { color: #a9acb5; }
.dd a:hover { background: #ffffff0a; color: #fff; }
.dd-col + .dd-col, .dd-req { border-color: #ffffff1c; }
/* Match the base menu selectors so dark-menu colors win the cascade. */
.dd .dd-req a { color: #ebebed; border-color: #ffffff35; background: transparent; }
.dd .dd-req a:hover { color: #fff; border-color: #ffae7c; background: #ffffff0a; }
.dd a.dd-all { color: #ffae7c; border-color: #ffffff24; border-radius: 0; }
.dd a.dd-all:hover { color: #ffd2b7; background: #ffffff0a; }
.dd .dd-req a:focus-visible, .dd a.dd-all:focus-visible {
  outline: 2px solid #ffae7c; outline-offset: 3px;
}
.sec { padding-block: 120px; }
.sec h2 { font-size: clamp(34px,4.5vw,60px); line-height: 1.07; font-weight: 500; max-width: 18ch; }
.sec-head { max-width: none; display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 26px 90px; margin-bottom: 56px; }
.sec-head h2 { margin: 0; }
.sec-head > p { margin: 0; max-width: 43ch; font-size: 17px; }
.sec-head > .kicker { grid-column: 1 / -1; color: var(--signal-ink); font-size: 12px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }
.page-hero, .art-head { background: #0b0c0e; }
.page-hero::after,.art-head::after,.sec-ink::after,footer.site::after { animation: none; opacity: .18; }
.page-hero::before,.art-head::before,.sec-ink::before,footer.site::before { animation: none; opacity: .12; }
.page-hero h1, .art-head h1 { font-weight: 500; line-height: 1.06; letter-spacing: -.045em; }
.page-hero h1 { font-size: clamp(42px,5.7vw,76px); }
.page-hero-grid { gap: 72px; }
.page-hero .glance a, .page-hero .glance a:hover { color: #ffae7c; border-color: #ffae7c66; }
footer.site { background: #0b0c0e; }
footer.site .logo { color: #fff; }
footer.site h2 { font-weight: 500; letter-spacing: -.01em; }

/* A generous, editorial headline over an original animated surface. */
.cinematic-hero { background: #0b0c0e; isolation: isolate; }
.cinematic-hero::before { background: radial-gradient(ellipse 80% 28% at 50% 60%, #1c1e24cc, transparent 70%); mask-image: none; animation: none; opacity: 1; }
.cinematic-hero::after { display: none; }
.hero-intro { padding-top: 72px; position: relative; z-index: 3; text-align: center; }
.cinematic-hero .kicker { display: flex; align-items: center; justify-content: center; gap: 10px; color: #bfc0c5; font-size: 12px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 30px; }
.signal-dot { width: 5px; height: 5px; border-radius: 50%; background: #ff792c; box-shadow: 0 0 12px #ff792c88; }
.cinematic-hero h1, :lang(bg) .cinematic-hero h1 { max-width: none; color: #f4f4f1; font-size: clamp(54px,7.7vw,110px); line-height: 1.04; font-weight: 500; letter-spacing: -.063em; margin: 0 auto 26px; }
.cinematic-hero h1 span { display: block; color: #a6a7ac; }
.cinematic-hero h1 .hero-line-first { color: #f4f4f1; }
.hero-line { animation: headline-enter 1.3s var(--ease) both; }
.hero-line-second { animation-delay: .16s; }
@keyframes headline-enter { from { opacity: 0; transform: translateY(48px); filter: blur(8px); } to { opacity: 1; transform: none; filter: blur(0); } }
:lang(bg) .cinematic-hero h1 { font-size: clamp(46px,6.4vw,91px); line-height: 1.1; }
.cinematic-hero .lead, :lang(bg) .cinematic-hero .lead { color: #afb1b8; font-size: 18px; line-height: 1.6; max-width: 49ch; margin: 0 auto 28px; }
.cinematic-hero .cta { justify-content: center; gap: 14px; }
.cinematic-hero .btn-ghost-dark { border-color: #ffffff29; color: #e4e5e9; }
.cinematic-hero .btn-ghost-dark:hover { border-color: #ffffff66; background: #ffffff05; }
.surface-scene { height: 430px; position: relative; isolation: isolate; margin-top: 8px; padding-top: 0; margin-bottom: 0; }
.surface-field { position: absolute; inset: -100px -120px 12px; z-index: -1; pointer-events: none; mask-image: linear-gradient(transparent,black 12%,black 87%,transparent); }
.surface-canvas, .field-fallback { position: absolute; inset: 0; width: 100%; height: 100%; }
.surface-canvas { opacity: 1; }
.surface-field.canvas-ready .field-fallback { display: none; }
.attack-connections { position: absolute; inset: 0 0 35px; width: 100%; height: calc(100% - 35px); overflow: visible; pointer-events: none; }
.path-track { stroke: #c8d2e21f; stroke-width: 1; fill: none; }
.path-signal { stroke: #ff9a5b; stroke-width: 1; fill: none; stroke-dasharray: 3 9; opacity: .25; transition: stroke .5s, opacity .5s; }
.visual-motion-running .path-signal { animation: travel-signal 3.6s linear infinite; opacity: .55; }
@keyframes travel-signal { to { stroke-dashoffset: -120; } }
.visual-motion-running .surface-node { animation: float-node 5.5s ease-in-out infinite; }
.visual-motion-running .node-identity { animation-delay: -1.8s; }
.visual-motion-running .node-data { animation-delay: -3.2s; }
@keyframes float-node { 50% { translate: 0 -9px; } }
.visual-motion-running .node-light { animation: breathe-signal 2s ease-in-out infinite; }
@keyframes breathe-signal { 50% { box-shadow: 0 0 18px #ff792c; background: #ffae7c; } }
[data-scene-state="verify"].visual-motion-running .node-light { animation-name: breathe-verified; }
@keyframes breathe-verified { 50% { box-shadow: 0 0 18px #7ecbb0; background: #a4dbc7; } }
[data-scene-state="prove"] .path-signal { opacity: .8; stroke-dasharray: none; }
[data-scene-state="verify"] .path-signal { opacity: .9; stroke: #7ecbb0; stroke-dasharray: none; }
.surface-node { position: absolute; display: flex; gap: 12px; align-items: center; padding: 17px 19px; background: linear-gradient(135deg,#232426e8,#131417eb); border: 1px solid #ffffff23; border-radius: 7px; box-shadow: 0 16px 40px #0005, inset 0 1px #ffffff05; backdrop-filter: blur(12px); min-width: 204px; transition: border-color .5s, transform .5s var(--ease); }
.surface-node svg { width: 29px; height: 29px; stroke: #969ba5; fill: none; stroke-width: 1.1; flex: none; }
.surface-node small { display: block; font: 9px/1.4 ui-monospace,monospace; color: #a0a2aa; letter-spacing: .04em; margin-bottom: 5px; }
.surface-node b { color: #e3e3e6; font-weight: 400; font-size: 13px; white-space: nowrap; }
.node-app { left: 9%; top: 23%; }
.node-identity { left: 39%; top: 52%; }
.node-data { right: 8%; top: 34%; }
.node-light { height: 5px; width: 5px; background: #727883; border-radius: 50%; margin-left: 16px; }
[data-scene-state="prove"] .node-identity { border-color: #ff792c77; transform: translateY(-5px); }
[data-scene-state="prove"] .node-identity .node-light { background: #ff792c; box-shadow: 0 0 14px #ff792c88; }
[data-scene-state="verify"] .node-identity { border-color: #7ecbb066; }
[data-scene-state="verify"] .node-light { background: #7ecbb0; }
.scene-console { position: absolute; bottom: 58px; left: 48px; right: 48px; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.scene-caption { color: #9d9fa7; font: 11px/1.5 ui-monospace,monospace; }
.scene-controls { display: flex; gap: 2px; padding: 3px; background: #111215; border: 1px solid #ffffff18; border-radius: 5px; }
.scene-controls button { min-height: 44px; padding: 10px 15px; border: 0; border-radius: 3px; color: #acafb8; background: transparent; font: 12px/1.2 var(--body); cursor: pointer; transition: color .2s, background .2s; }
.scene-controls button span { font: 9px ui-monospace,monospace; opacity: .65; margin-right: 7px; }
.scene-controls button[aria-pressed="true"] { background: #2c2421; color: #ffae7c; }
[data-scene-state="verify"] .scene-controls button[aria-pressed="true"] { background: #1c2d27; color: #a4dbc7; }
.scene-controls button:hover { color: #fff; }
.surface-scene figcaption { position: absolute; bottom: 0; left: 48px; right: 48px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #ffffff12; color: #92959d; font: 10px/1.4 ui-monospace,monospace; gap: 12px; }
.motion-toggle { min-height: 44px; border: 0; padding: 10px 0 10px 12px; background: none; color: #b3b5bd; font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.motion-toggle:hover { color: #fff; }
.pxl-home .creds { background: #0b0c0e; border-color: #ffffff18; padding-top: 10px; }
.pxl-home .creds-row > div { padding: 30px 24px 36px; border-color: #ffffff16; }
.pxl-home .creds-row > div:first-child { padding-left: 0; }
.pxl-home .creds b { color: #e4e5e7; font-family: Manrope,sans-serif; font-weight: 500; font-size: 16px; }
.pxl-home .creds span { color: #9599a2; font-size: 12px; display: block; margin-top: 8px; }
.pxl-home .tech { background: #0b0c0e; color: #aaa; border: 0; padding-block: 30px 44px; }
.pxl-home .tech .wrap { display: flex; gap: 36px; align-items: start; }
.pxl-home .tech-label { color: #ffae7c; font-size: 11px; max-width: 160px; flex: none; }
.pxl-home .tech ul { margin: 0; justify-content: flex-start; gap: 12px 24px; }
.pxl-home .tech li { font-family: Manrope,sans-serif; color: #a3a6af; font-size: 14px; background: none; border: 0; border-radius: 0; padding: 0; }

/* Services: large numbered panels, independent diagrams rather than repeated rows. */
.pxl-home #services { background: #f4f4f2; }
.pxl-home #services .svc-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; border: 1px solid #d7d8d5; counter-reset: expertise; }
.pxl-home #services .svc-row { position: relative; display: flex; flex-direction: column; align-items: start; justify-content: flex-start; padding: 32px; min-height: 332px; border: 0; border-right: 1px solid #d7d8d5; border-bottom: 1px solid #d7d8d5; background: transparent; gap: 0; overflow: hidden; text-decoration: none; transition: background .3s; }
.pxl-home #services .svc-row:nth-child(3n) { border-right: 0; }
.pxl-home #services .svc-row:nth-last-child(-n+3) { border-bottom: 0; }
.pxl-home #services .svc-row::before { counter-increment: expertise; content: '0' counter(expertise) ' /'; position: absolute; top: 30px; right: 28px; color: #72747b; font: 10px ui-monospace,monospace; }
.pxl-home #services .svc-row .ico { width: 49px; height: 49px; padding: 11px; border: 1px solid #d2d3d0; background: #fff9; border-radius: 10px; margin-bottom: 28px; stroke: #4b4e55; transition: border-color .3s, stroke .3s, transform .3s var(--ease); }
.pxl-home #services .svc-row h3 { font: 500 23px/1.18 Manrope,sans-serif; letter-spacing: -.04em; color: #191b20; margin-bottom: 14px; max-width: 19ch; }
.pxl-home #services .svc-row p { font-size: 14px; line-height: 1.65; color: #64666d; margin-bottom: 28px; }
.pxl-home #services .svc-row .go { margin-top: auto; font-size: 12px; color: #373a41; display: flex; justify-content: space-between; width: 100%; }
.pxl-home #services .svc-row .go::after { content: '↗'; font-size: 20px; color: #a8370a; }
.pxl-home #services .svc-row:hover { background: #fff; }
.pxl-home #services .svc-row:hover .ico { border-color: #ff6a0055; stroke: #a8370a; transform: translateY(-3px); }
.pxl-home .section-actions { margin-top: 36px; gap: 28px; }
.pxl-home #work { background: #0b0c0e; color: #eee; }
.pxl-home #work .sec-head h2 { color: #f4f4f1; }
.pxl-home #work .sec-head p { color: #a5a8b1; }
.pxl-home #work .sec-head .kicker { color: #ffae7c; }
.pxl-home .home-cases { gap: 24px; grid-template-columns: 1.2fr 1fr 1fr; }
.pxl-home .home-cases .cs-card { border: 1px solid #ffffff1c; border-radius: 7px; background: #151619; padding: 28px; overflow: hidden; transition: border-color .3s, background .3s; }
.pxl-home .home-cases .cs-card::before { content: ''; display: block; height: 150px; margin: -28px -28px 24px; border-bottom: 1px solid #ffffff13; background: radial-gradient(circle at 50% 55%,#ff792c20,transparent 47%),linear-gradient(60deg,transparent 48%,#ff792c40 49%,#ff792c40 50%,transparent 51%),repeating-linear-gradient(0deg,transparent,transparent 23px,#ffffff08 24px),repeating-linear-gradient(90deg,transparent,transparent 23px,#ffffff08 24px); }
.pxl-home .home-cases .cs-card:nth-child(2)::before { background: radial-gradient(circle at 50% 50%,transparent 22px,#aaa5 23px,transparent 24px,transparent 44px,#aaa4 45px,transparent 46px,transparent 64px,#aaa3 65px,transparent 66px),linear-gradient(90deg,transparent 49.7%,#ff792c77 50%,transparent 50.3%),#151619; }
.pxl-home .home-cases .cs-card:nth-child(3)::before { background: linear-gradient(135deg,transparent 44%,#aba9b622 44.1%,#aba9b622 56%,transparent 56.1%),repeating-linear-gradient(90deg,transparent,transparent 35px,#ffffff09 36px),radial-gradient(ellipse at 50% 50%,#b39de02a,transparent 60%); }
.pxl-home .home-cases .cs-card h3 { color: #e5e6e8; font-size: 23px; line-height: 1.27; font-weight: 500; letter-spacing: -.03em; }
.pxl-home .home-cases .cs-card p, .pxl-home .home-cases .cs-sector { color: #a5a8b1; }
.pxl-home .home-cases .cs-card-meta { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: 20px; color: #9c9faa; border-color: #ffffff18; margin-block: 10px 18px; }
.pxl-home .home-cases .cs-card-meta > span { display: flex; flex-direction: column; gap: 8px; font-size: 12px; line-height: 1.5; }
.pxl-home .home-cases .cs-card-meta b { color: #f0f1f3; font-size: 26px; font-weight: 400; line-height: 1.2; white-space: nowrap; }
.pxl-home .home-cases .go,.pxl-home #work .section-actions a { color: #ffae7c; }
.pxl-home .home-cases .cs-card:is(:hover,:focus-visible) { border-color: #ff792c99; background: #191a1d; transform: none; }
.pxl-home .home-cases .cs-card:has(.case-visual)::before, .pxl-home .home-cases .cs-card:has(.case-art)::before { display: none; }
.case-art { display: block; position: relative; flex: 0 0 170px; height: 170px; margin: -28px -28px 24px; overflow: hidden; isolation: isolate; border-bottom: 1px solid #ffffff13; background: #141518; }
.case-art > svg { display: block; width: 100%; height: 100%; }
.cs-grid:not(.home-cases) .cs-card:has(.case-art) { overflow: hidden; border-radius: 7px; transition: border-color .3s, background .3s; }
.cs-grid:not(.home-cases) .cs-card:has(.case-art):hover { transform: none; background: #f8f9f6; }
.cs-grid:not(.home-cases) .case-art { margin: -26px -26px 20px; }
.cs-grid:not(.home-cases) .cs-card h2 { font-size: 23px; font-stretch: normal; letter-spacing: -.03em; }
.cs-grid:not(.home-cases) .cs-card-meta { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: 20px; margin-block: 12px 20px; }
.cs-grid:not(.home-cases) .cs-card-meta > span { display: flex; flex-direction: column; gap: 8px; font-size: 12px; line-height: 1.5; }
.cs-grid:not(.home-cases) .cs-card-meta b { font-size: 24px; font-weight: 500; line-height: 1.2; }
.case-hero-visual { margin: 40px 0 0; overflow: hidden; border: 1px solid #ffffff20; border-radius: 7px; background: #141518; }
.case-hero-visual .case-art { margin: 0; height: clamp(190px,30vw,330px); border-bottom: 0; }
.case-hero-visual .case-art > svg { object-fit: contain; }
.case-hero-visual figcaption { display: flex; justify-content: space-between; gap: 20px; padding: 15px 20px; border-top: 1px solid #ffffff13; color: #a5a8b1; font: 10px/1.6 ui-monospace,monospace; }
.cs-card .go { margin-top: auto; }
.case-art .case-signal { stroke-dasharray: 380; stroke-dashoffset: 0; }
.cs-card:is(:hover,:focus-visible) .case-signal { animation: trace-case-path 1.15s var(--ease) both; }
.cs-card:is(:hover,:focus-visible) .case-node { animation: light-case-node .9s ease-out both; }
@keyframes trace-case-path { from { stroke-dashoffset: 380; opacity: .3; } to { stroke-dashoffset: 0; opacity: 1; } }
@keyframes light-case-node { 0% { opacity: .35; } 60% { opacity: 1; } 100% { opacity: .8; } }
.pxl-home .home-cases .case-visual { width: calc(100% + 56px); max-width: none; height: 170px; object-fit: cover; margin: -28px -28px 24px; border-bottom: 1px solid #ffffff13; border-radius: 6px 6px 0 0; }
.evidence-showcase { background: #eceeeb; }
.evidence-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 110px; align-items: center; }
.evidence-copy .kicker { color: #a8370a; font: 12px/1.5 ui-monospace,monospace; margin-bottom: 22px; }
.evidence-copy > p:not(.kicker) { color: #61636a; font-size: 17px; max-width: 42ch; margin-bottom: 28px; }
.evidence-window { background: #fff; border: 1px solid #d3d6d1; border-radius: 8px; box-shadow: 0 32px 80px #20272112; transform: perspective(1200px) rotateY(-3deg); }
.window-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 17px 21px; border-bottom: 1px solid #dfe1dc; }
.window-bar > span:first-child { display: flex; gap: 5px; }
.window-bar i { width: 5px; height: 5px; background: #c4c7c0; border-radius: 50%; }
.window-bar small { font: 9px/1.5 ui-monospace,monospace; letter-spacing: .07em; color: #73786c; }
.window-bar > span:last-child { color: #7d8277; }
.evidence-window .finding-stack { padding: 24px; }
.evidence-window .finding { box-shadow: none; border-radius: 4px; border: 1px solid #e4e5e1; border-top: 3px solid var(--sev-high); animation: none; }
.evidence-window .fs-label { color: #656b61; font-size: 11px; }
.evidence-window .f-title h2 { font-size: 20px; line-height: 1.23; max-width: none; letter-spacing: -.02em; font-weight: 600; margin-bottom: 0; }
.evidence-window .finding dl { font-size: 13px; grid-template-columns: 68px minmax(0,1fr); gap: 12px; }
:lang(bg) .evidence-window .finding dl { grid-template-columns: 88px minmax(0,1fr); }
.evidence-window .finding figcaption { font-size: 11px; }
.evidence-window .f-status { font-size: 12px; }
.evidence-window .fs-dots { justify-content: center; margin-top: 14px; }
.evidence-window .fs-dot::after { background: #858c81; }
.evidence-window .fs-dot.is-active::after { background: #a8370a; }
.evidence-stamp { margin-top: 50px; display: flex; align-items: center; gap: 30px; color: #c6cbc1; }
.evidence-stamp span { font: 600 80px/1 Manrope,sans-serif; letter-spacing: -.07em; }
.evidence-stamp svg { width: 95px; height: 95px; fill: none; stroke: #9ba693; stroke-width: 1; }
.pxl-home #report { padding-block: 82px; }
.pxl-home #report h2 { font-size: clamp(32px,3.4vw,46px); }
.pxl-home #report .split { gap: 110px; }
.pxl-home #report p { font-size: 16px; }
.pxl-home #process { background: #0b0c0e; color: #e5e6e8; }
.pxl-home #process h2 { color: #f4f4f1; }
.pxl-home #process .sec-head p { color: #a5a8b1; }
.pxl-home #process a { color: #ffae7c; }
.pxl-home .steps { gap: 0; }
.pxl-home .steps li { border: 0; border-top: 1px solid #ffffff24; padding: 32px 30px 0 0; position: relative; background: none; }
.pxl-home .steps li::before { position: static; display: block; background: none; color: #ff9354; font: 400 45px/1 Manrope,sans-serif; width: auto; height: auto; padding: 0; margin-bottom: 32px; border-radius: 0; }
.pxl-home .steps li::after { content: none; display: none; }
.pxl-home .steps li { transition: border-color .25s; }
.pxl-home .steps li:hover { border-top-color: #ff9354; }
.pxl-home .steps h3 { color: #e7e8eb; font-size: 22px; font-weight: 500; }
.pxl-home .steps p { color: #979ba6; font-size: 14px; max-width: 26ch; }
.pxl-home .certs { gap: 0; border-top: 1px solid #dededb; border-left: 1px solid #dededb; }
.pxl-home .cert { border: 0; border-right: 1px solid #dededb; border-bottom: 1px solid #dededb; border-radius: 0; background: none; padding: 30px 15px; }
.pxl-home .cert img { width: 54px; height: 54px; object-fit: contain; }
.pxl-home .cert b { font-family: Manrope,sans-serif; font-weight: 500; }
.pxl-home #clients { background: #edeeeb; }
.pxl-home .quote-lead { background: none; border: 0; border-top: 1px solid #cfd2cb; border-radius: 0; padding: 42px 0; max-width: none; }
.pxl-home .quote-lead blockquote p { font: 400 clamp(25px,3vw,38px)/1.4 Manrope,sans-serif; letter-spacing: -.03em; max-width: 36ch; }
.pxl-home .quotes { gap: 32px; }
.pxl-home .quotes .quote { background: none; border: 0; border-top: 1px solid #cfd2cb; border-radius: 0; padding: 25px 0; }
.pxl-home .quote figcaption { margin-top: 28px; }
.pxl-home #company { background: #0b0c0e; }
.pxl-home #company .facts { border-color: #ffffff20; }
.pxl-home #faq summary { font-family: Manrope,sans-serif; font-weight: 500; }
.pxl-home .contact { background: #ff792c; color: #111214; padding-block: 105px; }
.pxl-home .contact h2 { font: 500 clamp(40px,4.6vw,65px)/1.09 Manrope,sans-serif; letter-spacing: -.055em; }
.pxl-home .contact h3 { color: #181a1e; font-size: 21px; font-weight: 600; }
.pxl-home .contact .lead,.pxl-home .contact p { color: #33231b; }
.pxl-home .contact a { color: #17120e; }
.pxl-home .contact .btn-primary { background: #111214; color: #f5f5f2; }
.pxl-home .contact .btn-primary:hover { background: #292a2e; }
.pxl-home .contact-compact .split { grid-template-columns: 1.4fr .6fr; gap: 100px; }

/* Reveals are progressive enhancement. Plain HTML stays visible without JS. */
.visual-reveal { transition: opacity .9s var(--ease), transform 1s var(--ease), filter .9s var(--ease); transition-delay: var(--reveal-delay,0ms); }
.visual-reveal.is-pending { opacity: 0; transform: translateY(16px); filter: blur(7px); }
.visual-reveal:focus-within { opacity: 1; transform: none; }
.hero-intro { animation: hero-arrive .95s var(--ease) both; }
@keyframes hero-arrive { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

.dive-story { display: none; }
.scene-journey { --intro-opacity: 1; --intro-shift: 0px; --intro-blur: 0px; --nodes-opacity: 1; --copy-opacity: 0; --finding-opacity: 0; --finding-shift: 32px; }
.scene-journey .surface-field { inset: 0; z-index: 1; mask-image: linear-gradient(transparent,black 5%,black 94%,transparent); }
.scene-journey .hero-intro { z-index: 2; }
.scene-journey .hero-intro { animation: none; opacity: var(--intro-opacity); transform: translateY(var(--intro-shift)); filter: blur(var(--intro-blur)); }
.mobile-scroll-cue { display: none; }
.hero-lead-mobile { display: none; }
.scene-journey .surface-scene { z-index: 4; pointer-events: none; }
.scene-journey .scene-controls, .scene-journey .motion-toggle { pointer-events: auto; }
.scene-journey .surface-node, .scene-journey .attack-connections { opacity: var(--nodes-opacity); }
.scene-journey .dive-story { display: block; position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.scene-canvas-fallback .graph-labels, .scene-canvas-fallback .dive-tether { display: none; }
.dive-copy { position: absolute; left: max(48px,calc((100% - 1248px)/2)); top: 18%; width: 40%; max-width: 520px; opacity: var(--copy-opacity); transform: translateY(calc((1 - var(--copy-opacity))*24px)); text-shadow: 0 2px 25px #0b0c0e; }
:lang(bg) .dive-copy h2 { font-size: clamp(30px,3.1vw,46px); }
.dive-copy::before { content: ''; position: absolute; inset: -45px; background: radial-gradient(ellipse,#0b0c0ee8,transparent 74%); z-index: -1; }
.dive-copy .kicker, .dive-finding .kicker { color: #ffae7c; font: 10px/1.5 ui-monospace,monospace; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 20px; }
.dive-copy h2 { font-size: clamp(35px,3.8vw,55px); line-height: 1.1; font-weight: 500; color: #f4f4f2; margin-bottom: 22px; letter-spacing: -.045em; }
.dive-copy > p:last-child { font-size: 16px; line-height: 1.65; color: #bfc1c8; max-width: 39ch; }
.graph-labels { opacity: var(--copy-opacity); }
.graph-labels > span { position: absolute; left: 0; top: 0; display: flex; gap: 7px; align-items: center; color: #b6bac5; font: 10px/1.4 ui-monospace,monospace; white-space: nowrap; text-shadow: 0 1px 10px #000; }
.graph-labels i { display: block; width: 4px; height: 4px; background: #fff; border-radius: 50%; box-shadow: 0 0 9px #fff; }
.dive-finding { position: absolute; right: max(48px,calc((100% - 1248px)/2)); bottom: 20%; width: 320px; padding: 25px; border: 1px solid #ffffff1f; border-radius: 8px; background: #121317f2; box-shadow: 0 20px 70px #0008; opacity: var(--finding-opacity); transform: translateY(var(--finding-shift)); pointer-events: auto; }
.dive-finding .kicker { margin-bottom: 15px; }
.dive-finding .fsev { display: inline-block; margin-bottom: 15px; }
.dive-finding h3 { font-size: 25px; line-height: 1.2; font-weight: 500; margin-bottom: 16px; color: #f4f4f2; }
.dive-finding .dive-scope { font-size: 12px; line-height: 1.5; color: #a5a8b1; margin-bottom: 16px; }
.dive-finding .dive-summary { font-size: 14px; color: #d1d2d7; margin-bottom: 20px; }
.dive-finding a { color: #ffae7c; font-size: 14px; font-weight: 500; text-underline-offset: 4px; }
.dive-tether { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; opacity: var(--finding-opacity); }
.dive-tether path { fill: none; stroke: #ff792c; stroke-width: 1; stroke-dasharray: 3 5; }
.dive-tether circle { fill: #ff9354; filter: drop-shadow(0 0 6px #ff792c); }

@media (min-width: 981px) and (min-height: 780px) and (prefers-reduced-motion: no-preference) {
  .hero-scroll-stage.motion-ready { min-height: 230svh; background: #0b0c0e; }
  .motion-ready .cinematic-hero { position: sticky; top: 84px; height: calc(100svh - 84px); display: flex; flex-direction: column; }
  .motion-ready .hero-intro { flex: none; padding-top: clamp(20px,3.5svh,48px); }
  .motion-ready .cinematic-hero h1 { font-size: clamp(54px,min(7.7vw,10.3svh),110px); }
  :lang(bg) .motion-ready .cinematic-hero h1 { font-size: clamp(46px,min(6.4vw,9svh),91px); }
  .motion-ready .surface-scene { flex: 1; width: 100%; min-height: 250px; height: auto; }
}

@media (min-width: 1600px) { .hero-intro { padding-top: 92px; } .surface-scene { height: 430px; } }
@media (max-width: 1100px) {
  .wrap { padding-inline: 32px; }
  .sec-head { gap: 28px 50px; }
  .evidence-layout { gap: 55px; }
  .scene-console,.surface-scene figcaption { left: 32px; right: 32px; }
  .surface-node { min-width: 184px; padding: 14px; }
  .node-app { left: 5%; }.node-data { right: 5%; }
  nav.menu { gap: 19px; }
  .pxl-home .home-cases { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
  .pxl-home .home-cases .cs-card { padding: 23px; }
  .pxl-home .home-cases .cs-card-meta { grid-template-columns: 1fr; }
  .pxl-home .home-cases .cs-card::before { margin: -23px -23px 22px; }
  .pxl-home .home-cases .case-visual { width: calc(100% + 46px); margin: -23px -23px 22px; }
  .case-art { margin: -23px -23px 22px; }
  .pxl-home #services .svc-row { padding: 26px; }
}
@media (max-width: 980px) {
  header.site .bar { height: 72px; }
  nav.menu { background: #101114; border-color: #ffffff20; }
  header.site nav.menu.open { background: #101114; border-color: #ffffff20; }
  header.site nav.menu.open > a:not(.btn), header.site nav.menu.open .has-dd > a { color: #e3e4e8; }
  header.site nav.menu.open .dd-col h3, header.site nav.menu.open .dd-req h3 { color: #a9acb5; letter-spacing: .06em; }
  .menu > a,.has-dd > a { color: #ddd; }
  .dd { background: #151619; }
  .pxl-home #services .svc-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pxl-home #services .svc-row:nth-child(3n) { border-right: 1px solid #d7d8d5; }
  .pxl-home #services .svc-row:nth-child(2n) { border-right: 0; }
  .pxl-home #services .svc-row:nth-last-child(-n+3) { border-bottom: 1px solid #d7d8d5; }
  .pxl-home #services .svc-row:nth-last-child(-n+2) { border-bottom: 0; }
  .sec { padding-block: 90px; }
  .scene-caption { max-width: 30ch; }
  .evidence-layout { gap: 40px; }
  .evidence-window .finding-stack { padding: 18px; }
}
@media (max-width: 760px) {
  .wrap { padding-inline: 24px; }
  .hero-intro { padding-top: 55px; }
  .cinematic-hero .kicker { font-size: 10px; letter-spacing: .035em; margin-bottom: 23px; }
  .cinematic-hero h1 { font-size: clamp(44px,9.3vw,69px); letter-spacing: -.057em; }
  :lang(bg) .cinematic-hero h1 { font-size: clamp(35px,7.6vw,56px); }
  .cinematic-hero .lead { font-size: 16px; max-width: 39ch; }
  .cinematic-hero .cta { gap: 10px; }
  .cinematic-hero .btn { font-size: 13px; padding: 15px 19px; gap: 15px; }
  .surface-scene { height: 365px; margin-top: 18px; }
  .surface-node { min-width: 0; padding: 12px; gap: 10px; }
  .surface-node b { font-size: 11px; }
  .surface-node small { font-size: 7px; max-width: 21ch; }
  .surface-node svg { width: 23px; height: 23px; }
  .node-light { margin-left: 2px; }
  .node-app { left: 7%; top: 15%; }.node-identity { left: 30%; top: 42%; }.node-data { right: 6%; top: 24%; }
  .scene-console { left: 24px; right: 24px; bottom: 65px; justify-content: center; }
  .scene-caption { display: none; }
  .surface-scene figcaption { left: 24px; right: 24px; font-size: 8px; align-items: center; }
  .scene-controls button { padding-inline: 14px; font-size: 11px; }
  .pxl-home .creds-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pxl-home .creds-row > div { padding: 21px 17px; border-bottom: 1px solid #ffffff13; }
  .pxl-home .creds-row > div:nth-child(3) { padding-left: 0; border-left: 0; }
  .pxl-home .creds b { font-size: 14px; }
  .pxl-home .creds span { font-size: 11px; }
  .pxl-home .tech .wrap { flex-direction: column; gap: 20px; }
  .pxl-home .tech-label { max-width: none; }
  .pxl-home .tech li { font-size: 12px; }
  .sec { padding-block: 74px; }
  .sec-head { grid-template-columns: 1fr; gap: 20px; margin-bottom: 35px; }
  .sec h2 { font-size: clamp(34px,7vw,49px); max-width: 20ch; }
  .sec-head > p { font-size: 16px; }
  .evidence-layout { grid-template-columns: 1fr; gap: 36px; }
  .evidence-stamp { display: none; }
  .evidence-window { transform: none; }
  .pxl-home .home-cases { grid-template-columns: 1fr; gap: 24px; }
  .pxl-home .home-cases .cs-card-meta { grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); }
  .pxl-home .home-cases .cs-card::before { height: 170px; }
  .pxl-home .home-cases .cs-card h3 { font-size: 26px; }
  .pxl-home #report .split, .pxl-home .contact-compact .split { grid-template-columns: 1fr; gap: 36px; }
  .pxl-home .steps { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 34px 20px; }
  .pxl-home .steps li { padding-right: 8px; }
  .pxl-home .steps li::before { margin-bottom: 26px; font-size: 36px; }
  .pxl-home .contact { padding-block: 74px; }
  .page-hero h1 { font-size: clamp(38px,7vw,54px); }
  .page-hero-grid { gap: 35px; }
}
@media (max-width: 480px) {
  .wrap { padding-inline: 20px; }
  .logo .word { font-size: 19px; }
  header.site .bar { gap: 10px; }
  .cinematic-hero h1 { font-size: clamp(39px,10vw,48px); }
  :lang(bg) .cinematic-hero h1 { font-size: clamp(31px,7.65vw,37px); }
  .cinematic-hero .lead { max-width: 32ch; }
  .cinematic-hero .btn { gap: 10px; padding-inline: 14px; font-size: 12px; }
  .surface-scene { height: 367px; }
  .node-app { left: 5%; top: 10%; }.node-data { right: 5%; top: 31%; }.node-identity { left: 13%; top: 49%; }
  .surface-node { padding: 11px; }
  .surface-node small { font-size: 7px; }
  .attack-connections { opacity: .55; }
  .scene-console { bottom: 58px; left: 20px; right: 20px; }
  .surface-scene figcaption { left: 20px; right: 20px; }
  .scene-controls button { padding-inline: 10px; }
  .pxl-home #services .svc-list { grid-template-columns: 1fr; }
  .pxl-home #services .svc-row { min-height: 0; padding: 28px; border-right: 0!important; border-bottom: 1px solid #d7d8d5!important; }
  .pxl-home #services .svc-row:last-child { border-bottom: 0!important; }
  .pxl-home #services .svc-row .ico { margin-bottom: 22px; }
  .pxl-home #services .svc-row h3 { font-size: 25px; max-width: 21ch; }
  .pxl-home #services .svc-row p { max-width: 37ch; }
  .evidence-window .finding-stack { padding: 14px; }
  .evidence-window .finding dl,:lang(bg) .evidence-window .finding dl { grid-template-columns: 1fr; gap: 6px; padding-inline: 16px; }
  .evidence-window .finding dd { margin-bottom: 6px; }
  .evidence-window .f-title,.evidence-window .finding figcaption,.evidence-window .f-status { padding-inline: 16px; }
  .evidence-window .f-title { flex-direction: column; gap: 10px; }
  .evidence-window .f-title h2 { font-size: 21px; }
  .window-bar { padding-inline: 15px; }
  .window-bar small { font-size: 8px; }
  .pxl-home .steps { grid-template-columns: 1fr; }
  .pxl-home .steps p { max-width: 40ch; }
  .case-hero-visual figcaption { flex-direction: column; gap: 4px; padding: 12px 16px; }
  .pxl-home .home-cases .cs-card-meta b { font-size: 23px; }
}
/* Interactive attack-path bubbles: state changes content, geometry and route. */
.surface-node { transition: left .65s var(--ease), right .65s var(--ease), top .65s var(--ease), border-color .4s, transform .4s; }
.bubble-status { display: block; margin-top: 5px; color: #a8adb7; font-size: 10px; line-height: 1.4; }
.surface-node b { white-space: normal; }
.bubble-icon { transition: stroke .3s; }
.path-track, .path-signal, .path-barrier { vector-effect: non-scaling-stroke; }
.path-barrier { fill: none; stroke: #7ecbb0; stroke-width: 2; stroke-dasharray: 3 4; opacity: 0; }
[data-scene-state="discover"] .node-app::before { content: ''; position: absolute; inset: -12px; border: 1px solid #ff792c35; border-radius: 18px; pointer-events: none; }
[data-scene-state="discover"] .path-signal { opacity: .25; }
[data-scene-state="prove"] .node-app { left: 7%; top: 12%; }
[data-scene-state="prove"] .node-identity { left: 39%; top: 32%; border-color: #ff792c99; }
[data-scene-state="prove"] .node-data { right: 7%; top: 48%; border-color: #ff792c99; }
[data-scene-state="prove"] .node-identity .bubble-icon, [data-scene-state="prove"] .node-data .bubble-icon { stroke: #ffae7c; }
[data-scene-state="prove"] .node-identity .bubble-status, [data-scene-state="prove"] .node-data .bubble-status { color: #ffae7c; }
[data-scene-state="verify"] .node-app { left: 7%; top: 12%; }
[data-scene-state="verify"] .node-identity { left: 36%; top: 35%; }
[data-scene-state="verify"] .node-data { right: 5%; top: 17%; }
[data-scene-state="verify"] .node-identity .bubble-icon, [data-scene-state="verify"] .node-data .bubble-icon { stroke: #a4dbc7; }
[data-scene-state="verify"] .bubble-status { color: #a4dbc7; }
[data-scene-state="verify"] .path-barrier { opacity: 1; }
[data-scene-state="verify"].visual-motion-running .path-signal { animation: none; }
.cinematic-hero:not(.visual-motion-running) .surface-node { transition: none; }
@media (max-width: 760px) {
  .surface-scene { height: 410px; }
  .bubble-status { font-size: 9px; max-width: 23ch; }
  .surface-node { max-width: 76%; }
  .scene-caption { display: block; position: absolute; bottom: 64px; left: 0; right: 0; text-align: center; max-width: none; font: 11px/1.5 var(--body); color: #bfc1c8; }
  [data-scene-state="discover"] .node-app { left: 6%; top: 5%; }
  [data-scene-state="discover"] .node-identity { left: 24%; top: 24%; }
  [data-scene-state="discover"] .node-data { right: 6%; top: 43%; }
  [data-scene-state="prove"] .node-app { left: 6%; top: 5%; }
  [data-scene-state="prove"] .node-identity { left: 13%; top: 24%; }
  [data-scene-state="prove"] .node-data { right: 6%; top: 43%; }
  [data-scene-state="verify"] .node-app { left: 6%; top: 5%; }
  [data-scene-state="verify"] .node-identity { left: 27%; top: 24%; }
  [data-scene-state="verify"] .node-data { right: 6%; top: 43%; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-intro { animation: none; }
  .visual-reveal,.visual-reveal.is-pending { opacity: 1; transform: none; filter: none; transition: none; }
  .surface-node,.path-signal,.btn,.cs-card { transition: none!important; }
  .hero-line,.visual-motion-running .surface-node,.visual-motion-running .node-light,.visual-motion-running .path-signal { animation: none!important; }
  .cs-card:is(:hover,:focus-visible) .case-signal,.cs-card:is(:hover,:focus-visible) .case-node { animation: none; }
}

/* Original below-hero diagrams, scrubbed by native scrolling. */
.scope-map { margin: 0 0 40px; border: 1px solid #d7d8d5; background: #eceeeb; border-radius: 7px; padding: 32px; }
.scope-diagram { position: relative; display: grid; grid-template-columns: 180px 1fr; gap: 100px; align-items: center; min-height: 220px; }
.scope-connections { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: none; stroke-width: 1.5; pointer-events: none; }
.scope-track { stroke: #bfc5be; }
.scope-trace { stroke: #a8370a; stroke-dasharray: 1; stroke-dashoffset: 0; }
.scope-root,.scope-node { position: relative; z-index: 1; background: #f8f9f6; border: 1px solid #c8cec5; border-radius: 7px; }
.scope-root { padding: 22px; min-height: 156px; display: flex; flex-direction: column; justify-content: center; gap: 14px; }
.scope-root > span { color: #6c7268; font: 10px ui-monospace,monospace; }
.scope-root b { color: #191b20; font: 500 19px/1.3 Manrope,sans-serif; letter-spacing: -.03em; }
.scope-root svg,.scope-node svg { width: 32px; height: 32px; fill: none; stroke: #6c7268; stroke-width: 1.3; flex-shrink: 0; }
.scope-targets { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.scope-node { display: flex; align-items: center; gap: 16px; min-height: 82px; padding: 18px; color: #30362f; text-decoration: none; }
.scope-node span { font: 500 15px/1.4 Manrope,sans-serif; }
.scope-node i { margin-left: auto; font-style: normal; color: #a8370a; }
.scope-node:is(:hover,:focus-visible) { color: #191b20; background: #fff; border-color: #a8370a; }
.scope-map figcaption { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 24px; padding-top: 16px; border-top: 1px solid #d3d8cf; color: #63695f; font-size: 12px; line-height: 1.6; }
.section-motion-toggle { padding: 10px 0; min-height: 44px; background: none; border: 0; color: #545c50; text-decoration: underline; text-underline-offset: 4px; font: inherit; cursor: pointer; flex-shrink: 0; }
.section-motion-ready .scope-trace { stroke-dashoffset: calc(1 - var(--route-progress,1)); }
.section-motion-ready .scope-node { transform: translateY(calc((1 - var(--node-progress,1))*14px)); }
.section-motion-ready .scope-node svg { stroke: color-mix(in srgb,#6c7268 calc((1 - var(--node-progress,1))*100%),#a8370a); }
.section-motion-ready .home-cases .case-signal { stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--case-progress,1)); animation: none; }
.section-motion-ready .home-cases .case-node { opacity: calc(.3 + var(--case-progress,1)*.7); animation: none; }
.section-motion-ready .home-cases .case-art svg { transform: scale(calc(1.045 - var(--case-progress,1)*.045)); transform-origin: center; }
.section-motion-ready .evidence-window { transform: perspective(1200px) translateY(calc((1 - var(--report-progress,1))*24px)) rotateY(calc((1 - var(--report-progress,1))*-5deg)) rotateX(calc((1 - var(--report-progress,1))*3deg)); }
.section-motion-ready .evidence-stamp path { stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--stamp-progress,1)); stroke: #6e8e77; }
.pxl-home #process .process-art { margin: -12px 0 24px; height: 110px; background: radial-gradient(ellipse at center,#ff792c09,transparent 70%); }
.process-art svg { display: block; width: 100%; height: 100%; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.process-outline { stroke: #747a86; stroke-width: 1; }
.process-trace { stroke: #ff9354; stroke-width: 2; stroke-dasharray: 1; stroke-dashoffset: 0; }
.pxl-home #process .steps li:last-child .process-trace { stroke: #9fc2b2; }
.section-motion-ready #process .process-trace { stroke-dashoffset: calc(1 - var(--step-progress,1)); }
.pxl-home.section-motion-ready #process .steps li::after { content: ''; display: block; position: absolute; top: -1px; left: 0; height: 2px; width: calc(var(--step-progress,1)*100%); background: #ff9354; }
.pxl-home.section-motion-ready #process .steps li:last-child::after { background: #9fc2b2; }
.section-motion-paused .scope-node { transition: none; }
@media (max-width: 980px) {
  .scope-map { padding: 24px; }
  .scope-diagram { grid-template-columns: 155px 1fr; gap: 55px; }
  .scope-node { gap: 10px; padding: 14px; }
  .scope-node span { font-size: 13px; }
}
@media (max-width: 700px) {
  .scope-map { padding: 20px; }
  .scope-diagram { grid-template-columns: 1fr; gap: 44px; }
  .scope-root { width: 174px; min-height: 112px; margin: auto; padding: 16px; gap: 10px; }
  .scope-root svg { position: absolute; right: 14px; top: 14px; width: 23px; height: 23px; }
  .scope-root b { font-size: 17px; max-width: 9ch; }
  .scope-targets { gap: 16px; }
  .scope-node { min-height: 108px; flex-direction: column; align-items: flex-start; gap: 12px; padding: 14px; }
  .scope-node i { position: absolute; right: 12px; top: 12px; }
  .scope-map figcaption { display: block; margin-top: 20px; }
  .section-motion-toggle { display: block; margin-top: 8px; }
  .section-motion-ready .evidence-window { transform: translateY(calc((1 - var(--report-progress,1))*12px)); }
  .pxl-home #process .steps li { padding: 28px 0 26px 68px; }
  .pxl-home #process .steps li::before { position: absolute; left: 0; top: 31px; margin: 0; font-size: 36px; }
  .pxl-home #process .process-art { margin: 0 0 16px; height: 105px; max-width: 210px; }
  .pxl-home #process .steps h3 { margin-bottom: 12px; }
  .pxl-home #process .steps p { max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
  .section-motion-ready .scope-node,.section-motion-ready .home-cases .case-art svg,.section-motion-ready .evidence-window { transform: none; }
  .section-motion-ready .scope-trace,.section-motion-ready .home-cases .case-signal,.section-motion-ready #process .process-trace,.section-motion-ready .evidence-stamp path { stroke-dashoffset: 0; }
}

/* Lower-page motion: readable content stays in place while diagrams explain it. */
.pxl-home .cert { position: relative; isolation: isolate; overflow: hidden; }
.cert-frame { position: absolute; inset: 10px; width: calc(100% - 20px); height: calc(100% - 20px); pointer-events: none; z-index: -1; fill: none; stroke: #ac5c3290; stroke-width: 1; }
.cert-frame path { stroke-dasharray: 1; stroke-dashoffset: 0; }
.pxl-home .quote-lead::before { content: none; }
.pxl-home #clients .quote { position: relative; }
.pxl-home #clients .quote::after { content: ''; position: absolute; top: -1px; left: 0; width: 100%; height: 2px; background: #a8370a; transform-origin: left; }
.quote-mark { display: block; width: 40px; height: 30px; margin-bottom: 20px; fill: none; stroke: #a8370a; stroke-width: 1.5; }
.quote-lead .quote-mark { width: 64px; height: 44px; margin-bottom: 24px; }
.lower-art { margin: 0 0 28px; }
.lower-art > svg { display: block; width: 100%; height: auto; max-height: 245px; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.lower-grid { stroke: currentColor; opacity: .12; stroke-width: 1; }
.lower-outline { stroke: currentColor; opacity: .55; stroke-width: 1.3; }
.lower-trace { fill: none; stroke: #a8370a; stroke-width: 2; stroke-dasharray: 1; stroke-dashoffset: 0; }
.company-profile { min-width: 0; }
.company-art { padding: 16px 20px 24px; border: 1px solid #ffffff26; border-radius: 8px; background: radial-gradient(ellipse at center,#ff792c0b,transparent 70%); color: #bec2cd; }
.company-art .lower-trace { stroke: #ff9354; }
.company-pixels { fill: #ffb484; }
.lower-art figcaption { display: flex; justify-content: space-between; gap: 16px; font: 11px/1.5 ui-monospace,monospace; letter-spacing: .04em; }
.company-art figcaption { color: #a7adb7; margin-top: 8px; }
.company-art-labels { display: flex; justify-content: space-between; gap: 16px; padding-top: 18px; margin-top: 16px; border-top: 1px solid #ffffff20; color: #d2d4da; font-size: 12px; }
.sector-art,.tools-art { color: #666e63; padding: 18px 0 0; border-top: 1px solid #d4d9d0; }
.tools-art figcaption { color: #5f665a; justify-content: space-around; margin-top: 8px; }
.tool-redaction { fill: #242922; transform-box: fill-box; transform-origin: left; }
.tool-dot { fill: #a8370a; }
.contact-art { color: #24180f; border-top: 1px solid #1b110e50; padding-top: 16px; }
.contact-art .lower-trace { stroke: #17120e; stroke-width: 2.5; }
.pxl-home #faq details { position: relative; }
.pxl-home #faq details::before { content: ''; position: absolute; top: -1px; left: 0; height: 1px; width: 100%; background: #a8370a; transform-origin: left; }
.pxl-home #faq summary::after { width: 12px; height: 12px; border: 0; top: 26px; right: 8px; background: linear-gradient(currentColor,currentColor) center/12px 1px no-repeat,linear-gradient(currentColor,currentColor) center/1px 12px no-repeat; transform: none; }
.pxl-home #faq details[open] summary::after { top: 26px; transform: rotate(45deg); }
.pxl-home footer.site { position: relative; }
.pxl-home footer.site::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 2px; background: #ff9354; transform-origin: left; }
.section-motion-ready .cert-frame path,.section-motion-ready .lower-trace { stroke-dashoffset: calc(1 - var(--lower-progress,1)); }
.section-motion-ready .cert img { transform: translateY(calc((1 - var(--lower-progress,1))*14px)) scale(calc(.86 + var(--lower-progress,1)*.14)) rotate(calc((1 - var(--lower-progress,1))*-6deg)); }
.section-motion-ready #clients .quote::after,.section-motion-ready #faq details::before,.section-motion-ready footer.site::before { transform: scaleX(var(--lower-progress,1)); }
.section-motion-ready .quote figcaption { transform: translateX(calc((1 - var(--lower-progress,1))*14px)); }
.section-motion-ready .company-pixels { transform: translateY(calc((1 - var(--lower-progress,1))*12px)); }
.section-motion-ready .tool-redaction { transform: scaleX(calc(.15 + var(--lower-progress,1)*.85)); }
.section-motion-ready .tool-dot { opacity: calc(.25 + var(--lower-progress,1)*.75); }
@media (max-width: 700px) {
  .company-art { padding: 12px 14px 20px; }
  .company-art-labels { gap: 8px; font-size: 11px; }
  .lower-art > svg { max-height: 220px; }
  .cert-frame { inset: 7px; width: calc(100% - 14px); height: calc(100% - 14px); }
  .quote-lead .quote-mark { width: 52px; height: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  .section-motion-ready .cert-frame path,.section-motion-ready .lower-trace { stroke-dashoffset: 0; }
  .section-motion-ready .cert img,.section-motion-ready .quote figcaption,.section-motion-ready .company-pixels,.section-motion-ready .tool-redaction { transform: none; }
  .section-motion-ready #clients .quote::after,.section-motion-ready #faq details::before,.section-motion-ready footer.site::before { transform: none; }
  .pxl-home #faq summary::after { transition: none; }
}

/* Touch controls replay the illustration without activating its case-study link. */
.case-preview { position: relative; display: flex; min-width: 0; }
.case-preview > .cs-card { flex: 1; min-width: 0; }
.case-replay,.process-replay,.tool-demo-controls button { min-height: 44px; min-width: 44px; cursor: pointer; font: 500 12px/1.4 Manrope,sans-serif; border: 1px solid #ffffff40; border-radius: 5px; }
.case-replay { position: absolute; top: 10px; right: 10px; z-index: 2; display: flex; align-items: center; gap: 7px; padding: 8px 12px; background: #0b0c0eef; color: #ffbd94; }
.case-replay span { font-size: 20px; }
.case-replay:hover { background: #27201c; border-color: #ff9354; }
.pxl-home #process .process-art { position: relative; }
.pxl-home #process .process-art > svg { width: calc(100% - 48px); }
.process-replay { position: absolute; right: 0; top: 50%; transform: translateY(-50%); padding: 4px; font-size: 22px; background: #ffffff06; color: #ffbd94; }
.tool-demo-controls { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-around; margin-top: 20px; }
.tool-demo-controls button { padding: 10px 14px; background: #f8f9f6; border-color: #b5beb0; color: #384331; flex: 1; }
.tool-demo-controls button:hover { border-color: #a8370a; background: #fff; }
.tool-demo-note { color: #72786d; font-size: 11px; line-height: 1.5; text-align: center; margin: 12px 0 0; }
.tool-sample { stroke: #4b5345; stroke-width: 2; }
.tools-art[data-redacted] .tool-redaction { transition: transform .3s var(--ease); }
.tools-art[data-redacted="false"] .tool-redaction { transform: scaleX(0); }
.tools-art[data-redacted="true"] .tool-redaction { transform: scaleX(1); }
.case-replay:disabled,.process-replay:disabled,.tool-demo-controls button:disabled { opacity: .45; cursor: default; }
.case-replay[hidden],.process-replay[hidden],.tool-demo-controls[hidden] { display: none!important; }
@media (prefers-reduced-motion: reduce) { .tools-art[data-redacted] .tool-redaction { transition: none; } }
.section-motion-paused .tools-art[data-redacted] .tool-redaction { transition: none; }

/* Service-specific illustrations keep the enquiry CTA ahead of the visual. */
.landing-scene { margin: 34px 0 0; padding: 22px; border: 1px solid #ffffff26; border-radius: 8px; background: radial-gradient(ellipse at 45% 45%,#ff792c0a,transparent 70%),#101215; color: #d9dde3; }
.page-hero .landing-scene h2 { font: 500 18px/1.4 Manrope,sans-serif; color: #e8e9ec; letter-spacing: -.025em; margin: 0 0 24px; }
.landing-diagram { position: relative; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; align-items: stretch; }
.landing-routes { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke-width: 1.5; pointer-events: none; }
.landing-track { stroke: #454b55; }
.landing-trace { stroke: #ff9354; stroke-dasharray: 1; stroke-dashoffset: 0; }
.landing-node { position: relative; display: flex; flex-direction: column; gap: 14px; min-height: 142px; padding: 16px 12px; background: #181b20; border: 1px solid #535863; border-radius: 6px; }
.landing-node > svg { width: 28px; height: 28px; flex-shrink: 0; fill: none; stroke: #aeb7c4; stroke-width: 1.3; }
.landing-node small { display: block; font: 10px/1.4 ui-monospace,monospace; color: #9ca4b1; margin-bottom: 6px; }
.landing-node b { display: block; color: #e7e9ed; font: 500 12px/1.45 Manrope,sans-serif; overflow-wrap: anywhere; }
.landing-check { display: none; position: absolute; right: 9px; top: 8px; color: #a9d0bd; font-size: 16px; }
.landing-scene[data-phase="2"] .landing-check { display: block; }
.landing-scene[data-phase="2"] .landing-trace { stroke: #a9d0bd; }
.landing-scene[data-phase="2"] .landing-node { border-color: #789d8b; }
.page-hero .landing-summary { margin: 20px 0; min-height: 62px; color: #b0b7c2; font-size: 13px; line-height: 1.65; }
.landing-controls { display: flex; gap: 5px; }
.landing-controls button { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; min-width: 44px; flex: 1; padding: 8px; background: #15181d; color: #bec6d2; border: 1px solid #ffffff2b; border-radius: 4px; font: 500 12px/1.3 Manrope,sans-serif; cursor: pointer; }
.landing-controls button span { font: 9px ui-monospace,monospace; color: #8993a2; }
.landing-controls button[aria-pressed="true"] { border-color: #ff9354; color: #ffc3a0; background: #ff792c10; }
.landing-controls .landing-replay { flex: 0 0 44px; font-size: 22px; }
.landing-controls button:disabled { opacity: .45; cursor: default; }
.landing-controls[hidden],.landing-replay[hidden] { display: none!important; }
.landing-scene figcaption { margin-top: 14px; font-size: 11px; color: #939ca9; }
.landing-announcement { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.landing-ready .landing-trace { stroke-dashoffset: calc(1 - var(--landing-progress,1)); }
.pxl-landing .diff-card { position: relative; }
.pxl-landing .diff-card::after { content: ''; position: absolute; top: 0; left: 0; height: 2px; width: calc(var(--landing-item,1)*100%); background: #b25424; }
@media (max-width: 700px) {
  .landing-scene { padding: 18px; margin-top: 28px; }
  .page-hero .landing-scene h2 { font-size: 18px; margin-bottom: 20px; }
  .landing-diagram { grid-template-columns: 1fr; gap: 18px; }
  .landing-node { flex-direction: row; align-items: center; gap: 16px; min-height: 80px; padding: 12px 14px; }
  .landing-node b { font-size: 13px; }
  .landing-node small { margin-bottom: 4px; }
  .landing-controls button { font-size: 11px; gap: 4px; padding: 8px 5px; }
  .landing-controls button span { display: none; }
  .page-hero .landing-summary { min-height: 86px; font-size: 12px; margin: 18px 0; }
}
@media (prefers-reduced-motion: reduce) { .landing-ready .landing-trace { stroke-dashoffset: 0; } }

/* Phone story: native scrolling drives an original PXLSec access-control narrative. */
@media (max-width: 980px) and (min-height: 620px) {
  .hero-scroll-stage.mobile-motion-ready { min-height: 220svh; background: #0b0c0e; }
  .mobile-motion-ready .cinematic-hero { position: sticky; top: var(--scene-top,72px); height: calc(100svh - var(--scene-top,72px)); min-height: 0; padding: 0; display: block; overflow: hidden; touch-action: pan-y; }
  .scene-mobile .hero-intro { position: relative; z-index: 4; padding-top: clamp(20px,4svh,38px); }
  .scene-mobile .hero-intro .kicker { font-size: 9px; margin-bottom: 16px; }
  .scene-mobile h1 { font-size: clamp(36px,9.5vw,58px); margin-bottom: 18px; }
  :lang(bg) .scene-mobile h1 { font-size: clamp(30px,7.8vw,48px); }
  .scene-mobile .hero-intro .lead { font-size: 14px; line-height: 1.5; margin-bottom: 20px; max-width: 35ch; }
  .scene-mobile .hero-lead-full { display: none; }
  .scene-mobile .hero-lead-mobile { display: block; }
  .scene-mobile .cta .btn { min-height: 44px; padding: 12px 14px; font-size: 12px; }
  .scene-mobile .cta .btn-ghost-dark { display: none; }
  .scene-mobile .mobile-scroll-cue { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 12px 0 0; color: #aeb3bd; font-size: 11px; line-height: 1.5; }
  .scene-mobile .surface-scene { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0; }
  .scene-mobile .surface-field { mask-image: linear-gradient(transparent,black 15%,black 94%,transparent); touch-action: pan-y; }
  .scene-mobile .surface-node { min-width: 0; width: 72%; max-width: 280px; padding: 10px 12px; gap: 10px; transition-duration: .4s; }
  .scene-mobile .surface-node svg { width: 24px; height: 24px; flex: 0 0 24px; }
  .scene-mobile .surface-node small { font-size: 7px; max-width: none; }
  .scene-mobile .surface-node b { font-size: 12px; line-height: 1.3; }
  .scene-mobile .bubble-status { font-size: 9px; margin-top: 3px; }
  .scene-mobile.visual-motion-running .surface-node { animation: none; }
  .scene-mobile[data-scene-state="discover"] .node-app { left: 6%; top: 49%; }
  .scene-mobile[data-scene-state="discover"] .node-identity { left: 27%; top: 62%; }
  .scene-mobile[data-scene-state="discover"] .node-data { right: 6%; top: 73%; }
  .scene-mobile[data-scene-state="prove"] .node-app { left: 6%; top: 24%; }
  .scene-mobile[data-scene-state="prove"] .node-identity { left: 26%; top: 38%; }
  .scene-mobile[data-scene-state="prove"] .node-data { right: 6%; top: 52%; }
  .scene-mobile[data-scene-state="verify"] .node-app { left: 6%; top: 24%; }
  .scene-mobile[data-scene-state="verify"] .node-identity { left: 15%; top: 38%; border-color: #7ecbb080; }
  .scene-mobile[data-scene-state="verify"] .node-data { right: 6%; top: 52%; border-color: #7ecbb080; }
  .scene-mobile .attack-connections { opacity: .8; }
  .scene-mobile .dive-copy { left: 20px; right: 20px; top: 3%; width: auto; max-width: 620px; }
  .scene-mobile .dive-copy .kicker { display: none; }
  .scene-mobile .dive-copy h2, :lang(bg) .scene-mobile .dive-copy h2 { font-size: clamp(24px,4svh,34px); line-height: 1.15; margin-bottom: 12px; letter-spacing: -.035em; }
  :lang(bg) .scene-mobile .dive-copy h2 { font-size: clamp(22px,2.9svh,27px); }
  .scene-mobile .dive-copy > p:last-child { font-size: 13px; line-height: 1.5; max-width: 44ch; margin-bottom: 0; }
  .scene-mobile .graph-labels, .scene-mobile .dive-tether { display: none; }
  .scene-mobile .dive-finding { top: auto; bottom: 112px; right: 20px; left: 20px; width: auto; max-width: 620px; padding: 14px 16px; box-shadow: 0 16px 40px #0006; }
  .scene-mobile .dive-finding .kicker { font-size: 8px; margin-bottom: 8px; }
  .scene-mobile .dive-finding .fsev { position: absolute; top: 13px; right: 13px; font-size: 9px; margin: 0; }
  .scene-mobile .dive-finding h3 { font-size: 18px; line-height: 1.2; margin-bottom: 8px; max-width: 24ch; }
  .scene-mobile .dive-scope { display: none; }
  .scene-mobile .dive-finding .dive-summary { font-size: 11px; margin-bottom: 8px; }
  .scene-mobile .dive-finding a { display: inline-block; font-size: 12px; padding-block: 5px; }
  .scene-mobile .scene-console { left: 14px; right: 14px; bottom: 39px; justify-content: center; }
  .scene-mobile .scene-caption { display: none; }
  .scene-mobile .scene-controls { width: 100%; max-width: 520px; display: flex; background: #151719e8; border-color: #ffffff30; }
  .scene-mobile .scene-controls button { flex: 1; min-height: 44px; padding: 10px 7px; font-size: 11px; }
  .scene-mobile .scene-controls button span { margin-right: 4px; }
  .scene-mobile .surface-scene figcaption { left: 14px; right: 14px; bottom: 0; font-size: 9px; border: 0; min-height: 44px; }
  .scene-mobile .motion-toggle { min-height: 44px; padding: 5px 8px; font-size: 9px; }
  .scene-mobile .scene-console { bottom: 49px; }
  .scene-mobile .node-data { opacity: calc(1 - var(--finding-opacity)); }
}
@media (max-width: 980px) and (min-height: 620px) and (max-height: 740px) {
  .scene-mobile .hero-intro .kicker { margin-bottom: 12px; }
  .scene-mobile .hero-intro { padding-top: 18px; }
  .scene-mobile h1 { font-size: 36px; }
  :lang(bg) .scene-mobile h1 { font-size: 29px; }
  .scene-mobile .hero-intro .lead { font-size: 12px; margin-bottom: 12px; }
  .scene-mobile .surface-node { padding-block: 6px; }
  .scene-mobile[data-scene-state="discover"] .node-app { top: 46%; }
  .scene-mobile[data-scene-state="discover"] .node-identity { top: 59%; }
  .scene-mobile[data-scene-state="discover"] .node-data { top: 71%; }
  .scene-mobile .surface-node small { display: none; }
  .scene-mobile .dive-copy h2, :lang(bg) .scene-mobile .dive-copy h2 { font-size: 22px; }
  :lang(bg) .scene-mobile .dive-copy h2 { font-size: 21px; }
  .scene-mobile .dive-copy > p:last-child { font-size: 11.5px; }
  .scene-mobile .dive-finding { padding: 11px 14px; }
  .scene-mobile .dive-finding h3 { font-size: 16px; max-width: 25ch; margin-bottom: 6px; }
  .scene-mobile .dive-finding .kicker { max-width: 26ch; font-size: 7px; }
  .scene-mobile .dive-finding .dive-summary { margin-bottom: 3px; }
}
@media (max-width: 360px) {
  .scene-mobile h1 { font-size: 32px; }
  :lang(bg) .scene-mobile h1 { font-size: 24px; }
}
@media (max-width: 980px) and (max-height: 660px) {
  .scene-mobile .hero-intro .kicker { display: none; }
  .scene-mobile[data-scene-state="discover"] .node-app { top: 43%; }
  .scene-mobile[data-scene-state="discover"] .node-identity { top: 56%; }
  .scene-mobile[data-scene-state="discover"] .node-data { top: 69%; }
}

/* Ambient relief behind inner-page heroes. */
.relief-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; opacity: 0; transition: opacity 1.4s var(--ease); mask-image: linear-gradient(to bottom, transparent 0, black 30%, black 100%); -webkit-mask-image: linear-gradient(to bottom, transparent 0, black 30%, black 100%); }
.page-hero.relief-ready .relief-canvas { opacity: .9; }
.page-hero.relief-ready::before { opacity: .05; }
.page-hero.relief-ready::after { opacity: .3; }
.page-hero.relief-ready { background: #0b0c0e; }
@media (prefers-reduced-motion: reduce) { .relief-canvas { transition: none; } }

/* v3 surface: labels ride the lights on the water, the headline sinks below the horizon. */
.cinematic-hero .surface-node { min-width: 0; width: auto; max-width: none; padding: 0; gap: 0; background: none; border: 0; box-shadow: none; backdrop-filter: none; border-radius: 0; transition: none; animation: none !important; translate: none; }
.labels-placed .surface-node, .labels-placed .surface-node:is(.node-app,.node-identity,.node-data) { left: 0; top: 0; right: auto; will-change: transform; }
.cinematic-hero .surface-node::before { content: ''; position: absolute; left: -14px; top: 6px; width: 9px; height: 1px; background: #c8d2e299; }
.cinematic-hero .surface-node svg, .cinematic-hero .surface-node small, .cinematic-hero .node-light { display: none; }
.cinematic-hero .surface-node > div { display: flex; flex-direction: column; gap: 5px; }
.cinematic-hero .surface-node b { font: 500 12px/1 ui-monospace,"SF Mono",Menlo,monospace; color: #f3f2f6; letter-spacing: .01em; white-space: nowrap; text-shadow: 0 0 3px #0b0c0e,0 0 12px #0b0c0e; }
.cinematic-hero .surface-node .bubble-status { font: 500 10px/1 ui-monospace,"SF Mono",Menlo,monospace; letter-spacing: .08em; text-transform: uppercase; color: #868d98; text-shadow: 0 0 3px #0b0c0e,0 0 12px #0b0c0e; }
.cinematic-hero[data-scene-state="prove"] .node-identity .bubble-status { color: #ffae7c; }
.cinematic-hero[data-scene-state="verify"] .bubble-status { color: #a4dbc7; }
.cinematic-hero .path-track { display: none; }
.cinematic-hero[data-scene-state="discover"] .path-signal { opacity: 0; }
.scene-journey.horizon-masked .hero-intro { mask-image: linear-gradient(to bottom, #000 calc(var(--cut,9999px) - var(--intro-shift,0px) - 1px), transparent calc(var(--cut,9999px) - var(--intro-shift,0px))); -webkit-mask-image: linear-gradient(to bottom, #000 calc(var(--cut,9999px) - var(--intro-shift,0px) - 1px), transparent calc(var(--cut,9999px) - var(--intro-shift,0px))); }
.graph-labels > span { flex-direction: column; align-items: flex-start; gap: 5px; font: 500 12px/1 ui-monospace,"SF Mono",Menlo,monospace; color: #f3f2f6; letter-spacing: .01em; text-shadow: 0 0 3px #0b0c0e,0 0 12px #0b0c0e; }
.graph-labels > span::after { content: attr(data-kind); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #868d98; }
.graph-labels i { position: absolute; left: -14px; top: 6px; width: 9px; height: 1px; border-radius: 0; background: #c8d2e299; box-shadow: none; }
.scene-caption { color: #868d98; }
.scene-controls { background: #0f1013; border-color: #ffffff14; }
.scene-mobile .surface-node { width: auto; padding: 0; } .scene-mobile .surface-node b { font-size: 11px; } .scene-mobile .surface-node .bubble-status { font-size: 9px; margin-top: 0; }

/* ---------- Homepage rhythm (26 October 2026): dark hero and work bands, off-white reading bands, never stark white. ---------- */
.pxl-home .sec { padding-block: clamp(88px,11vw,152px); }
.pxl-home .sec h2, .pxl-home .sec-head h2 { font-weight: 500; font-size: clamp(30px,3.4vw,52px); line-height: 1.06; letter-spacing: -.028em; text-wrap: balance; }
.pxl-home .sec-head > p { font-size: clamp(16px,1.2vw,19px); line-height: 1.55; max-width: 56ch; text-wrap: pretty; }
.pxl-home .sec-head > .kicker, .pxl-home .evidence-copy .kicker { font: 500 12px/1 ui-monospace,"SF Mono",Menlo,monospace; letter-spacing: .08em; text-transform: uppercase; }
.pxl-home #specialist-testing, .pxl-home #report, .pxl-home #certifications, .pxl-home #sectors { background: #f4f4f2; }
.pxl-home #faq { background: #eceeeb; }
.pxl-home .contact { border-top: 0; }
.pxl-home .contact h2 { font-weight: 500; letter-spacing: -.04em; }
/* One reveal grammar, site-wide: rise out of the ground, 90 ms between siblings. */
.rise { transition: opacity .8s var(--ease), transform .9s var(--ease); transition-delay: calc(var(--i,0) * 90ms + 80ms); }
.rise.is-pending { opacity: 0; transform: translateY(18px); }
.rise:focus-within { opacity: 1; transform: none; }
.count-up { font-variant-numeric: tabular-nums; }
/* Navigation: slides away on the way down, returns on the way up. */
header.site { transition: transform .45s var(--ease), background .3s; }
header.site.nav-hidden { transform: translateY(-100%); }
@media (prefers-reduced-motion: reduce) { .rise, .rise.is-pending { opacity: 1; transform: none; transition: none; } header.site { transition: none; } header.site.nav-hidden { transform: none; } }

/* Replay and pause controls are retired (owner request, 26 October 2026); reduced motion still disables all animation. */
.case-replay, .process-replay, .tool-demo-controls, .section-motion-toggle, .motion-toggle { display: none !important; }
.surface-scene figcaption { justify-content: flex-start; }
/* Next steps at the end of every article and advisory. */
.post-next { display: grid; grid-template-columns: 1.1fr .9fr; gap: 28px 40px; align-items: center; margin: 56px 0 8px; padding: 32px; border: 1px solid var(--rule); border-radius: 12px; background: #f4f4f2; }
.post-next h3 { margin: 0 0 8px; font: 500 clamp(22px,2vw,28px)/1.2 Manrope,sans-serif; letter-spacing: -.03em; color: var(--text); }
.post-next p { margin: 0; color: var(--slate); font-size: 16px; }
.post-next-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.post-next-link { color: var(--signal-ink); font-weight: 500; text-underline-offset: 4px; }
.adv-service-links { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin: 16px 0 0; }
.adv-service-links a:not(.btn) { color: var(--signal-ink); font-weight: 500; }
.blog-hero .cta, .research-hero .cta { margin: 24px 0 18px; }
@media (max-width: 760px) { .post-next { grid-template-columns: 1fr; padding: 24px; } }
.btn-outline { background: transparent; border: 1px solid #1a1511; color: #1a1511; }
.btn-outline:hover { background: #1a1511; color: #fff; }
.page-hero .btn-outline, .sec-ink .btn-outline, .art-head .btn-outline { border-color: #ffffff40; color: #f5f5f2; }

/* ---------- Homepage, evidence-first order (26 October 2026): proof strip, engagement log, certifications on dark. ---------- */
.hero-proof { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: 4px 10px; }
.hero-proof a { color: #e6e7ea; text-decoration: underline; text-decoration-color: #ffffff45; text-underline-offset: 3px; }
.hero-proof a:hover { text-decoration-color: #ff9354; }
@media (min-width: 761px) { .cinematic-hero .lead, :lang(bg) .cinematic-hero .lead { max-width: 60ch; } }

.proof-strip { background: #0b0c0e; color: #e5e6e8; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); }
.proof-row { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
.proof-item { display: flex; flex-direction: column; gap: 10px; padding: 40px 28px 38px; border-left: 1px solid rgba(255,255,255,.08); color: inherit; text-decoration: none; transition: background .3s; }
.proof-item:first-child { border-left: 0; padding-left: 0; }
.proof-item b { font: 500 clamp(34px,3.4vw,52px)/1 Manrope,sans-serif; letter-spacing: -.04em; color: #f4f4f1; }
.proof-item span { color: #8c9099; font-size: 14px; line-height: 1.45; max-width: 26ch; transition: color .3s; }
.proof-item:hover span, .proof-item:focus-visible span { color: #d9dadd; }
.proof-item:hover b { color: #ffae7c; }

.pxl-home #clients { background: #f4f4f2; }

.pxl-home .eng { background: #0b0c0e; color: #e5e6e8; }
.pxl-home .eng .sec-head h2 { color: #f4f4f1; }
.pxl-home .eng .sec-head p { color: #a5a8b1; }
.pxl-home .eng .sec-head .kicker, .pxl-home .eng .sec-head a { color: #ffae7c; }
.eng-layout { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(32px,6vw,96px); align-items: start; }
.eng-stages { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(255,255,255,.08); }
.eng-stage { display: grid; grid-template-columns: 52px 1fr; gap: 0 12px; padding: 26px 0; border-bottom: 1px solid rgba(255,255,255,.08); transition: opacity .5s var(--ease); }
.eng-num { font: 500 12px/1.9 ui-monospace,"SF Mono",Menlo,monospace; color: #ffae7c; letter-spacing: .06em; }
.eng-stage h3 { margin: 0 0 6px; font: 500 22px/1.25 Manrope,sans-serif; letter-spacing: -.02em; color: #f4f4f1; }
.eng-stage p { margin: 0; color: #a5a8b1; font-size: 15px; line-height: 1.55; max-width: 44ch; }
.eng-console { margin: 0; background: #131519; border: 1px solid rgba(255,255,255,.09); border-radius: 14px; overflow: hidden; box-shadow: 0 40px 90px rgba(0,0,0,.45); }
.eng-bar { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 14px; }
.eng-bar b { font: 600 14px Manrope,sans-serif; color: #f4f4f1; padding-right: 12px; border-right: 1px solid rgba(255,255,255,.14); }
.eng-bar span { color: #b4b7bf; font: 13px ui-monospace,"SF Mono",Menlo,monospace; }
.eng-tabs { display: flex; flex-wrap: wrap; gap: 4px 18px; padding: 12px 18px; border-bottom: 1px solid rgba(255,255,255,.06); font-size: 13px; color: #6f737c; }
.eng-tabs span { transition: color .4s; }
.eng-tabs span.is-done { color: #9fc2b2; }
.eng-tabs span.is-active { color: #f4f4f1; }
.eng-body { padding: 16px 18px 10px; }
.eng-live { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; color: #8c9099; font: 500 11px/1 ui-monospace,"SF Mono",Menlo,monospace; letter-spacing: .08em; text-transform: uppercase; }
.eng-live i { width: 6px; height: 6px; border-radius: 50%; background: #ff792c; box-shadow: 0 0 10px #ff792c; }
.eng-log { list-style: none; margin: 0; padding: 0; font: 12.5px/1.45 ui-monospace,"SF Mono",Menlo,monospace; }
.eng-log li { display: flex; gap: 12px; padding: 5px 0; border-bottom: 1px dashed rgba(255,255,255,.06); color: #b4b7bf; transition: opacity .45s var(--ease), transform .45s var(--ease), color .45s; }
.eng-tag { flex: none; color: #5d616a; }
.eng-foot { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-top: 1px solid rgba(255,255,255,.08); }
.eng-foot div { padding: 12px 18px; border-left: 1px solid rgba(255,255,255,.08); }
.eng-foot div:first-child { border-left: 0; }
.eng-foot small { display: block; color: #6f737c; font: 500 10px/1 ui-monospace,"SF Mono",Menlo,monospace; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 8px; }
.eng-foot b { font: 500 14px/1.3 Manrope,sans-serif; color: #f4f4f1; }
.eng-console figcaption { padding: 10px 18px; border-top: 1px solid rgba(255,255,255,.06); color: #6f737c; font-size: 12px; }
/* Scroll-led log: enabled by visual.js on wide screens only; otherwise every line stays visible. */
@media (min-width: 981px) {
  .eng-live-mode .eng-console { position: sticky; top: max(96px,calc(50vh - 330px)); }
  .eng-live-mode .eng-stage { min-height: 38vh; align-content: start; opacity: .35; }
  .eng-live-mode .eng-stage.is-active { opacity: 1; }
  .eng-live-mode .eng-stage.is-done { opacity: .6; }
  .eng-live-mode .eng-log li.is-future { opacity: 0; transform: translateY(6px); }
  .eng-live-mode .eng-log li.is-current { color: #f4f4f1; }
  .eng-live-mode .eng-log li.is-current .eng-tag { color: #ff9354; }
  .eng-live-mode[data-active="4"] .eng-log li.is-current .eng-tag { color: #9fc2b2; }
}

/* Certifications sit on a dark band between the light services and testimonial bands. */
.pxl-home section#certifications { background: #0b0c0e; color: #e5e6e8; }
.pxl-home section#certifications .sec-head h2 { color: #f4f4f1; }
.pxl-home section#certifications .sec-head p { color: #a5a8b1; }
.pxl-home section#certifications .certs, .pxl-home section#certifications .cert { border-color: rgba(255,255,255,.08); }
.pxl-home section#certifications .cert b { color: #f4f4f1; }
.pxl-home section#certifications .cert span { color: #8c9099; }
.pxl-home section#certifications .cert-frame { stroke: #ff792c55; }

/* Cookie choice: a compact card in the corner rather than a panel across the page. */
.cookie-panel { inset: auto auto 20px 20px; max-width: 400px; padding: 18px 20px; border-radius: 12px; box-shadow: 0 18px 50px rgba(11,12,14,.35); }
.cookie-panel h2 { font-size: 16px; margin: 0 0 6px; letter-spacing: -.01em; }
.cookie-panel p { font-size: 13px; line-height: 1.5; margin: 0 0 14px; color: var(--slate); }
.cookie-actions { gap: 8px 10px; }
.cookie-actions .btn { min-height: 44px; padding: 8px 14px; font-size: 14px; flex: 1 1 0; }
.cookie-actions a { flex-basis: 100%; font-size: 13px; }

@media (max-width: 980px) {
  .proof-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .proof-item { padding: 28px 20px; }
  .proof-item:nth-child(odd) { border-left: 0; padding-left: 0; }
  .proof-item:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.08); }
  .eng-layout { grid-template-columns: 1fr; }
  .eng-body { min-height: 0; }
}
@media (max-width: 560px) {
  .proof-item b { font-size: 32px; }
  .proof-item span { font-size: 13px; }
  .eng-foot { grid-template-columns: 1fr; }
  .eng-foot div { border-left: 0; border-top: 1px solid rgba(255,255,255,.08); }
  .eng-foot div:first-child { border-top: 0; }
  .cookie-panel { inset: auto 12px 12px; max-width: none; }
}
@media (prefers-reduced-motion: reduce) { .eng-stage, .eng-log li, .eng-tabs span, .proof-item span { transition: none; } }
/* Phone hero (26 October 2026): editorial type and both actions. This block is the static layout, used when the
   dive cannot run (short screens, reduced motion, no WebGL); the phone dive itself is styled further down. */
@media (max-width: 760px) {
  .pxl-home .cinematic-hero:not(.scene-mobile) { display: flex; flex-direction: column; min-height: calc(100svh - 72px); }
  .pxl-home .cinematic-hero:not(.scene-mobile) .hero-intro { text-align: left; padding-top: clamp(28px,5svh,48px); }
  .pxl-home .cinematic-hero:not(.scene-mobile) .kicker { justify-content: flex-start; margin-bottom: 22px; font-size: 10.5px; }
  .pxl-home .hero-proof { justify-content: flex-start; }
  .pxl-home .hero-proof > span:nth-child(n+4) { display: none; }
  .pxl-home .cinematic-hero:not(.scene-mobile) h1, :lang(bg) .pxl-home .cinematic-hero:not(.scene-mobile) h1 { font-size: clamp(42px,12.4vw,60px); line-height: .98; letter-spacing: -.055em; margin: 0 0 20px; text-align: left; }
  :lang(bg) .pxl-home .cinematic-hero:not(.scene-mobile) h1 { font-size: clamp(36px,10.4vw,52px); line-height: 1.04; }
  .pxl-home .cinematic-hero:not(.scene-mobile) h1 span { white-space: normal; }
  .pxl-home .cinematic-hero:not(.scene-mobile) .lead, :lang(bg) .pxl-home .cinematic-hero:not(.scene-mobile) .lead { font-size: 16px; line-height: 1.55; max-width: 36ch; margin: 0 0 26px; text-align: left; }
  .pxl-home .cinematic-hero:not(.scene-mobile) .cta { flex-direction: column; align-items: stretch; gap: 10px; }
  .pxl-home .cinematic-hero:not(.scene-mobile) .cta .btn { width: 100%; justify-content: space-between; min-height: 54px; padding: 15px 20px; font-size: 15px; }
  .pxl-home .cinematic-hero:not(.scene-mobile) .surface-scene { flex: 1 0 auto; height: auto; min-height: 240px; margin: 30px 0 0; padding: 0; width: 100%; max-width: none; }
  .pxl-home .cinematic-hero:not(.scene-mobile) :is(.surface-node, .attack-connections, .scene-console, .graph-labels), .pxl-home .surface-scene figcaption { display: none; }
  /* The sea canvas is opaque; keep it inside its band so it never covers the second button. */
  .pxl-home .cinematic-hero:not(.scene-mobile) .surface-field { inset: 0 -24px; mask-image: linear-gradient(transparent,black 22%); -webkit-mask-image: linear-gradient(transparent,black 22%); }
}

/* ---------- Anatomy of a finding (evidence section, 26 October 2026): evidence, fix and retest for four example findings. ---------- */
.anatomy { background: #eceeeb; }
.anat { display: grid; grid-template-columns: minmax(220px,.32fr) minmax(0,1fr); gap: 28px; align-items: start; }
.anat-picker { display: grid; gap: 8px; position: sticky; top: 108px; }
.anat-tab { display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; align-items: center; text-align: left; padding: 14px 16px; border: 1px solid #d6d9d3; border-radius: 10px; background: transparent; color: #1a1511; cursor: pointer; font: inherit; transition: background .25s, border-color .25s, box-shadow .25s; }
.anat-tab b { font: 500 15px/1.3 Manrope,sans-serif; letter-spacing: -.01em; }
.anat-tab small { grid-column: 2; font: 11px/1 ui-monospace,"SF Mono",Menlo,monospace; color: #73786c; letter-spacing: .04em; }
.anat-tab .fsev { grid-row: span 2; align-self: start; }
.anat-tab:hover { background: #f6f7f4; border-color: #c4c8c0; }
.anat-tab[aria-selected="true"] { background: #fff; border-color: #1a1511; box-shadow: 0 12px 30px #20272112; }
.anat-tab:focus-visible { outline: 2px solid #a8370a; outline-offset: 2px; }
.anat-panels { min-width: 0; }
.anat-panel { background: #fff; border: 1px solid #d3d6d1; border-top: 3px solid #b31717; border-radius: 10px; box-shadow: 0 32px 80px #20272112; overflow: hidden; }
.anat-panel + .anat-panel { margin-top: 28px; }
.anat-panel[hidden] + .anat-panel { margin-top: 0; }
.anat-panel[hidden] { display: none; }
.anat-panel .window-bar small { font-size: 10px; }
.anat-head { padding: 26px 30px 22px; border-bottom: 1px solid #e6e8e3; }
.anat-head .fsev { display: inline-block; margin-bottom: 12px; }
.anat-head h3 { margin: 0 0 18px; font: 500 clamp(22px,2vw,28px)/1.2 Manrope,sans-serif; letter-spacing: -.025em; color: #1a1511; }
.anat-head dl { display: grid; grid-template-columns: 90px minmax(0,1fr); gap: 8px 16px; margin: 0; font-size: 14px; line-height: 1.5; }
.anat-head dt { color: #73786c; }
.anat-head dd { margin: 0; color: #3c3f45; }
.anat-head code { font: 13px ui-monospace,"SF Mono",Menlo,monospace; background: #f2f3ef; padding: 2px 6px; border-radius: 4px; }
.anat-steps { list-style: none; margin: 0; padding: 10px 30px 30px; }
.anat-step { display: grid; grid-template-columns: 170px minmax(0,1fr); gap: 8px 24px; padding: 20px 0; position: relative; }
.anat-step + .anat-step { border-top: 1px dashed #e1e3de; }
.anat-label span { display: block; font: 500 11px/1 ui-monospace,"SF Mono",Menlo,monospace; color: #a8370a; letter-spacing: .06em; margin-bottom: 8px; }
.anat-label b { display: block; font: 600 16px/1.3 Manrope,sans-serif; color: #1a1511; margin-bottom: 4px; }
.anat-label p { margin: 0; font-size: 13px; line-height: 1.45; color: #6b6f67; }
.anat-step-2 .anat-label span { color: #2f7d57; }
.anat-code { margin: 0; padding: 14px 16px; background: #111317; color: #c9ccd3; border-radius: 8px; overflow-x: auto; font: 12.5px/1.6 ui-monospace,"SF Mono",Menlo,monospace; }
.anat-code code { font: inherit; background: none; padding: 0; display: block; }
.anat-code .ln { display: grid; grid-template-columns: max-content minmax(120px,1fr); gap: 0 18px; padding: 0 6px; margin: 0 -6px; border-radius: 3px; }
.anat-code .lc { white-space: pre; }
.anat-code .ann { white-space: normal; }
.anat-code .ann { color: #ff9b5e; font-style: italic; }
.anat-code .k-req .lc { color: #f4f4f1; }
.anat-code .k-hl .lc { color: #ffd59a; }
.anat-code .k-bad .lc { color: #ff8f86; }
.anat-code .k-ok .lc { color: #8fd6b0; }
.anat-code .k-ok .ann { color: #8fd6b0; }
.anat-code .k-del { background: rgba(255,95,86,.12); }
.anat-code .k-del .lc { color: #ffb0aa; }
.anat-code .k-del .lc::before { content: '− '; color: #ff8f86; }
.anat-code .k-add { background: rgba(70,200,140,.12); }
.anat-code .k-add .lc { color: #b5ecd0; }
.anat-code .k-add .lc::before { content: '+ '; color: #8fd6b0; }
.anat-closed { grid-column: 2; display: inline-flex; align-items: center; gap: 8px; justify-self: start; margin: 4px 0 0; padding: 6px 12px; border-radius: 999px; background: #e7f4ec; color: #1f6845; font-size: 13px; font-weight: 600; }
.anat-closed i { width: 8px; height: 8px; border-radius: 50%; background: #2f9d68; box-shadow: 0 0 0 4px #2f9d6826; }
.anat-note { grid-column: 2; margin: 14px 2px 0; font-size: 12.5px; color: #6b6f67; }
/* Scroll-driven: visual.js marks steps, lines and the stamp .is-on in reading order as the reader scrolls,
   and takes the marks away again on the way back up. Without .anat-motion everything is simply shown. */
.anat-code .k-del .lc { justify-self: start; background: linear-gradient(#ff8f8680,#ff8f8680) no-repeat 0 55% / 100% 1px; }
.anat.anat-motion .anat-label { opacity: .3; transform: translateX(-6px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.anat.anat-motion .anat-step.is-on .anat-label { opacity: 1; transform: none; }
.anat.anat-motion .anat-code .ln { opacity: 0; clip-path: inset(0 100% 0 0); transform: translateX(-4px); transition: opacity .3s ease, clip-path .45s var(--ease), transform .45s var(--ease); }
.anat.anat-motion .anat-code .ln.is-on { opacity: 1; clip-path: inset(0); transform: none; }
.anat.anat-motion .anat-code .k-bad.is-on { animation: anat-flag-bad 1.6s ease-out .15s both; }
.anat.anat-motion .anat-code .k-ok.is-on { animation: anat-flag-ok 1.6s ease-out .15s both; }
.anat.anat-motion .anat-code .k-del .lc { background-size: 0 1px; transition: background-size .5s var(--ease) .3s; }
.anat.anat-motion .anat-code .k-del.is-on .lc { background-size: 100% 1px; }
.anat.anat-motion .anat-code .ann { opacity: 0; transition: opacity .4s ease .2s; }
.anat.anat-motion .anat-code .ln.is-on .ann { opacity: 1; }
.anat.anat-motion .anat-closed { opacity: 0; transform: scale(.82); transition: opacity .3s ease, transform .55s cubic-bezier(.2,1.5,.4,1); }
.anat.anat-motion .anat-closed.is-on { opacity: 1; transform: none; }
.anat.anat-motion .anat-closed.is-on i { animation: anat-ping 1.4s ease-out .3s 2; }
.anat-panel.is-entering { animation: anat-enter .4s var(--ease) both; }
@keyframes anat-enter { from { opacity: .35; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes anat-flag-bad { 0% { background: rgba(255,95,86,0); } 15% { background: rgba(255,95,86,.3); } 100% { background: rgba(255,95,86,0); } }
@keyframes anat-flag-ok { 0% { background: rgba(70,200,140,0); } 15% { background: rgba(70,200,140,.3); } 100% { background: rgba(70,200,140,0); } }
@keyframes anat-ping { 0% { box-shadow: 0 0 0 0 #2f9d6866; } 100% { box-shadow: 0 0 0 12px #2f9d6800; } }
/* Pinned (wide screens tall enough for the panel): it holds still while scrolling writes each finding in
   turn. The layout tightens so the tallest finding fits; the tab bars fill as the reader moves through them. */
.anat.is-pinned { grid-template-rows: minmax(0,1fr) auto; }
.anat.is-pinned .anat-picker, .anat.is-pinned .anat-panels { position: sticky; top: var(--pin-top, 24px); }
.anat.is-pinned .window-bar { padding: 11px 21px; }
.anat.is-pinned .anat-head { padding: 18px 28px 14px; }
.anat.is-pinned .anat-head .fsev { margin-bottom: 8px; }
.anat.is-pinned .anat-head h3 { margin-bottom: 10px; }
.anat.is-pinned .anat-steps { padding: 2px 28px 16px; }
.anat.is-pinned .anat-step { padding: 12px 0; }
.anat.is-pinned .anat-code { padding: 10px 14px; line-height: 1.5; }
.anat-tab { position: relative; overflow: hidden; }
.anat-tab::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: #a8370a; transform: scaleX(var(--p, 0)); transform-origin: left; pointer-events: none; display: none; }
.anat.is-pinned .anat-tab::after { display: block; }

.anat-receive { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: clamp(32px,6vw,90px); align-items: center; margin-top: clamp(64px,8vw,110px); padding-top: clamp(48px,6vw,80px); border-top: 1px solid #d6d9d3; }
.anat-pages { margin: 0; }
.anat-pages ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.anat-pages li { display: grid; gap: 10px; transition: transform .35s var(--ease); }
.anat-pages li:nth-child(odd) { transform: translateY(18px); }
.anat-pages img { width: 100%; height: auto; border-radius: 4px; box-shadow: 0 1px 0 #0000000d, 0 18px 40px #2027211f; background: #fff; }
.anat-pages span { font-size: 12px; color: #6b6f67; line-height: 1.35; }
.anat-pages li:hover { transform: translateY(-6px); }
.anat-receive-copy h3 { margin: 0 0 10px; font: 500 clamp(26px,2.4vw,36px)/1.1 Manrope,sans-serif; letter-spacing: -.03em; color: #1a1511; }
.anat-receive-copy > p { margin: 0 0 22px; color: #61636a; font-size: 16px; line-height: 1.55; max-width: 46ch; }
.anat-deliver { list-style: none; margin: 0 0 18px; padding: 0; border-top: 1px solid #d6d9d3; }
.anat-deliver li { display: grid; grid-template-columns: minmax(150px,.8fr) 1fr; gap: 4px 16px; padding: 11px 0; border-bottom: 1px solid #d6d9d3; font-size: 14px; }
.anat-deliver b { font-weight: 600; color: #1a1511; }
.anat-deliver span { color: #61636a; }
.anat-frameworks { margin: 0 0 22px; font-size: 13px; color: #6b6f67; }

@media (max-width: 980px) {
  .anat { grid-template-columns: 1fr; }
  .anat-picker { position: static; grid-template-columns: repeat(4,minmax(0,1fr)); }
  .anat-note { grid-column: 1; }
  .anat-receive { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .anat-head { padding: 22px 20px 18px; }
  .anat-steps { padding: 4px 16px 20px; }
  .anat-step { grid-template-columns: 1fr; }
  .anat-closed { grid-column: 1; }
  .anat-picker { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .anat-tab { padding: 12px; grid-template-columns: 1fr; }
  .anat-tab .fsev { grid-row: auto; justify-self: start; }
  .anat-tab small { grid-column: 1; }
  .anat-code { font-size: 12px; }
  .anat-code .ln { grid-template-columns: minmax(0,1fr); }
  .anat-code .lc { white-space: pre-wrap; overflow-wrap: anywhere; }
  .anat-code .ann { padding-left: 1.2em; margin-bottom: 4px; }
  .anat-pages ul { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .anat-deliver li { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .anat-panel.is-entering .anat-step { animation: none; } .anat-pages li, .anat-tab { transition: none; } }

/* Phone dive (26 October 2026), modelled on hadrian.io's mobile hero: one full-screen scene, the headline sinks
   below the waterline, the graph and its three labels rise, then the evidence card arrives with its tether.
   No labels on the water, no step console, both actions, the same editorial type as the static phone hero. */
@media (max-width: 980px) and (min-height: 620px) {
  .hero-scroll-stage.mobile-motion-ready { min-height: 300svh; }
  .scene-mobile .hero-intro { text-align: left; padding-top: clamp(26px,4.5svh,48px); }
  .scene-mobile .hero-intro .kicker { justify-content: flex-start; font-size: 10.5px; margin-bottom: 22px; }
  .scene-mobile .hero-proof { justify-content: flex-start; }
  .scene-mobile h1, :lang(bg) .scene-mobile h1 { font-size: clamp(42px,12.4vw,60px); line-height: .98; letter-spacing: -.055em; margin: 0 0 20px; text-align: left; }
  :lang(bg) .scene-mobile h1 { font-size: clamp(36px,10.4vw,52px); line-height: 1.04; }
  .scene-mobile h1 span { white-space: normal; }
  .scene-mobile .hero-intro .lead, :lang(bg) .scene-mobile .hero-intro .lead { font-size: 16px; line-height: 1.55; max-width: 36ch; margin: 0 0 26px; text-align: left; }
  .scene-mobile .hero-lead-full { display: inline; }
  .scene-mobile .hero-lead-mobile, .scene-mobile .mobile-scroll-cue { display: none; }
  .scene-mobile .cta { flex-direction: column; align-items: stretch; gap: 10px; }
  .scene-mobile .cta .btn, .scene-mobile .cta .btn-ghost-dark { display: flex; width: 100%; justify-content: space-between; min-height: 54px; padding: 15px 20px; font-size: 15px; }
  .scene-mobile :is(.surface-node, .attack-connections, .scene-console) { display: none; }
  .scene-mobile .graph-labels, .scene-mobile .dive-tether { display: block; }
  .scene-mobile .graph-labels > span { font-size: 11px; }
  .scene-mobile .graph-labels > span::after { font-size: 9px; }
  .scene-mobile .dive-copy { top: 4%; }
  .scene-mobile .dive-copy .kicker { display: block; margin-bottom: 12px; }
  .scene-mobile .dive-copy h2, :lang(bg) .scene-mobile .dive-copy h2 { font-size: clamp(30px,8.6vw,40px); line-height: 1.04; letter-spacing: -.045em; }
  :lang(bg) .scene-mobile .dive-copy h2 { font-size: clamp(26px,7.2vw,34px); }
  .scene-mobile .dive-copy > p:last-child { font-size: 14px; color: #a5a8b1; }
  .scene-mobile .dive-finding { bottom: 46px; }
  .scene-mobile .dive-scope { display: block; font-size: 11px; margin-bottom: 8px; }
  .scene-mobile .surface-scene figcaption { bottom: 4px; min-height: 0; font-size: 9px; opacity: .7; }
}
@media (max-width: 980px) and (min-height: 620px) and (max-height: 740px) {
  .scene-mobile h1, :lang(bg) .scene-mobile h1 { font-size: clamp(36px,10.4vw,48px); margin-bottom: 14px; }
  .scene-mobile .hero-intro .lead { font-size: 14px; margin-bottom: 18px; }
  .scene-mobile .cta .btn { min-height: 48px; padding-block: 12px; }
  .scene-mobile .dive-scope { display: none; }
}

/* Mobile menu: a full-screen sheet. Four large rows open in place (services, resources, company),
   the proposal button stays pinned at the bottom. main.js sets html.menu-open, the accordion state
   and the extra links; without JavaScript the menu never opens on phones, as before. */
@media (max-width: 900px) {
  html.menu-open { overflow: hidden; }
  /* The header's blur would make it the containing block for the fixed sheet, so drop it while open. */
  html.menu-open header.site { backdrop-filter: none; -webkit-backdrop-filter: none; background: #0b0c0e; transform: none; }
  header.site nav.menu.open { position: fixed; inset: 72px 0 0; display: block; max-height: none; height: calc(100dvh - 72px);
    padding: 6px 22px calc(150px + env(safe-area-inset-bottom)); background: #0b0c0e; border: 0; border-top: 1px solid #ffffff12;
    box-shadow: none; overflow-y: auto; overscroll-behavior: contain; animation: menu-sheet .45s var(--ease) both; }
  @keyframes menu-sheet { from { opacity: 0; clip-path: inset(0 0 100% 0); } to { opacity: 1; clip-path: inset(0); } }
  header.site nav.menu.open > * { animation: menu-row .55s var(--ease) both; }
  header.site nav.menu.open > :nth-child(2) { animation-delay: .04s; }
  header.site nav.menu.open > :nth-child(3) { animation-delay: .08s; }
  header.site nav.menu.open > :nth-child(4) { animation-delay: .12s; }
  header.site nav.menu.open > :nth-child(n+5) { animation-delay: .16s; }
  @keyframes menu-row { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
  /* Rows */
  header.site nav.menu.open > a:not(.btn):not(.menu-extra), header.site nav.menu.open .has-dd > a {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 2px; border-bottom: 1px solid #ffffff14;
    color: #f3f3f1; font: 500 25px/1.1 Manrope, sans-serif; letter-spacing: -.025em; text-decoration: none; -webkit-tap-highlight-color: transparent; }
  header.site nav.menu.open > a:not(.btn):not(.menu-extra)::after, header.site nav.menu.open .has-dd > a::after {
    content: ''; display: block; flex: 0 0 auto; width: 9px; height: 9px; margin: 0 6px 0 0; border: solid #8d9099; border-width: 0 1.6px 1.6px 0;
    transform: rotate(-45deg); transition: transform .35s var(--ease), border-color .25s; }
  header.site nav.menu.open .has-dd > a::after { transform: translateY(-3px) rotate(45deg); }
  header.site nav.menu.open .has-dd.is-expanded > a { color: #fff; border-bottom-color: transparent; }
  header.site nav.menu.open .has-dd.is-expanded > a::after { transform: translateY(2px) rotate(-135deg); border-color: #ff8a3d; }
  header.site nav.menu.open a[aria-current]:not(.btn) { color: #ffae7c; }
  /* Panels open in place: the second grid row grows from 0fr to 1fr. */
  header.site nav.menu.open .has-dd { display: grid; grid-template-rows: auto 0fr; transition: grid-template-rows .45s var(--ease); }
  header.site nav.menu.open .has-dd.is-expanded { grid-template-rows: auto 1fr; border-bottom: 1px solid #ffffff14; }
  header.site nav.menu.open .has-dd > .dd { min-height: 0; overflow: hidden; padding: 0; background: none; opacity: 0; visibility: hidden;
    transition: opacity .3s ease, visibility 0s linear .45s; }
  header.site nav.menu.open .has-dd.is-expanded > .dd { opacity: 1; visibility: visible; transition: opacity .4s ease .08s, visibility 0s; }
  header.site nav.menu.open .dd > :last-child, header.site nav.menu.open .dd-simple { padding-bottom: 18px; }
  header.site nav.menu.open .dd-grid { display: block; }
  header.site nav.menu.open .dd-col h3, header.site nav.menu.open .dd-req h3 { margin: 18px 0 6px; padding: 0; color: #7f838c; font: 600 11px/1 ui-monospace,"SF Mono",Menlo,monospace; letter-spacing: .1em; }
  header.site nav.menu.open .dd-col:first-child h3 { margin-top: 2px; }
  header.site nav.menu.open .dd-col a { display: grid; grid-template-columns: 22px 1fr; gap: 14px; align-items: center; padding: 10px 0; border-radius: 0; color: #d9dade; }
  header.site nav.menu.open .dd-col a b { color: inherit; font: 500 16px/1.3 var(--body); }
  header.site nav.menu.open .dd-col .ico { width: 20px; height: 20px; stroke: #ff8a3d; }
  header.site nav.menu.open .dd-req { margin: 0; padding: 0; border: 0; }
  header.site nav.menu.open .dd-req > div { gap: 8px; }
  header.site nav.menu.open .dd .dd-req a { padding: 8px 13px; font-size: 14px; color: #e3e4e8; border-color: #ffffff2a; }
  header.site nav.menu.open .dd a.dd-all { display: flex; margin: 0; padding: 12px 0 2px; border: 0; color: #ffae7c; font-size: 15px; font-weight: 500; }
  header.site nav.menu.open .dd a.dd-all + a.dd-all { padding-top: 6px; }
  header.site nav.menu.open .dd-simple a { padding: 11px 0; border-radius: 0; color: #d9dade; font: 500 16px/1.35 var(--body); }
  header.site nav.menu.open .dd a:hover, header.site nav.menu.open .dd a:active { background: none; color: #fff; }
  /* Pinned actions, over a fade so the last rows scroll out of sight beneath them. */
  header.site nav.menu.open > .btn, header.site nav.menu.open > .menu-extra { position: fixed; left: 22px; right: 22px; z-index: 2; }
  header.site nav.menu.open > .btn { bottom: calc(58px + env(safe-area-inset-bottom)); display: flex; justify-content: center; align-items: center;
    min-height: 54px; margin: 0; font-size: 16px; animation: menu-cta .6s var(--ease) .2s both; }
  header.site nav.menu.open > .menu-extra { bottom: calc(18px + env(safe-area-inset-bottom)); display: flex; justify-content: center; gap: 8px;
    padding: 10px 0; border: 0; color: #b9bcc4; font-size: 14px; text-decoration: none; animation: menu-cta .6s var(--ease) .26s both; }
  header.site nav.menu.open > .menu-extra span { color: #ffae7c; }
  header.site nav.menu.open::after { content: ''; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1; height: calc(160px + env(safe-area-inset-bottom));
    background: linear-gradient(#0b0c0e00, #0b0c0e 38%); pointer-events: none; }
  @keyframes menu-cta { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
  .navtoggle svg { transition: transform .45s var(--ease); }
  html.menu-open .navtoggle svg { transform: rotate(90deg); }
}
@media (min-width: 901px) { nav.menu > .menu-extra, nav.menu > .menu-lang, nav.menu .menu-only { display: none; } }
/* Language: on phones it lives in the menu sheet, under the rows, not in the header bar. */
@media (max-width: 900px) {
  header.site .bar > .langsw { display: none; }
  header.site .navtoggle { margin-left: auto; margin-right: -9px; }
  nav.menu > .menu-lang { display: none; }
  header.site nav.menu.open > .menu-lang { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
  header.site nav.menu.open > .menu-lang p { flex: 0 0 100%; margin: 0 0 4px; color: #7f838c; font: 600 11px/1 ui-monospace,"SF Mono",Menlo,monospace; letter-spacing: .1em; text-transform: uppercase; }
  header.site nav.menu.open > .menu-lang a { display: inline-flex; align-items: center; gap: 10px; padding: 11px 16px; border: 1px solid #ffffff24; border-radius: 999px;
    color: #c9cbd1; font: 500 15px/1 var(--body); text-decoration: none; }
  header.site nav.menu.open > .menu-lang a.on { border-color: #ff8a3d; color: #fff; background: #ff8a3d14; }
  header.site nav.menu.open > .menu-lang .flag { width: 20px; height: 14px; border-radius: 2px; box-shadow: 0 0 0 1px #ffffff26; }
}
@media (max-width: 900px) and (prefers-reduced-motion: reduce) {
  header.site nav.menu.open, header.site nav.menu.open > *, header.site nav.menu.open .has-dd { animation: none; transition: none; }
}

/* Phones and tablets: the same scroll-led sections as wide screens. Pinned blocks sit below the
   header while it shows and move up when it hides on the way down. */
@media (max-width: 980px) {
  html { --stick: 12px; }
  html:has(header.site:not(.nav-hidden)) { --stick: 84px; }
  /* Engagement: the console pins above the stages and shows the current stage's log lines. */
  .eng-live-mode .eng-layout { display: flex; flex-direction: column; align-items: stretch; gap: 18px; }
  .eng-live-mode .eng-console { order: -1; position: sticky; top: var(--stick); z-index: 3; transition: top .45s var(--ease); box-shadow: 0 24px 60px rgba(0,0,0,.6); }
  .eng-live-mode .eng-bar { padding: 11px 14px; min-width: 0; }
  .eng-live-mode .eng-bar span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; }
  .eng-live-mode .eng-tabs { flex-wrap: nowrap; justify-content: space-between; gap: 6px; padding: 10px 14px; font-size: 12.5px; }
  .eng-live-mode .eng-body { padding: 12px 14px 8px; }
  .eng-live-mode .eng-live { margin-bottom: 6px; }
  .eng-live-mode .eng-log li { display: none; }
  .eng-live-mode .eng-log li.is-current { display: flex; color: #f4f4f1; animation: eng-line .5s var(--ease) both; }
  .eng-live-mode .eng-log li.is-current:nth-child(3n+2) { animation-delay: .12s; }
  .eng-live-mode .eng-log li.is-current:nth-child(3n) { animation-delay: .24s; }
  .eng-live-mode .eng-log li.is-current .eng-tag { color: #ff9354; }
  .eng-live-mode[data-active="4"] .eng-log li.is-current .eng-tag { color: #9fc2b2; }
  .eng-live-mode .eng-foot { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .eng-live-mode .eng-foot div { padding: 9px 12px 10px 14px; border-top: 0; border-left: 1px solid rgba(255,255,255,.08); }
  .eng-live-mode .eng-foot div:first-child { border-left: 0; }
  .eng-live-mode .eng-foot small { margin-bottom: 5px; font-size: 9px; }
  .eng-live-mode .eng-foot b { font-size: 12.5px; }
  .eng-live-mode .eng-console figcaption { display: none; }
  .eng-live-mode .eng-stage { min-height: 44vh; align-content: start; opacity: .3; }
  .eng-live-mode .eng-stage.is-active { opacity: 1; }
  .eng-live-mode .eng-stage.is-done { opacity: .55; }
}
@keyframes eng-line { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Anatomy on phones: the four findings as a row of tabs over one pinned panel, which shows one
   step at a time (evidence, fix, retest) while scrolling writes it. visual.js wraps tabs and panel. */
@media (max-width: 980px) {
  .anat.is-compact { display: flex; flex-direction: column; }
  .anat.is-compact .anat-note { margin-top: auto; }
  .anat.is-compact .anat-stage { position: sticky; top: var(--stick); transition: top .45s var(--ease); }
  .anat.is-compact .anat-picker { position: static; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; margin-bottom: 10px; }
  .anat.is-compact .anat-tab { grid-template-columns: 1fr; gap: 0; padding: 9px 8px 11px; border-radius: 8px; }
  .anat.is-compact .anat-tab .fsev, .anat.is-compact .anat-tab small { display: none; }
  .anat.is-compact .anat-tab b { font-size: 12.5px; line-height: 1.25; }
  .anat.is-compact .anat-panel { border-radius: 10px; box-shadow: 0 20px 50px #20272118; }
  .anat.is-compact .window-bar { display: none; }
  .anat.is-compact .anat-head { padding: 14px 16px 12px; }
  .anat.is-compact .anat-head .fsev { margin-bottom: 6px; }
  .anat.is-compact .anat-head h3 { margin: 0 0 8px; font-size: 19px; }
  .anat.is-compact .anat-head dl { grid-template-columns: 1fr; gap: 0; font-size: 13px; line-height: 1.45; }
  .anat.is-compact .anat-head dt { display: none; }
  .anat.is-compact .anat-head dd:first-of-type { display: none; }
  .anat.is-compact .anat-steps { padding: 0 16px 14px; }
  .anat.is-compact .anat-step { display: none; padding: 12px 0 0; border-top: 0; gap: 8px; }
  .anat.is-compact .anat-step.is-current { display: grid; animation: anat-enter .4s var(--ease) both; }
  .anat.is-compact .anat-label { display: flex; align-items: baseline; gap: 8px; }
  .anat.is-compact .anat-label span { margin: 0; }
  .anat.is-compact .anat-label b { margin: 0; font-size: 15px; }
  .anat.is-compact .anat-label p { display: none; }
  .anat.is-compact .anat-code { padding: 10px 12px; font-size: 11.5px; line-height: 1.5; }
  .anat.is-compact .anat-closed { margin-top: 10px; }
}

/* Grid and flex items default to min-width:auto, so one long token (a CVE path, a Bulgarian compound,
   a tag row) widened the whole column past a phone screen, and html's overflow clip cut the text off. */
.adv-main, .c2-main, .tg-head, .post-card, .eng-console, .eng-bar > * { min-width: 0; }
.adv-main :is(p, li, h2, h3, td) code, .c2-main :is(p, li) code { overflow-wrap: anywhere; }
.adv-main :is(p, li, h2, h3), .c2-main :is(p, li, h2, h3), .tg-head :is(h2, p), .post-card :is(h2, p) { overflow-wrap: break-word; }
.post-card .pc-tags { flex-wrap: wrap; }
@media (max-width: 980px) {
  .eng-live-mode .eng-tabs { flex-wrap: wrap; justify-content: flex-start; gap: 4px 14px; }
}
@media (max-width: 760px) { .tech-group { grid-template-columns: minmax(0,1fr); } }
.tech-pills li { max-width: 100%; white-space: normal; line-height: 1.25; }