/* Hallmark · v2.0.0 · custom: "דוח עם הערות באדום" (a report marked up in red pen) · genre: editorial-technical · redesign: restyle · copy: verbatim · hero: Settled copy on the start side, a working scene on the end side (terminal, report page, network map, config review per service) · signature: the pentest report sheet, its finding circled in red and stamped after the retest · nav: wordmark, links, one ink action (kept from live) · footer: kept from live · surface: warm report paper · posture: restrained, ink and petrol, red pen only on findings */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V4 · weakest: H, the inner heroes keep long copy; the scene carries the first screen beside it */
/* Hallmark · waive 47c · scenes are markup and SVG drawings, never screenshots · a terminal transcript, report pages and network maps are the service's own deliverables, each marked as an example */
/* Hallmark · waive 49b · the wrapping links sit inside running Hebrew sentences · links like בדיקת חדירה חיצונית wrap with the sentence around them */
/* Hallmark · waive 59 · retainer-plans keeps the live section rhythm · restyle depth keeps the layout */

@font-face{font-family:"Frank Ruhl Libre";src:url(../fonts/frank-ruhl-var.woff2) format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:"Plex Hebrew";src:url(../fonts/plex-heb-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Hebrew";src:url(../fonts/plex-heb-SemiBold.woff2) format("woff2");font-weight:500 600;font-display:swap}
@font-face{font-family:"Plex Hebrew";src:url(../fonts/plex-heb-Bold.woff2) format("woff2");font-weight:700 800;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(../fonts/plex-mono-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(../fonts/plex-mono-Medium.woff2) format("woff2");font-weight:500 700;font-display:swap}

:root{
  --paper:#F2EFE7; --paper-2:#EAE6DB; --sheet:#FBFAF5; --wash:#E4DFD2;
  --ink:#17191E; --ink-2:#3D424B; --ink-3:#5C626C; --on-ink:#F6F3EA;
  --rule:#D5CFC1; --rule-2:#B9B2A2; --edge:#857E70;
  --petrol:#0D5960; --petrol-2:#0A464C; --petrol-wash:#DCE7E4;
  --red:#AE2B21; --red-wash:#F3DDD6; --green:#2B6548; --green-wash:#DCE9DF; --amber:#8A5A12;
  --term:#16191D; --term-2:#22262C; --term-ink:#DAD6CB; --term-dim:#8F8C84; --term-cy:#86C3BE; --term-red:#E9897C; --term-green:#9CCBA9;
  --serif:"Frank Ruhl Libre","David Libre",Georgia,serif;
  --sans:"Plex Hebrew","Assistant",system-ui,Arial,sans-serif;
  --mono:"Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --maxw:1180px; --measure:66ch; --r:3px;
  /* names the live pages' inline styles still read */
  --text:var(--ink); --text-1:var(--ink); --text-2:var(--ink-2); --text-3:var(--ink-3);
  --accent:var(--petrol); --accent-2:var(--petrol-2); --line:var(--rule); --panel:var(--sheet); --bg:var(--paper); --bg-2:var(--paper-2);
  --ease:cubic-bezier(.2,.7,.2,1);
  --shadow:rgba(23,25,30,.16); --shadow-2:rgba(23,25,30,.08); --amber-wash:#F1E6CF;
}

/* ── base ─────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{overflow-x:clip;margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
[hidden],.hidden{display:none !important}
h1,h2,h3,h4{color:var(--ink);overflow-wrap:break-word;min-width:0}
h1{font-family:var(--serif);font-weight:700;letter-spacing:-.01em;line-height:1.12}
h2{font-family:var(--serif);font-weight:700;line-height:1.2}
h3{font-family:var(--sans);font-weight:700;line-height:1.35}
a{color:var(--petrol);text-decoration:none;transition:color .15s var(--ease),background-color .15s var(--ease),border-color .15s var(--ease)}
a:hover{color:var(--petrol-2)}
main p a,main li a,main td a,.devlink a,.faq-item a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--petrol);outline-offset:3px;transition:none}
::selection{background:var(--red-wash);color:var(--ink)}
strong,b{font-weight:700;color:var(--ink)}
code{font-family:var(--mono);font-size:.9em}
bdi[dir="ltr"],[dir="ltr"]{unicode-bidi:isolate}
.mono,.en{font-family:var(--mono);font-variant-ligatures:none;unicode-bidi:isolate}
.skip-link{position:absolute;top:-60px;right:0;background:var(--ink);color:var(--on-ink);padding:.6rem 1rem;font-weight:700;z-index:300}
.skip-link:focus{top:0;color:var(--on-ink)}
section[id]{scroll-margin-top:84px}

/* containers */
.wrap,.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(1.1rem,4.5vw,2rem)}

/* ── utilities the live markup uses ───────────────── */
.font-sans{font-family:var(--sans)} .antialiased{-webkit-font-smoothing:antialiased}
.block{display:block}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.flex{display:flex}.grid{display:grid}
.flex-1{flex:1 1 0%;min-width:0}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}
.items-start{align-items:flex-start}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}
.relative{position:relative}.sticky{position:sticky}.top-0{top:0}.z-50{z-index:50}.overflow-hidden{overflow:hidden}.cursor-pointer{cursor:pointer}
.w-full{width:100%}.w-6{width:1.5rem}.h-6{height:1.5rem}
.max-w-xl{max-width:36rem}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.mx-auto{margin-inline:auto}
.mr-6{margin-right:1.5rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-12{margin-top:3rem}.mt-24{margin-top:0}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}
.p-2{padding:.5rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:clamp(1.25rem,3vw,2rem)}.p-12{padding:clamp(1.5rem,4vw,3rem)}
.px-4{padding-inline:1rem}.px-8{padding-inline:2rem}.py-2{padding-block:.5rem}.py-3{padding-block:.75rem}.py-4{padding-block:1rem}.py-10{padding-block:2.5rem}.py-20{padding-block:clamp(3.25rem,7vw,5.25rem)}
.pt-8{padding-top:2rem}.pt-20{padding-top:clamp(2.5rem,6vw,4.5rem)}.pb-4{padding-bottom:1rem}.pb-6{padding-bottom:1.5rem}.pb-24{padding-bottom:clamp(2.75rem,6vw,4.75rem)}
.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-x-4{column-gap:1rem}.gap-y-2{row-gap:.5rem}
.space-y-1>:not([hidden])~:not([hidden]){margin-top:.25rem}.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}.space-y-4>:not([hidden])~:not([hidden]){margin-top:1rem}.space-y-6>:not([hidden])~:not([hidden]){margin-top:1.5rem}
.space-x-4{gap:1rem}.space-x-6{gap:1.5rem}
.rounded,.rounded-lg{border-radius:var(--r)}
.border{border:1px solid var(--rule)}.border-t{border-top:1px solid var(--rule)}.border-b{border-bottom:1px solid var(--rule)}
.text-right{text-align:right}.text-center{text-align:center}
.text-xs{font-size:.875rem;line-height:1.6}.text-sm{font-size:.9375rem;line-height:1.7}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem;line-height:1.5}.text-2xl{font-size:1.5rem;line-height:1.4}.text-5xl{font-size:clamp(2.1rem,5vw,3.25rem)}
.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:700}
.leading-tight{line-height:1.15}.leading-relaxed{line-height:1.7}.tracking-tight{letter-spacing:0}
.text-white{color:var(--ink)}.text-brand{color:var(--petrol)}.text-slate-300{color:var(--ink-2)}.text-slate-400{color:var(--ink-3)}.text-emerald-400{color:var(--green)}.text-purple-400{color:var(--ink-2)}
.bg-brand{background:var(--ink);color:var(--on-ink)}
.hover\:text-white:hover{color:var(--ink)}.hover\:text-brand-600:hover{color:var(--petrol-2)}.hover\:bg-brand-600:hover{background:var(--petrol);color:var(--on-ink)}
.transition{transition:color .15s var(--ease),background-color .15s var(--ease),border-color .15s var(--ease)}
.transition-all{transition:color .15s var(--ease),background-color .15s var(--ease),border-color .15s var(--ease)}
.focus\:outline-none:focus{outline:none}
@media (min-width:768px){
  [class~="md:flex"]{display:flex !important}[class~="md:hidden"]{display:none !important}[class~="md:inline-block"]{display:inline-block !important}
  [class~="md:flex-row"]{flex-direction:row}[class~="md:items-center"]{align-items:center}[class~="md:text-right"]{text-align:right}
  [class~="md:text-2xl"]{font-size:1.3rem;line-height:1.5}[class~="md:text-6xl"]{font-size:clamp(2.4rem,4.6vw,3.35rem)}
  [class~="md:grid-cols-2"]{grid-template-columns:repeat(2,minmax(0,1fr))}[class~="md:grid-cols-3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
  [class~="md:grid-cols-4"]{grid-template-columns:repeat(4,minmax(0,1fr))}[class~="md:grid-cols-5"]{grid-template-columns:repeat(5,minmax(0,1fr))}
}
/* undo the dark template's colour chips */
[class*="bg-emerald-500"],[class*="bg-purple-500"],[class*="bg-brand/10"],[class*="bg-white/5"]{background:transparent}
[class*="border-emerald-500"],[class*="border-purple-500"],[class*="border-brand/30"]{border-color:var(--rule-2)}

/* ── header (three live variants) ─────────────────── */
body>header,header.site-head{position:sticky;top:0;z-index:100;background:var(--paper);border-bottom:1px solid var(--ink);box-shadow:0 1px 0 var(--paper)}
body>header .wrap,body>header .container,.site-head>.container{padding-block:0}
body>header .wrap>.flex,body>header>.wrap[style],.site-head>.container,header .inner{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;min-height:64px}
body>header>.wrap[style]{padding-block:0 !important}
.v2-brand,.brand,header .logo{font-family:var(--serif);font-weight:700;font-size:1.35rem;color:var(--ink);letter-spacing:0;display:inline-flex;gap:.35rem;align-items:baseline;white-space:nowrap}
.v2-brand span,.brand b,.brand span,header .logo .brand{color:var(--ink)}
.v2-brand span+span,.brand span,header .logo .brand{font-family:var(--sans);font-weight:600;font-size:.95rem;color:var(--ink-2)}
body>header nav a,.nav a,header nav a{color:var(--ink-2);font-size:.95rem;font-weight:500;padding-block:.35rem;border-bottom:1px solid transparent}
body>header nav a:hover,.nav a:hover{color:var(--ink);border-bottom-color:var(--ink)}
.nav,header .inner>nav{display:flex;gap:1.6rem;align-items:center}
body>header nav[aria-label="תפריט ראשי"]{gap:1.6rem}
#mobile-menu{border-top:1px solid var(--rule);padding-block:.5rem 1rem}
#mobile-menu a{display:block;color:var(--ink);padding:.7rem 0;border-bottom:1px solid var(--rule);font-weight:500}
#mobile-menu a:last-child{border-bottom:0}
#mobile-menu a.bg-brand{background:var(--ink);color:var(--on-ink);text-align:center;border-radius:var(--r);margin-top:.75rem;border:0}
.site-head #mobile-menu{display:none}.site-head #mobile-menu.open{display:block}
.mobile-nav{display:none}.mobile-nav.is-open{display:block}
.burger,.mobile-toggle,#mobile-menu-button{color:var(--ink);display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border:1px solid var(--rule-2);border-radius:var(--r)}
.burger{display:none}.mobile-toggle{display:none}
@media (min-width:768px){body>header #mobile-menu-button{display:none !important}}
@media (max-width:860px){.nav{display:none}.burger{display:inline-flex}.site-head .hdr-cta{display:none}}
@media (max-width:767px){header .inner>nav,header .inner>.cta{display:none}.mobile-toggle{display:inline-flex}}

/* ── buttons ─────────────────────────────────────── */
.btn,.btn-primary,.btn-secondary,header .cta,.pricing-card .cta,.submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.9rem;padding:.7rem 1.3rem;border-radius:var(--r);font-weight:700;font-size:.975rem;line-height:1.3;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:background-color .15s var(--ease),color .15s var(--ease),border-color .15s var(--ease),transform .12s var(--ease)}
.btn-primary,.btn--solid,header .cta,.pricing-card .cta,.submit-btn,a.bg-brand{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.btn-primary:hover,.btn--solid:hover,header .cta:hover,.pricing-card .cta:hover,.submit-btn:hover,a.bg-brand:hover{background:var(--petrol);border-color:var(--petrol);color:var(--on-ink)}
.btn-ghost,.btn--line,.btn-secondary{background:transparent;color:var(--ink);border-color:var(--edge)}
.btn-ghost:hover,.btn--line:hover,.btn-secondary:hover{border-color:var(--ink);color:var(--ink);background:var(--sheet)}
.btn:active,.submit-btn:active{transform:translateY(1px)}
.btn-sm,.hdr-cta{min-height:2.5rem;padding:.45rem 1rem;font-size:.9rem}
body>header .btn{min-height:2.5rem;padding:.45rem 1rem !important;font-size:.9rem !important}
.submit-btn{width:100%;font-size:1.02rem;min-height:3.1rem}
a.bg-brand{display:inline-flex}

/* ── sections ────────────────────────────────────── */
.sec{padding-block:clamp(3.25rem,7vw,5.25rem);border-top:1px solid var(--rule)}
.sec-alt,.sec--fill{background:var(--paper-2)}
main>section.wrap,main>section[class*="py-20"]{border-top:1px solid var(--rule)}
main>section[class*="border-t"]{border-top-color:var(--rule)}
main>section:not(.hero):not(.v2-hero),main>article{position:relative}
.sec-head{margin-bottom:2.25rem;max-width:66ch;display:block}
.sec-head>div{min-width:0}
.h2,.sec-title,main h2{font-family:var(--serif);font-size:clamp(1.85rem,3.5vw,3rem);font-weight:700;line-height:1.2;color:var(--ink);margin-bottom:.8rem;letter-spacing:0;text-align:right}
.lead,.sec-lead,.subtitle-text,h2.sec-title+p{color:var(--ink-2);font-size:1.0625rem;line-height:1.8;max-width:var(--measure);text-align:right}
h2.sec-title+p{margin-bottom:2rem}
.sec .text-center,.wrap>.text-center,h2.sec-title+p.text-center{text-align:right}
h2.sec-title+p.mx-auto{margin-inline:0}
.devlink{margin-top:1.4rem;color:var(--ink-2);font-size:1rem;max-width:var(--measure)}
.note{color:var(--ink-2);font-size:.975rem;line-height:1.75}

/* ── home hero ───────────────────────────────────── */
.hero{position:relative;border-bottom:1px solid var(--rule);background:var(--paper)}
.hero h1{font-size:clamp(2.3rem,5.2vw,3.6rem);color:var(--ink)}
.hero-sub{color:var(--ink);font-size:clamp(1.1rem,1.9vw,1.3rem);font-weight:500;margin-top:1rem;line-height:1.55;max-width:44ch}
.hero-benefits{color:var(--ink-2);font-size:1rem;font-weight:600;margin-top:1rem;line-height:1.65;padding-right:.85rem;border-right:2px solid var(--red)}
.hero-lead{color:var(--ink-2);margin-top:.9rem;max-width:52ch}
.hero-cta,.buttons{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.6rem}
.hero-note{color:var(--ink-3);font-size:.95rem;margin-top:.9rem}
.trust{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin-top:1.5rem;color:var(--ink-2);font-size:.95rem}
.trust span{display:inline-flex;gap:.35rem;align-items:baseline;padding-top:.6rem;border-top:1px solid var(--rule-2)}
.trust span b{font-weight:700}
.hero .container{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.75rem,4.5vw,4rem);align-items:center;padding-block:clamp(2.5rem,6vw,4.75rem)}
.hero-visual{min-width:0}
@media (max-width:900px){.hero .container{grid-template-columns:minmax(0,1fr)}}
/* retainer hero */
.hero .content{max-width:46rem;min-width:0}
.hero .subtitle{margin-top:1rem;color:var(--ink-2);font-size:clamp(1.05rem,1.9vw,1.2rem);max-width:54ch}
.badge{display:inline-block;color:var(--ink-2);font-weight:600;font-size:.95rem;margin-bottom:.75rem}

/* generic inner hero split */
.v2-split{display:grid !important;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(1.75rem,4.5vw,3.75rem);align-items:center}
.v2-split>*{min-width:0}
@media (max-width:900px){.v2-split{grid-template-columns:minmax(0,1fr)}}
main>section:first-child h1,main>article h1,.v2-hero h1{color:var(--ink) !important;font-family:var(--serif) !important;font-weight:700 !important;letter-spacing:-.01em !important}
main>section:first-child .text-5xl{font-size:clamp(2.2rem,4.8vw,3.3rem)}

/* ── cards, records, situations ─────────────────── */
.grid{gap:1.1rem}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3,.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.g3,.g4,.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.g2,.g3,.g4,.grid-3{grid-template-columns:minmax(0,1fr)}}
.card,.rec,.pricing-card,.contact-card{background:var(--sheet);border:1px solid var(--rule);border-radius:var(--r);min-width:0}
.card,.pricing-card{padding:1.5rem 1.35rem;display:flex;flex-direction:column;gap:.5rem}
.card h3,.pricing-card h3{font-size:1.15rem;color:var(--ink)}
.card p,.pricing-card .desc{color:var(--ink-2);font-size:.975rem;line-height:1.7}
.card .card-note{color:var(--ink-3);font-size:.925rem;padding-top:.5rem;border-top:1px dashed var(--rule-2)}
.card .more{margin-top:auto;padding-top:.6rem;color:var(--petrol);font-weight:700;font-size:.95rem}
a.card{color:var(--ink);text-decoration:none;transition:border-color .15s var(--ease),transform .15s var(--ease),background-color .15s var(--ease)}
a.card:hover{border-color:var(--ink);transform:translateY(-2px)}
a.card:hover .more{color:var(--ink);text-decoration:underline;text-underline-offset:.22em}
.card-ic{width:2.25rem;height:2.25rem;color:var(--ink);display:block;margin-bottom:.25rem}
.card-ic svg{width:2.25rem;height:2.25rem;stroke-width:1.4}
.sit-card{border-top:3px solid var(--ink)}
.pricing-card ul{padding-right:1.1rem;margin-block:.75rem 1.25rem;color:var(--ink-2)}
.pricing-card li{margin-bottom:.45rem}
.pricing-card li::marker{color:var(--red)}
.pricing-card .cta{margin-top:auto;align-self:flex-start}
.contact-card{display:block;padding:1.1rem 1.2rem;color:var(--ink);text-decoration:none}
.contact-card:hover{border-color:var(--ink)}
.contact-card .label{color:var(--ink-3);font-size:.9rem}
.contact-card .value{margin-top:.2rem;color:var(--ink);font-weight:700}
#contact .grid:has(.contact-card){grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:640px){#contact .grid:has(.contact-card){grid-template-columns:minmax(0,1fr)}}

.rec{transition:border-color .15s var(--ease)}
.rec.p-8,.rec.p-6{padding:clamp(1.25rem,3vw,1.75rem)}
.rec__bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.55rem 1.15rem;border-bottom:1px solid var(--rule);background:var(--paper-2)}
.rec .rec__bar:first-child{border-radius:var(--r) var(--r) 0 0}
.rec__id{font-family:var(--mono);font-size:.875rem;color:var(--ink-2);font-weight:500;direction:ltr;unicode-bidi:isolate}
.rec__body{padding:1.25rem 1.15rem 1.15rem}
.rec__title,.rec h3{font-size:1.15rem;color:var(--ink);margin-bottom:.4rem}
.rec__desc,.rec p{color:var(--ink-2);font-size:.975rem;line-height:1.75}
.rec__desc{margin-bottom:.9rem}
.rec__note{font-size:.925rem;color:var(--ink-3);margin-top:.9rem;padding-top:.75rem;border-top:1px dashed var(--rule-2)}
.rec__foot{margin-top:1rem}.rec__foot a{font-weight:700}
.rec ul{padding-right:0;list-style:none}
.rec ul li,.ticks li{position:relative;padding-right:1.35rem;color:var(--ink-2);margin-bottom:.4rem}
.rec ul li::before,.ticks li::before{content:"";position:absolute;right:.1rem;top:.72em;width:.6rem;height:.32rem;border-right:0;border-bottom:1.6px solid var(--petrol);border-left:1.6px solid var(--petrol);transform:rotate(-45deg) translateY(-60%)}
.ticks{list-style:none;padding:0;margin:0}
.rec .text-center{text-align:right}
main section:first-child .rec.px-4{padding:.35rem .8rem;background:transparent;border-color:var(--rule-2)}
main section:first-child .rec.px-4 span{color:var(--ink-2)}
main section:first-child .inline-flex.rounded,main section:first-child .inline-flex[class*="rounded"]{background:transparent;border:1px solid var(--rule-2);padding:.35rem .75rem;border-radius:var(--r)}
main section:first-child .inline-flex[class*="rounded"] span{color:var(--ink-2);font-weight:600}
.premium-badge,.tag{display:inline-block;font-size:.875rem;padding:.2rem .6rem;border:1px solid var(--rule-2);border-radius:var(--r);color:var(--ink-2);font-family:var(--sans)}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}
.feature-check{color:var(--petrol);margin-left:.4rem}

/* features (home value) */
.feat{display:flex;gap:.9rem;align-items:flex-start;padding-top:1.1rem;border-top:2px solid var(--ink)}
.feat .fi{flex:0 0 auto;width:2rem;height:2rem;color:var(--red)}
.feat .fi svg{width:2rem;height:2rem;stroke-width:1.5}
.feat h3{font-size:1.1rem;margin-bottom:.2rem}
.feat p{color:var(--ink-2);font-size:.975rem;line-height:1.65}

/* team */
.lead-card{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:1.5rem;background:var(--sheet);border:1px solid var(--rule);border-radius:var(--r);padding:clamp(1.25rem,3vw,2rem)}
.lead-card h3{font-family:var(--serif);font-size:1.7rem;margin:0 0 .2rem}
.lead-card .role{color:var(--ink-2);font-weight:600;margin-bottom:.75rem}
.lead-card p{color:var(--ink-2);line-height:1.75}
.lead-card .team-certifications{margin-top:.75rem;color:var(--ink);font-weight:600}
.lead-card .en{font-family:var(--sans) !important}
.spec{border-right:1px solid var(--rule);padding-right:1.3rem;display:flex;flex-direction:column;justify-content:center;gap:.9rem}
.spec div{display:flex;flex-direction:column}
.spec dt{color:var(--ink-3);font-size:.9rem}
.spec dd{margin:0;color:var(--ink);font-weight:700;font-size:1.05rem}
@media (max-width:720px){.lead-card{grid-template-columns:minmax(0,1fr)}.spec{border-right:0;border-top:1px solid var(--rule);padding-right:0;padding-top:1.1rem}}
.team{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:1.1rem}
.who{background:var(--sheet);border:1px solid var(--rule);border-radius:var(--r);padding:1.6rem 1.4rem;display:flex;flex-direction:column}
.who__role{color:var(--ink-3);font-size:.925rem;font-weight:600;padding-bottom:.6rem;margin-bottom:.9rem;border-bottom:1px solid var(--rule)}
.who h3{font-family:var(--serif);font-size:1.55rem;margin-bottom:.2rem}
.who .title{display:block;color:var(--ink-2);font-weight:600;font-size:.975rem;margin-bottom:.9rem}
.who .bio{color:var(--ink-2);line-height:1.8;margin-bottom:1rem}

/* fields (dl) */
.fields{border-top:1px solid var(--ink)}
.fields div{display:grid;grid-template-columns:8rem minmax(0,1fr);gap:.75rem;padding-block:.6rem;border-bottom:1px solid var(--rule);align-items:baseline}
.fields dt,.fields .k{color:var(--ink-3);font-size:.925rem;font-weight:600;font-family:var(--sans)}
.fields dd,.fields .v{margin:0;color:var(--ink-2);font-size:.975rem;line-height:1.65}
.fields .v.ltr{font-family:var(--mono);direction:ltr;font-size:.9rem}
@media (max-width:560px){.fields div{grid-template-columns:minmax(0,1fr);gap:.1rem}}

/* rows */
.rows{border-top:1px solid var(--ink)}
.rows>*{border-bottom:1px solid var(--rule);padding-block:1.35rem;display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:.5rem 2rem}
.rows h3{font-size:1.075rem}
.rows p{color:var(--ink-2);max-width:var(--measure)}
@media (max-width:700px){.rows>*{grid-template-columns:minmax(0,1fr)}}

/* steps */
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:2px solid var(--ink);counter-reset:s}
ol.steps{grid-template-columns:minmax(0,1fr);border-top:2px solid var(--ink)}
.step,.steps>li{padding:1.25rem 0 1.25rem 1.25rem;border-bottom:1px solid var(--rule);min-width:0}
.steps>li{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:1.25rem}
.step .n,.steps .n{font-family:var(--mono);color:var(--red);font-size:.95rem;font-weight:500;display:block;padding-top:.15rem}
.step h3,.steps h3{font-size:1.1rem;margin:.35rem 0 .3rem}
.steps>li h3{margin-top:0}
.step p,.steps p{color:var(--ink-2);font-size:.975rem;line-height:1.7;max-width:var(--measure)}
.step+.step{padding-right:1.25rem;border-right:1px solid var(--rule)}
@media (max-width:820px){.steps{grid-template-columns:minmax(0,1fr)}.step+.step{padding-right:0;border-right:0}.steps>li{grid-template-columns:minmax(0,1fr);gap:.25rem}}

/* tables */
.tbl-wrap{overflow-x:auto;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);background:var(--sheet);-webkit-overflow-scrolling:touch}
table.tbl{width:100%;border-collapse:collapse;min-width:640px}
table.tbl th{font-family:var(--sans);text-align:right;font-size:.925rem;font-weight:700;color:var(--ink);padding:.75rem 1rem;border-bottom:1px solid var(--ink);background:var(--sheet)}
table.tbl td{padding:.85rem 1rem;font-size:.95rem;color:var(--ink-2);border-bottom:1px solid var(--rule);vertical-align:top;line-height:1.65}
table.tbl tr:last-child td{border-bottom:0}
table.tbl td:first-child{color:var(--ink);font-weight:600}
table.tbl td.num{font-family:var(--mono);direction:ltr;text-align:right;white-space:nowrap;color:var(--ink)}
table.tbl .td-sub{display:block;font-weight:400;color:var(--ink-3);font-size:.9rem;margin-top:.2rem}
table.tbl th:first-child,table.tbl td:first-child{width:26%}

/* strip */
.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.strip>div{background:var(--sheet);padding:1.2rem 1.1rem}
.strip__k{display:block;font-size:.925rem;font-weight:700;color:var(--red);margin-bottom:.35rem}
.strip__v{display:block;color:var(--ink);line-height:1.55}

/* FAQ */
.faq,.faq-list{max-width:880px;border-top:2px solid var(--ink)}
.faq-item{border-bottom:1px solid var(--rule)}
.faq-item>summary{list-style:none;cursor:pointer;display:flex;gap:.9rem;align-items:flex-start;padding:1.15rem 0;position:relative}
.faq-item>summary::-webkit-details-marker{display:none}
.faq-item>summary::before{content:"";flex:0 0 auto;width:.7rem;height:.7rem;margin-top:.55rem;border-left:1.6px solid var(--ink);border-bottom:1.6px solid var(--ink);transform:rotate(-45deg);transition:transform .2s var(--ease)}
.faq-item[open]>summary::before{transform:rotate(135deg);margin-top:.8rem;border-color:var(--red)}
.faq-item>summary h3{display:inline;font-size:1.075rem;font-weight:600;color:var(--ink);line-height:1.6;letter-spacing:0}
.faq-item>summary:hover h3{color:var(--petrol)}
.faq-item>p{margin:0 1.6rem 1.35rem 0;color:var(--ink-2);line-height:1.85;max-width:var(--measure)}

/* contact (home) */
.contact-wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:2rem;align-items:start}
@media (max-width:820px){.contact-wrap{grid-template-columns:minmax(0,1fr)}}
.contact-methods{display:grid;gap:0;border-top:2px solid var(--ink)}
.cm{display:flex;align-items:center;gap:1rem;padding:1rem .25rem;border-bottom:1px solid var(--rule);color:var(--ink);text-decoration:none}
.cm:hover{background:var(--sheet)}
.cm .ci{width:2.25rem;height:2.25rem;color:var(--ink);flex:0 0 auto}
.cm .ci svg{width:2.25rem;height:2.25rem;stroke-width:1.5}
.cm .lbl{font-size:.925rem;color:var(--ink-3)}
.cm .val{font-weight:700;color:var(--ink);font-size:1.1rem}
.note b{color:var(--ink)}

/* forms */
form .form-label,form label.form-label{display:block;margin-bottom:.35rem;font-family:var(--sans);font-size:.95rem;font-weight:600;color:var(--ink);text-align:right}
.form-input,.form-select,.form-textarea,form input[type="text"],form input[type="email"],form input[type="tel"],form select,form textarea{width:100%;padding:.75rem .85rem;background:var(--sheet);border:1px solid var(--edge);border-radius:var(--r);color:var(--ink);font-size:1rem;font-family:var(--sans)}
.form-input:focus,.form-select:focus,.form-textarea:focus{outline:2px solid var(--petrol);outline-offset:1px;border-color:var(--petrol)}
.form-input::placeholder,.form-textarea::placeholder{color:var(--ink-3)}
.form-textarea{min-height:130px;resize:vertical}
form.rec{background:var(--sheet);border:1px solid var(--rule-2);border-top:3px solid var(--ink)}
form .rec{background:var(--paper)}
form input[type="checkbox"]{width:1.15rem;height:1.15rem;accent-color:var(--petrol);flex:0 0 auto}
form p[role="status"][style*="FF9A8B"]{color:var(--red) !important;font-weight:600}
form p[role="status"][style*="accent"]{color:var(--green) !important;font-weight:600}

/* ── footer (three live variants) ────────────────── */
body>footer,.site-foot{background:var(--ink);color:var(--term-ink);border-top:0;margin-top:0;padding-block:2.5rem 1.5rem}
body>footer>.wrap,body>footer>.container{padding-block:0}
body>footer a,.site-foot a{color:var(--term-ink) !important;text-decoration:none}
body>footer a:hover,.site-foot a:hover{color:var(--on-ink) !important;text-decoration:underline;text-underline-offset:.22em}
body>footer p,body>footer .note,.site-foot .note{color:var(--term-dim)}
body>footer p.font-semibold,body>footer p[style*="font-weight"]{color:var(--on-ink) !important;font-family:var(--serif);font-size:1.2rem}
body>footer [class*="border"],body>footer .service-links,body>footer [style*="border-top"]{border-color:var(--term-2) !important}
body>footer nav{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem}
body>footer .service-links{padding-bottom:1.25rem;margin-bottom:1.25rem;border-bottom:1px solid var(--term-2)}
body>footer .inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.5rem;color:var(--term-dim)}
body>footer a:focus-visible,.site-foot a:focus-visible{outline-color:var(--on-ink)}
.site-foot .brand,.site-foot .brand b,.site-foot .brand span{color:var(--on-ink)}
.site-foot .brand span{color:var(--term-ink)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:2rem}
@media (max-width:720px){.foot-grid{grid-template-columns:minmax(0,1fr);gap:1.5rem}}
.foot-grid h4{font-size:.95rem;font-weight:700;color:var(--on-ink);margin:0 0 .6rem}
.foot-grid a{display:block;font-size:.95rem;padding:.25rem 0}
.foot-bottom{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;justify-content:space-between;margin-top:2rem;padding-top:1.2rem;border-top:1px solid var(--term-2);font-size:.875rem;color:var(--term-dim)}
body>footer .mono,body>footer [style*="direction:ltr"]{color:var(--term-dim) !important}
.site-foot .note{color:var(--term-dim) !important}
body>footer .text-slate-400{color:var(--term-dim)}
body>footer .text-white{color:var(--on-ink)}

.v2-bar{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;min-height:64px}
.v2-brand .text-brand{color:var(--ink-2)}
.v2-split .fields{margin-top:1.9rem}

.border-rule{border-color:var(--rule)}.text-on-ink{color:var(--on-ink)}.bg-paper{background:var(--paper)}
.submit-btn:disabled{background:var(--wash);color:var(--ink-3);border-color:var(--rule-2);cursor:not-allowed}
form input.border,form select.border,form textarea.border,form .form-input,form .form-textarea,form .form-select{border-color:var(--edge)}
.submit-btn{white-space:nowrap}
@media (max-width:380px){.submit-btn{font-size:.92rem;padding-inline:.6rem}}
.hero-benefits span{display:inline}
.hero-benefits span+span{padding-right:.7rem;margin-right:.45rem;border-right:1px solid var(--rule-2)}
.v2-meta{display:flex;flex-wrap:wrap;gap:.25rem 1.1rem;color:var(--ink-3);font-size:.875rem}

h1,h2,h3{text-wrap:balance}
.sit-card{position:relative;padding-left:4.25rem}
.sit-card .card-ic{position:absolute;left:1.25rem;top:1.5rem;margin:0}
body>footer nav a,.foot-grid a{white-space:nowrap}
.hero-cta .btn{white-space:nowrap}
@media (max-width:380px){.hero-cta .btn{white-space:normal}}

main .mx-auto{margin-inline:0 auto}
.foot-bottom{justify-content:flex-start;gap:.5rem 1.75rem}
.v2-steps{position:relative}
.v2-steps::before{content:"";position:absolute;top:-2px;right:0;left:0;height:2px;background:var(--red);transform-origin:right center;transform:scaleX(.18)}
@media (prefers-reduced-motion:no-preference){
  .m .v2-steps[data-scene]::before{animation:v2grow 1.8s var(--ease) .2s both paused;transform:scaleX(1)}
  .m .v2-steps[data-scene].in::before{animation-play-state:running}
  .m .v2-steps[data-scene]>*{animation:v2up .55s var(--ease) both paused}
  .m .v2-steps[data-scene]>*:nth-child(2){animation-delay:.35s}.m .v2-steps[data-scene]>*:nth-child(3){animation-delay:.7s}.m .v2-steps[data-scene]>*:nth-child(4){animation-delay:1.05s}.m .v2-steps[data-scene]>*:nth-child(5){animation-delay:1.4s}
  .m .v2-steps[data-scene].in>*{animation-play-state:running}
}

/* ── scenes (decorative, aria-hidden) ─────────────── */
.v2-scene-cell{min-width:0}
.scene{position:relative;width:100%;max-width:540px;margin-inline:auto;font-family:var(--sans);color:var(--ink)}
.ex{font-size:.75rem;font-weight:600;color:var(--ink-3);border:1px dashed var(--rule-2);border-radius:var(--r);padding:.05rem .45rem;white-space:nowrap}
.term{background:var(--term);color:var(--term-ink);border-radius:4px;box-shadow:0 22px 40px -26px var(--shadow);overflow:hidden}
.term-top{display:flex;justify-content:space-between;align-items:center;padding:.55rem .9rem;border-bottom:1px solid var(--term-2);font-size:.8rem;color:var(--term-dim)}
.term-body{margin:0;padding:.9rem .95rem 1.05rem;font-family:var(--mono);font-size:min(.8rem,2.55vw);line-height:1.75;white-space:pre;overflow:hidden;text-align:left}
.term-body .ln{display:block;width:max-content;max-width:100%;overflow:hidden}
.ln.p{color:var(--term-ink)}.ln.c{color:var(--term-dim)}.ln.o{color:var(--term-cy)}.ln.bad{color:var(--term-red)}.ln.w{color:var(--term-dim)}
.ln.del{color:var(--term-red)}.ln.add{color:var(--term-green)}
.sheet,.plate{background:var(--sheet);border:1px solid var(--rule);border-radius:3px;box-shadow:0 1px 0 var(--rule),0 24px 40px -28px var(--shadow);padding:1rem 1.1rem 1.15rem;position:relative}
.sheet-top,.plate-top{display:flex;justify-content:space-between;align-items:center;gap:.75rem;font-size:.82rem;color:var(--ink-3);padding-bottom:.55rem;margin-bottom:.75rem;border-bottom:1px solid var(--rule)}
.sheet-top>span:first-child,.plate-top>span:first-child{font-weight:600;color:var(--ink-2)}
.sheet-k{font-size:.82rem;color:var(--ink-3);font-weight:600}
.sheet-h{font-family:var(--serif);font-weight:700;font-size:1.15rem;line-height:1.35;margin:.1rem 0 .65rem;color:var(--ink)}
.sheet-meta{display:flex;gap:1.5rem;margin-bottom:.8rem}
.sheet-meta div{display:flex;flex-direction:column;gap:.1rem}
.sheet-meta dt{font-size:.75rem;color:var(--ink-3)}
.sheet-meta dd{position:relative;align-self:flex-start;margin:0;font-weight:700;font-size:.92rem}
.sev{display:inline-block;font-size:.8rem;font-weight:700;padding:.08rem .5rem;border-radius:2px;white-space:nowrap}
.sev-crit{background:var(--red);color:var(--on-ink)}.sev-high{background:var(--red-wash);color:var(--red)}.sev-med{background:var(--amber-wash);color:var(--amber)}.sev-low{background:var(--paper-2);color:var(--ink-2)}
.rc{position:absolute;inset:-12px -18px -10px -18px;width:calc(100% + 36px);height:calc(100% + 22px);fill:none;stroke:var(--red);stroke-width:2;stroke-linecap:round;overflow:visible;pointer-events:none}
.rc path{vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
.redact i{display:block;height:.5rem;width:var(--w);background:var(--ink-2);border-radius:1px;margin:.45rem 0;opacity:.82}
.sheet-p{font-size:.86rem;color:var(--ink-2);margin-top:.7rem;line-height:1.6}
.pen{font-family:var(--serif);font-weight:600;color:var(--red);font-size:1.12rem;line-height:1.2;white-space:nowrap}
.arr{fill:none;stroke:var(--red);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.arr path{stroke-dasharray:1;stroke-dashoffset:0}
.stamp{position:absolute;display:inline-block;border:2px solid var(--green);color:var(--green);font-weight:700;font-size:.92rem;padding:.2rem .65rem;border-radius:3px;transform:rotate(-7deg);background:var(--sheet);white-space:nowrap}
.tagnote{position:relative;background:var(--sheet);border:1px solid var(--rule);border-right:3px solid var(--red);border-radius:3px;padding:.65rem .85rem;box-shadow:0 18px 30px -22px var(--shadow);display:flex;flex-wrap:wrap;gap:.25rem .6rem;align-items:baseline;font-size:.92rem}
.tagnote b{color:var(--red);font-weight:700}
.tagnote .ex{margin-inline-start:auto}

/* home: terminal, then the report page laid over it */
.scene-home .term{width:92%;margin-inline-start:0}
.scene-home .sheet{width:86%;margin-inline-start:auto;margin-top:-1.1rem;transform:rotate(-1.2deg);padding-bottom:3.9rem}
.scene-home .sheet-meta dd .sev{position:relative;z-index:1}
.scene-home .pen{position:absolute;left:1.1rem;top:6.1rem;transform:rotate(-5deg)}
.scene-home .arr{position:absolute;left:4.2rem;top:7.3rem;width:58px;height:30px;transform:scaleX(-1) rotate(8deg)}
.scene-home .stamp{left:1rem;bottom:.85rem}
/* appsec */
.scene-app .tagnote{width:84%;margin:-1.4rem 0 0 auto;transform:rotate(-1deg)}
/* svg plates */
.net{width:100%;height:auto;overflow:visible;font-family:var(--sans)}
.net text{font-size:12px;fill:var(--ink-3);text-anchor:middle}
.zone rect{fill:none;stroke:var(--rule-2);stroke-dasharray:4 4}
.zone text{font-weight:600;fill:var(--ink-2)}
.wire path{fill:none;stroke:var(--rule-2);stroke-width:1.4}
.nd rect{fill:var(--paper);stroke:var(--edge);stroke-width:1.2}
.nd .nl{font-family:var(--mono);font-size:12.5px;fill:var(--ink);font-weight:500}
.nd .ns{font-size:10.5px;fill:var(--ink-3)}
.nd.hit rect{stroke:var(--red);fill:var(--red-wash);stroke-width:1.6}
.nd.goal rect{stroke-width:2.6}
.net path.path{fill:none;stroke:var(--red);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.steplbl circle{fill:var(--red)}
.steplbl text{fill:var(--on-ink);font-size:11px;font-weight:700}
.legend{margin:.6rem 0 0;padding-right:1.2rem;font-size:.85rem;color:var(--ink-2);display:grid;gap:.15rem}
.legend li::marker{color:var(--red);font-weight:700}
.cloud rect{fill:var(--paper-2);stroke:var(--rule-2)}
.cloud text{font-weight:600;fill:var(--ink-2);font-size:13px}
.fw rect{fill:var(--ink)}
.fw text{font-size:11px;fill:var(--ink-3)}
.svc .ln2{stroke:var(--rule-2);stroke-width:1.4;stroke-dasharray:3 5}
.svc .probe{fill:var(--petrol);transform:translateX(204px)}
.svc rect{fill:var(--paper);stroke:var(--edge)}
.svc .pt{font-family:var(--mono);font-size:13px;fill:var(--ink);text-anchor:start;font-weight:500}
.svc .sn{font-size:12.5px;fill:var(--ink-2);text-anchor:middle}
.svc.bad rect{stroke:var(--red);fill:var(--red-wash);stroke-width:1.6}
.svc.bad .sn,.svc.bad .pt{fill:var(--red)}
.flag .ul,.callout .ul{fill:none;stroke:var(--red);stroke-width:2}
.scene-ext .tagnote{margin-top:.5rem}
.root rect{fill:var(--ink)}
.root text{fill:var(--on-ink);font-family:var(--mono);font-size:14px}
.net .br{fill:none;stroke:var(--edge);stroke-width:1.3;stroke-dasharray:1;stroke-dashoffset:0}
.leaf rect{fill:var(--paper);stroke:var(--edge)}
.leaf text{font-family:var(--mono);font-size:12px;fill:var(--ink)}
.leaf.bad rect{stroke:var(--red);fill:var(--red-wash);stroke-width:1.6}
.leaf.bad text{fill:var(--red)}
.callout .he{fill:var(--red);font-size:12.5px;font-weight:600}
.scan{font-size:.88rem;color:var(--ink-2);margin-top:.25rem}
/* config review */
.checks{list-style:none;padding:0;margin:0;display:grid;gap:.1rem}
.checks li{display:flex;gap:.7rem;align-items:center;padding:.45rem 0;border-bottom:1px dashed var(--rule);font-size:.93rem;color:var(--ink-2)}
.checks .mk{position:relative;flex:0 0 1.15rem;height:1.15rem;border:1.5px solid var(--edge);border-radius:2px}
.checks .ok .mk::after{content:"";position:absolute;left:.22rem;top:.12rem;width:.62rem;height:.35rem;border-left:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(-45deg)}
.checks .bad .mk{border-color:var(--red)}
.checks .bad .mk::before,.checks .bad .mk::after{content:"";position:absolute;left:.12rem;top:.45rem;width:.75rem;height:2px;background:var(--red);transform:rotate(45deg)}
.checks .bad .mk::before{transform:rotate(-45deg)}
.checks .bad span:last-child{color:var(--red);text-decoration:underline wavy var(--red);text-decoration-thickness:1px;text-underline-offset:.3em}
.scene-cfg .term.small{width:78%;margin:-1rem auto 0 0;position:relative}
/* annual plan */
.months{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));font-size:.7rem;color:var(--ink-3);text-align:center;margin-top:.4rem}
.track{position:relative;height:2px;background:var(--rule-2);margin:.5rem 0 0}
.track b{position:absolute;inset:0;background:var(--ink);transform-origin:right center}
.evs{list-style:none;padding:0;margin:0;position:relative;height:7.2rem}
.ev{position:absolute;top:-.42rem;right:calc(var(--m) * 100% / 12 + 100% / 24);transform:translateX(50%);display:flex;flex-direction:column;align-items:center;width:5.6rem}
.ev i{width:.75rem;height:.75rem;border-radius:50%;background:var(--ink);border:2px solid var(--sheet);box-shadow:0 0 0 1px var(--ink)}
.ev.g i{background:var(--green);box-shadow:0 0 0 1px var(--green)}
.ev span{margin-top:.35rem;font-size:.78rem;line-height:1.3;text-align:center;color:var(--ink-2);font-weight:600}
.ev:nth-child(even) span{margin-top:2.9rem}
.ev:nth-child(even)::before{content:"";position:absolute;top:1.1rem;width:1px;height:2.2rem;background:var(--rule-2)}
.ev.g span{color:var(--green)}
/* crm */
.mx{display:grid;gap:0;font-size:.88rem}
.mx-r{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));align-items:center;border-bottom:1px solid var(--rule);padding:.45rem .3rem}
.mx-h{font-size:.78rem;color:var(--ink-3);font-weight:600;border-bottom:1px solid var(--ink)}
.mx-h span{text-align:center}
.mx .rl{font-weight:600;color:var(--ink)}
.mx .cell{justify-self:center;position:relative;width:1rem;height:1rem}
.mx .cell.y::after{content:"";position:absolute;left:.15rem;top:.18rem;width:.62rem;height:.33rem;border-left:2px solid var(--petrol);border-bottom:2px solid var(--petrol);transform:rotate(-45deg)}
.mx .cell.n::after{content:"";position:absolute;left:.25rem;top:.45rem;width:.5rem;height:2px;background:var(--rule-2)}
.mx-r.bad{background:var(--red-wash)}
.mx-r.bad .rl{color:var(--red);font-family:var(--mono);font-weight:500;font-size:.82rem}
.mx-r.bad .cell.y::after{border-color:var(--red)}
.scene-crm .pen{display:block;margin-top:.7rem;transform:rotate(-2deg);text-align:left}
/* findings */
.scene-find .fh,.scene-find .fr{display:grid;grid-template-columns:1.6rem minmax(0,1fr) 4.4rem 5.6rem;gap:.6rem;align-items:center;padding:.5rem .1rem}
.scene-find .fh{font-size:.75rem;color:var(--ink-3);font-weight:600;border-bottom:1px solid var(--ink)}
.scene-find .fr{border-bottom:1px solid var(--rule);font-size:.88rem}
.scene-find .fn{font-family:var(--mono);color:var(--ink-3)}
.scene-find .ft{color:var(--ink);font-weight:600;line-height:1.35}
.scene-find .sev{justify-self:start}
.st{font-size:.8rem;font-weight:700}
.st.fixed{color:var(--green)}.st.open{color:var(--amber)}
/* compliance stack */
.scene-comp{min-height:21rem;padding-top:.5rem}
.stack{position:relative;height:19rem;width:min(100%,21rem);margin-inline:auto}
.doc{position:absolute;top:0;right:0;width:80%;height:12.5rem;background:var(--sheet);border:1px solid var(--rule-2);border-radius:3px;box-shadow:0 14px 26px -22px var(--shadow);padding:2.2rem 1rem 1rem;transform:translate(calc(var(--i) * -1.6rem),calc(var(--i) * 2.15rem)) rotate(calc(var(--i) * .9deg - 1.4deg))}
.doc .tab{position:absolute;top:.45rem;right:.6rem;background:var(--ink);color:var(--on-ink);font-size:.78rem;font-weight:600;padding:.12rem .55rem;border-radius:2px}
.doc i{display:block;height:.42rem;background:var(--rule);margin:.6rem 0;border-radius:1px}
.doc i:nth-of-type(2){width:82%}.doc i:nth-of-type(3){width:64%}
.scene-comp .stamp{left:6%;bottom:4.2rem}
.scene-comp .cap{font-size:.85rem;color:var(--ink-2);text-align:center;display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;align-items:center}
/* crm figure sits inside the article */
.v2-figure{margin:0 0 2.25rem;max-width:34rem}

@media (max-width:900px){.scene{max-width:520px}.v2-split>.v2-scene-cell{margin-top:.5rem}}
@media (max-width:420px){.scene-home .pen{top:6.4rem;font-size:1rem}.scene-home .arr{display:none}.scene-find .fh,.scene-find .fr{grid-template-columns:1.2rem minmax(0,1fr) 4rem 4.6rem;gap:.4rem;font-size:.8rem}.ev{width:4.6rem}.ev span{font-size:.7rem}.tagnote{font-size:.85rem}}

/* ── motion: plays once when a scene scrolls in; the static state is the finished drawing ── */
@keyframes v2type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes v2up{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@keyframes v2draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes v2stamp{from{opacity:0;scale:1.7}60%{opacity:1;scale:.94}to{opacity:1;scale:1}}
@keyframes v2grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes v2probe{from{transform:translateX(0);opacity:1}85%{opacity:1}to{transform:translateX(204px);opacity:1}}
@keyframes v2hit{from{fill:var(--paper);stroke:var(--edge)}to{fill:var(--red-wash);stroke:var(--red)}}
@media (prefers-reduced-motion:no-preference){
  .m [data-scene] .a-type{animation:v2type calc(var(--n) * 28ms + 120ms) steps(var(--n),end) var(--d,0s) both paused}
  .m [data-scene] .a-up{animation:v2up .6s var(--ease) var(--d,0s) both paused}
  .m [data-scene] .a-draw path,.m [data-scene] path.a-draw{animation:v2draw var(--t,.9s) var(--ease) var(--d,0s) both paused}
  .m [data-scene] .a-stamp{animation:v2stamp .5s var(--ease) var(--d,0s) both paused}
  .m [data-scene] .a-grow{animation:v2grow 3.2s linear var(--d,0s) both paused}
  .m [data-scene] .probe{animation:v2probe 1.3s var(--ease) var(--d,0s) 2 both paused}
  .m [data-scene] .nd.hit rect,.m [data-scene] .svc.bad rect,.m [data-scene] .leaf.bad rect{animation:v2hit .45s var(--ease) calc(var(--d,0s) + .2s) both paused}
  .m [data-scene] .svc.bad rect{animation-delay:calc(var(--d,0s) + 2.4s)}
  .m [data-scene].in .a-type,.m [data-scene].in .a-up,.m [data-scene].in .a-draw path,.m [data-scene].in path.a-draw,.m [data-scene].in .a-stamp,.m [data-scene].in .a-grow,.m [data-scene].in .probe,.m [data-scene].in .nd.hit rect,.m [data-scene].in .svc.bad rect,.m [data-scene].in .leaf.bad rect{animation-play-state:running}

}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}}
