/* ==========================================================================
   BLACK POWER SECURITY SOLUTIONS - design system
   Concept: "Operations Dossier". Exposed hairline structure, diamond-plate
   texture lifted from the logo shield, notched panels, monospace readouts.
   Palette taken straight off the badge: ink black, steel, signal red.
   ========================================================================== */

/* ---------- 1. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:92px}
body{margin:0}
img,svg,picture{display:block;max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--red-hot);outline-offset:3px}
::selection{background:var(--red);color:#fff}

/* ---------- 2. Tokens ----------
   Light is the default palette; dark is opted into via :root[data-theme="dark"].
   Colour runs through a few rgb triples (--fg-rgb / --veil-rgb / --panel-rgb)
   so every hairline, wash and veil flips with the theme automatically. */
:root{
  /* --- surfaces: a warm paper dossier --- */
  --ink:#F4F3F0;
  --ink-2:#EBEAE6;
  --ink-3:#FFFFFF;
  --ink-4:#F1F0EB;
  --fg-rgb:11,11,14;
  --veil-rgb:244,243,240;
  --panel-rgb:255,255,255;

  --line:rgba(var(--fg-rgb),.14);
  --line-2:rgba(var(--fg-rgb),.26);
  --line-3:rgba(var(--fg-rgb),.44);

  /* --- type --- */
  --head:#0B0B0E;
  --text:#33363C;
  --text-2:#43464D;
  --lede:#3C3F45;
  --mute:#5F636B;   /* clears AA on --ink-2 bands, not just the page ground */

  /* --- signal red, straight off the badge --- */
  --red:#E31B0C;        /* fills, rules, icon strokes            */
  --red-ink:#C8110A;    /* red used as small text (AA on paper)  */
  --red-hot:#B90F06;    /* hover: light themes darken            */
  --red-deep:#7C0803;
  --glow:rgba(227,27,12,.10);
  --badge-glow:rgba(227,27,12,.16);

  --ok:#12833C;
  --eye:#8A0A03;
  --blip:#C8110A;
  --sweep-b:rgba(206,18,10,.42);
  --sweep-c:rgba(140,8,4,.92);
  --shadow:rgba(24,20,18,.16);
  --map-filter:grayscale(1) contrast(.92) brightness(1.02);
  --stroke-c:rgba(var(--fg-rgb),.5);
  --placeholder:rgba(var(--fg-rgb),.40);

  --paper:#F3F3F0;      /* fixed: the near-white button on the red band */

  --rail:66px;
  --navh:66px;
  --pad:clamp(20px,4.2vw,60px);
  --maxw:1440px;

  --f-disp:Anton,Impact,Haettenschweiler,"Arial Narrow",sans-serif;
  --f-ui:"Space Grotesk",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;
  --ease:cubic-bezier(.22,.61,.36,1);
  --plate:url(../img/plate-light.svg);
}

:root[data-theme=dark]{
  --ink:#07070A;
  --ink-2:#0C0D11;
  --ink-3:#12141A;
  --ink-4:#191C23;
  --fg-rgb:255,255,255;
  --veil-rgb:7,7,10;
  --panel-rgb:12,13,17;

  --line:rgba(var(--fg-rgb),.085);
  --line-2:rgba(var(--fg-rgb),.17);
  --line-3:rgba(var(--fg-rgb),.32);

  --head:#FFFFFF;
  --text:#DCDDE1;
  --text-2:#C3C5CB;
  --lede:#B8BAC1;
  --mute:#7C8089;

  --red-ink:#FF4A32;    /* brighter, to clear AA on near-black */
  --red-hot:#FF3D24;
  --glow:rgba(227,27,12,.14);
  --badge-glow:rgba(227,27,12,.3);

  --ok:#4ADE80;
  --eye:#FFFFFF;
  --blip:#FF8A6E;
  --sweep-b:rgba(255,61,36,.46);
  --sweep-c:rgba(255,146,120,.95);
  --shadow:rgba(0,0,0,.6);
  --map-filter:grayscale(1) invert(.9) contrast(.82) brightness(1.06);
  --stroke-c:rgba(var(--fg-rgb),.42);
  --placeholder:rgba(var(--fg-rgb),.22);

  --plate:url(../img/plate.svg);
}
@media (max-width:1099px){:root{--rail:0px;--navh:60px}}

body{
  background:var(--ink);color:var(--text);
  font-family:var(--f-ui);font-size:16.5px;line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.is-locked{overflow:hidden}

/* ---------- 3. Typography ---------- */
h1,h2,h3,h4,h5{margin:0;font-family:var(--f-disp);font-weight:400;text-transform:uppercase;
  color:var(--head);line-height:.9;letter-spacing:.004em}
.t-mega{font-size:clamp(2.6rem,7.4vw,6.1rem);line-height:.845;letter-spacing:-.016em}
.t-xl{font-size:clamp(2rem,4.9vw,3.9rem);line-height:.9;letter-spacing:-.008em}
.t-lg{font-size:clamp(1.45rem,2.7vw,2.3rem);line-height:.94}
.t-md{font-size:clamp(1.12rem,1.7vw,1.42rem);line-height:1}
.t-sm{font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.06}

.mono{font-family:var(--f-mono);font-size:.665rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;line-height:1.5}
.lede{font-size:clamp(1.02rem,1.45vw,1.2rem);color:var(--lede);max-width:60ch}
.muted{color:var(--mute)}
.red{color:var(--red-ink)}
.stroke{color:transparent;-webkit-text-stroke:2px var(--stroke-c)}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}

/* ---------- 4. Layout ---------- */
.shell{padding-left:var(--rail)}
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}
.wrap--tight{max-width:1180px}
.sect{padding-block:clamp(62px,8.6vw,126px);border-top:1px solid var(--line);position:relative}
.sect--flush{border-top:0}
.hr{height:1px;background:var(--line);border:0;margin:0}

/* texture utilities */
.plate{background-color:var(--ink-2);
  background-image:linear-gradient(rgba(var(--veil-rgb),.46),rgba(var(--veil-rgb),.46)),var(--plate);
  background-size:auto,28px 28px;background-repeat:repeat}
.plate--deep{background-color:var(--ink);
  background-image:linear-gradient(rgba(var(--veil-rgb),.66),rgba(var(--veil-rgb),.66)),var(--plate);
  background-size:auto,28px 28px}
.plate--red{background-color:var(--red);
  /* the red band is a fixed dark ground in both themes, so it keeps the dark
     plate - the light tile's white highlights destroy the white text on it */
  background-image:linear-gradient(135deg,rgba(124,8,3,.6),rgba(227,27,12,0) 64%),url(../img/plate.svg);
  background-size:auto,28px 28px}

/* notched frame - the stepped shoulder of the badge, reduced to a corner cut */
.nf{--n:22px;background:var(--line-2);padding:1px;
  clip-path:polygon(0 0,calc(100% - var(--n)) 0,100% var(--n),100% 100%,0 100%)}
.nf__in{background:var(--ink-3);height:100%;
  clip-path:polygon(0 0,calc(100% - var(--n)) 0,100% var(--n),100% 100%,0 100%)}
.nf--red{background:var(--red)}

/* ---------- 5. Section header ---------- */
.sh{margin-bottom:clamp(28px,4vw,54px)}
.sh__top{display:flex;align-items:center;gap:18px}
.sh__ix{font-family:var(--f-mono);font-size:.665rem;font-weight:700;letter-spacing:.22em;color:var(--red-ink);flex:none}
.sh__rule{flex:1;height:1px;background:var(--line)}
.sh__tag{font-family:var(--f-mono);font-size:.615rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);flex:none}
.sh__t{margin-top:20px;max-width:24ch}
.sh__s{margin-top:16px;max-width:58ch;color:var(--mute);font-size:1.01rem}

/* ---------- 6. Buttons ---------- */
.btn{--bg:var(--red);--fg:#fff;
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:11px;
  padding:16px 27px;background:var(--bg);color:var(--fg);border:0;cursor:pointer;
  font-family:var(--f-mono);font-size:.665rem;font-weight:700;letter-spacing:.17em;
  text-transform:uppercase;text-decoration:none;white-space:nowrap;
  clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,13px 100%,0 calc(100% - 13px));
  transition:background .26s var(--ease),color .26s var(--ease)}
.btn svg{width:15px;height:15px;flex:none;transition:transform .3s var(--ease)}
.btn:hover{--bg:var(--red-hot)}
.btn:hover svg{transform:translateX(4px)}
.btn--ghost{--bg:transparent;--fg:var(--head);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn--ghost:hover{--bg:rgba(var(--fg-rgb),.07);--fg:var(--head)}
/* outlined button sitting on the red band - always white */
.btn--onred{--bg:transparent;--fg:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)}
.btn--onred:hover{--bg:rgba(255,255,255,.14);--fg:#fff}
.btn--paper{--bg:var(--paper);--fg:#0A0A0C}
.btn--paper:hover{--bg:#fff}
.btn--wide{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- 7. Spine rail ---------- */
.spine{position:fixed;inset:0 auto 0 0;width:var(--rail);z-index:60;
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  padding:15px 0 18px;border-right:1px solid var(--line);
  background-color:var(--ink-2);
  background-image:linear-gradient(rgba(var(--veil-rgb),.5),rgba(var(--veil-rgb),.5)),var(--plate);
  background-size:auto,28px 28px}
.spine__mark{width:28px;height:31px;color:var(--red);
  filter:drop-shadow(0 0 7px rgba(227,27,12,.5));transition:transform .3s var(--ease)}
.spine__mark:hover{transform:translateY(-2px)}
.spine__mid{writing-mode:vertical-rl;font-family:var(--f-mono);font-size:.595rem;font-weight:500;
  letter-spacing:.36em;text-transform:uppercase;color:var(--mute);user-select:none}
.spine__mid b{color:var(--text-2);font-weight:500}
.spine__foot{display:flex;flex-direction:column;align-items:center;gap:14px}
.spine__tel{writing-mode:vertical-rl;font-family:var(--f-mono);font-size:.595rem;letter-spacing:.24em;
  color:var(--mute);text-decoration:none;transition:color .25s}
.spine__tel:hover{color:var(--head)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--red);flex:none;
  animation:pulse 2.6s ease-out infinite}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(227,27,12,.6)}
  70%{box-shadow:0 0 0 9px rgba(227,27,12,0)}
  100%{box-shadow:0 0 0 0 rgba(227,27,12,0)}
}
@media (max-width:1099px){.spine{display:none}}

/* ---------- 8. Nav ---------- */
.nav{position:fixed;top:0;left:var(--rail);right:0;z-index:55;height:var(--navh);
  display:flex;align-items:center;gap:clamp(12px,2vw,30px);padding-inline:var(--pad);
  border-bottom:1px solid var(--line);background:rgba(var(--veil-rgb),.7);
  -webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%)}
.nav__brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex:none}
.nav__logo{width:34px;height:auto;display:none}
.nav__wm{display:flex;flex-direction:column;line-height:1}
.nav__wm b{font-family:var(--f-disp);font-weight:400;font-size:1.04rem;letter-spacing:.015em;color:var(--head)}
.nav__wm i{font-family:var(--f-mono);font-style:normal;font-size:.53rem;letter-spacing:.24em;
  color:var(--mute);margin-top:3px}
.nav__links{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav__a{position:relative;display:inline-flex;align-items:baseline;gap:7px;padding:9px 13px;
  font-family:var(--f-mono);font-size:.645rem;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mute);text-decoration:none;transition:color .24s}
.nav__a i{font-style:normal;font-size:.545rem;color:rgba(var(--fg-rgb),.24);transition:color .24s}
.nav__a:hover{color:var(--head)}
.nav__a[aria-current=page]{color:var(--head)}
.nav__a[aria-current=page] i{color:var(--red-ink)}
.nav__a[aria-current=page]::after{content:"";position:absolute;left:13px;right:13px;bottom:1px;
  height:2px;background:var(--red)}
.nav__tel{display:inline-flex;align-items:center;gap:8px;padding-left:clamp(10px,1.6vw,22px);
  margin-left:clamp(4px,1vw,14px);border-left:1px solid var(--line);
  font-family:var(--f-mono);font-size:.665rem;font-weight:700;letter-spacing:.12em;
  color:var(--head);text-decoration:none;white-space:nowrap;transition:color .24s}
.nav__tel:hover{color:var(--red-hot)}
.nav__cta{padding:12px 20px}
.burger{display:none;width:42px;height:42px;margin-left:auto;background:none;
  border:1px solid var(--line);cursor:pointer;position:relative;flex:none}
.burger span{position:absolute;left:11px;right:11px;height:1.5px;background:var(--head);
  transition:transform .3s var(--ease),opacity .2s}
.burger span:nth-child(1){top:15px}
.burger span:nth-child(2){top:20px}
.burger span:nth-child(3){top:25px}
body.menu-open .burger span:nth-child(1){transform:translateY(5px) rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

.sheet{position:fixed;inset:var(--navh) 0 0;z-index:54;display:none;flex-direction:column;
  padding:clamp(20px,6vw,40px);
  background-color:var(--ink);
  background-image:linear-gradient(rgba(var(--veil-rgb),.74),rgba(var(--veil-rgb),.74)),var(--plate);
  background-size:auto,28px 28px}
body.menu-open .sheet{display:flex}
.sheet__a{display:flex;align-items:baseline;gap:14px;padding:19px 4px;
  border-bottom:1px solid var(--line);text-decoration:none;color:var(--head);
  font-family:var(--f-disp);text-transform:uppercase;font-size:1.8rem;line-height:1}
.sheet__a i{font-family:var(--f-mono);font-style:normal;font-size:.6rem;letter-spacing:.2em;color:var(--red)}
.sheet__foot{margin-top:auto;padding-top:24px;display:grid;gap:11px}

@media (max-width:1099px){
  .nav__logo{display:block}
  .nav__links,.nav__tel,.nav__cta{display:none}
  .burger{display:block}
}

/* ---------- 9. BOOT LOADER - "Perimeter Sweep" ---------- */
.boot{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;overflow:hidden}
.boot__sh{position:absolute;left:0;right:0;height:50.5%;
  background-color:var(--ink);
  background-image:linear-gradient(rgba(var(--veil-rgb),.7),rgba(var(--veil-rgb),.7)),var(--plate);
  background-size:auto,28px 28px;
  transition:transform 1s cubic-bezier(.76,0,.24,1)}
.boot__sh--t{top:0}
.boot__sh--b{bottom:0}
.boot__seam{position:absolute;left:0;right:0;top:50%;height:1px;z-index:1;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(227,27,12,.85) 30%,var(--red-hot) 50%,rgba(227,27,12,.85) 70%,transparent);
  transition:opacity .4s ease}
.boot__scan{position:absolute;left:0;right:0;top:-32%;height:30%;z-index:1;pointer-events:none;
  background:linear-gradient(rgba(var(--fg-rgb),0),rgba(var(--fg-rgb),.022) 50%,rgba(var(--fg-rgb),0));
  animation:bScan 3.1s linear infinite}
@keyframes bScan{to{top:102%}}

.boot__core{position:relative;z-index:2;display:grid;justify-items:center;
  gap:clamp(22px,3.4vw,32px);
  transition:opacity .42s ease,transform .5s var(--ease)}

.boot__radar{position:relative;width:clamp(148px,32vw,186px);aspect-ratio:100/112}
.boot__shield{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.boot__shield path{fill:rgba(227,27,12,.045);stroke:var(--red);stroke-width:2.4;
  stroke-linejoin:round;stroke-dasharray:420;stroke-dashoffset:420;
  filter:drop-shadow(0 0 11px rgba(227,27,12,.5));
  animation:bDraw 1.2s var(--ease) forwards;transition:fill .3s ease}
@keyframes bDraw{to{stroke-dashoffset:0}}

.boot__disc{position:absolute;left:50%;top:45%;width:57%;aspect-ratio:1;
  transform:translate(-50%,-50%);border-radius:50%;overflow:hidden;opacity:0;
  background:radial-gradient(circle,rgba(227,27,12,.13),rgba(227,27,12,0) 72%);
  animation:bFade .55s .6s ease forwards;transition:opacity .35s ease}
@keyframes bFade{to{opacity:1}}
.boot__ring{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  border-radius:50%;border:1px solid rgba(var(--fg-rgb),.14)}
.boot__ring:nth-of-type(1){width:100%;height:100%}
.boot__ring:nth-of-type(2){width:66%;height:66%}
.boot__ring:nth-of-type(3){width:33%;height:33%}
.boot__cross{position:absolute;inset:0;
  background:linear-gradient(rgba(var(--fg-rgb),.12),rgba(var(--fg-rgb),.12)) 50% 0/1px 100% no-repeat,
             linear-gradient(rgba(var(--fg-rgb),.12),rgba(var(--fg-rgb),.12)) 0 50%/100% 1px no-repeat}
.boot__sweep{position:absolute;inset:-32%;border-radius:50%;
  background:conic-gradient(from 0deg,
    rgba(227,27,12,0) 0deg,rgba(227,27,12,0) 262deg,
    rgba(227,27,12,.14) 318deg,var(--sweep-b) 350deg,
    var(--sweep-c) 358.5deg,rgba(227,27,12,0) 360deg);
  animation:bSweep 1.5s linear infinite}
@keyframes bSweep{to{transform:rotate(360deg)}}
.boot__blip{position:absolute;left:var(--x);top:var(--y);width:5px;height:5px;border-radius:50%;
  background:var(--blip);transform:translate(-50%,-50%);opacity:0;
  box-shadow:0 0 9px 2px rgba(227,27,12,.55);
  animation:bBlip 1.5s var(--dl) linear infinite}
@keyframes bBlip{0%{opacity:1}42%{opacity:.28}100%{opacity:0}}
.boot__eye{position:absolute;left:50%;top:45%;width:9px;height:9px;border-radius:50%;
  transform:translate(-50%,-50%);background:var(--eye);
  box-shadow:0 0 4px 1px var(--red-hot),0 0 16px 5px rgba(227,27,12,.85)}

.boot__stamp{position:absolute;left:50%;top:45%;z-index:4;padding:8px 15px 6px;
  transform:translate(-50%,-50%) scale(.84);opacity:0;pointer-events:none;white-space:nowrap;
  font-family:var(--f-disp);font-size:clamp(1.1rem,3.2vw,1.5rem);letter-spacing:.15em;
  text-transform:uppercase;color:var(--head);
  background:rgba(var(--veil-rgb),.82);box-shadow:inset 0 0 0 2px var(--red);
  transition:opacity .26s ease,transform .38s var(--ease)}

.boot__meta{width:clamp(228px,72vw,318px)}
.boot__row{display:flex;justify-content:space-between;align-items:baseline;
  font-family:var(--f-mono);font-size:.6rem;font-weight:500;letter-spacing:.21em;
  text-transform:uppercase;color:var(--mute);margin-bottom:10px}
.boot__pct{color:var(--head);font-weight:700;letter-spacing:.08em}
.boot__pct::after{content:"%";color:var(--red);margin-left:1px}
.boot__bar{height:2px;background:rgba(var(--fg-rgb),.11);overflow:hidden}
.boot__bar i{display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--red-deep),var(--red-hot));
  box-shadow:0 0 11px rgba(227,27,12,.6)}
.boot__log{position:relative;height:15px;margin-top:15px;overflow:hidden}
.boot__log li{position:absolute;inset:0;opacity:0;transform:translateY(6px);
  font-family:var(--f-mono);font-size:.565rem;font-weight:500;letter-spacing:.15em;
  text-transform:uppercase;color:rgba(var(--fg-rgb),.34);white-space:nowrap;
  transition:opacity .3s ease,transform .3s var(--ease)}
.boot__log li.on{opacity:1;transform:none;color:var(--mute)}
.boot__log li.on b{color:var(--head);font-weight:500}

.boot.is-secure .boot__shield path{fill:rgba(227,27,12,.17)}
.boot.is-secure .boot__sweep{animation-play-state:paused;opacity:.25}
.boot.is-secure .boot__blip{opacity:0;animation:none}
.boot.is-secure .boot__disc{opacity:.5}
.boot.is-secure .boot__stamp{opacity:1;transform:translate(-50%,-50%) scale(1)}
.boot.is-secure .boot__seam{opacity:.8}
.boot.is-done .boot__sh--t{transform:translateY(-100%)}
.boot.is-done .boot__sh--b{transform:translateY(100%)}
.boot.is-done .boot__core{opacity:0;transform:scale(.96)}
.boot.is-done .boot__seam,.boot.is-done .boot__scan{opacity:0}
.boot.is-gone{display:none}

/* ---------- 10. Hero ---------- */
.hero{position:relative;padding-top:calc(var(--navh) + clamp(46px,7vw,96px));
  padding-bottom:clamp(40px,5vw,70px);overflow:hidden;
  background-color:var(--ink);
  background-image:radial-gradient(120% 90% at 88% 8%,var(--glow),rgba(var(--veil-rgb),0) 58%),
                   linear-gradient(rgba(var(--veil-rgb),.62),rgba(var(--veil-rgb),.62)),var(--plate);
  background-size:auto,auto,28px 28px}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);
  gap:clamp(30px,4vw,66px);align-items:center}
.hero__kick{display:flex;align-items:center;gap:11px;margin-bottom:clamp(20px,2.6vw,30px)}
.hero__kick span{font-family:var(--f-mono);font-size:.615rem;font-weight:500;letter-spacing:.22em;
  text-transform:uppercase;color:var(--mute)}
.hero__kick .dot{width:6px;height:6px}
.hero h1{margin-bottom:clamp(22px,3vw,32px)}
.hero h1 em{font-style:normal;display:block;white-space:nowrap}
.hero h1 .red{color:var(--red)}
.hero__lede{margin-bottom:clamp(26px,3.4vw,36px)}
.hero__mini{display:flex;flex-wrap:wrap;gap:0;margin-top:clamp(34px,4.4vw,52px);
  border-top:1px solid var(--line)}
.hero__mini div{flex:1 1 150px;padding:18px 22px 0 0;border-right:1px solid var(--line)}
.hero__mini div+div{padding-left:22px}
.hero__mini div:last-child{border-right:0}
.hero__mini b{display:block;font-family:var(--f-disp);font-size:1.32rem;color:var(--head);line-height:1}
.hero__mini span{display:block;margin-top:7px;font-family:var(--f-mono);font-size:.575rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}

.hero__badge{position:relative;display:grid;justify-items:center}
.hero__badge::before{content:"";position:absolute;top:6%;left:50%;transform:translateX(-50%);
  width:86%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,var(--badge-glow),rgba(227,27,12,0) 66%);
  filter:blur(14px)}
.hero__badge img{position:relative;width:clamp(210px,30vw,352px);
  filter:drop-shadow(0 22px 44px var(--shadow))}

/* duty board */
.board{position:relative;width:100%;max-width:390px;margin-top:-8px;z-index:2}
.board .nf__in{padding:20px 22px 22px;
  background-color:var(--ink-3);
  background-image:linear-gradient(rgba(var(--panel-rgb),.86),rgba(var(--panel-rgb),.86)),var(--plate);
  background-size:auto,28px 28px}
.board__hd{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-bottom:13px;margin-bottom:5px;border-bottom:1px solid var(--line)}
.board__hd b{font-family:var(--f-mono);font-size:.615rem;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--head)}
.board__hd i{font-family:var(--f-mono);font-style:normal;font-size:.545rem;letter-spacing:.18em;color:var(--red-ink)}
.board__r{display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:11px 0;border-bottom:1px solid rgba(var(--fg-rgb),.05);font-family:var(--f-mono);font-size:.63rem}
.board__r:last-child{border-bottom:0;padding-bottom:0}
.board__r dt{letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-size:.565rem}
.board__r dd{margin:0;letter-spacing:.07em;color:var(--head);font-weight:500;text-align:right}
.board__r dd .ok{color:var(--ok)}
.board__live{font-variant-numeric:tabular-nums}

/* ---------- 11. Marquee ---------- */
.mq{border-block:1px solid var(--line);overflow:hidden;padding:15px 0;
  background-color:var(--ink-2);
  background-image:linear-gradient(rgba(var(--veil-rgb),.55),rgba(var(--veil-rgb),.55)),var(--plate);
  background-size:auto,28px 28px}
.mq__t{display:flex;width:max-content;animation:mq 46s linear infinite}
.mq__g{display:flex;align-items:center;gap:32px;padding-right:32px;flex:none}
.mq__i{font-family:var(--f-disp);font-size:clamp(.98rem,1.7vw,1.36rem);text-transform:uppercase;
  letter-spacing:.03em;color:rgba(var(--fg-rgb),.46);white-space:nowrap}
.mq__d{width:7px;height:7px;background:var(--red);transform:rotate(45deg);flex:none}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- 12. Capability rows ---------- */
.caps{border-top:1px solid var(--line)}
.cap{border-bottom:1px solid var(--line)}
.cap__a{position:relative;display:grid;
  grid-template-columns:56px minmax(0,300px) minmax(0,1fr) 40px;
  gap:clamp(14px,2vw,30px);align-items:center;padding:clamp(20px,2.4vw,28px) clamp(10px,1.4vw,20px);
  text-decoration:none;color:inherit;transition:background .3s var(--ease)}
.cap__a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--red);
  transform:scaleY(0);transform-origin:top;transition:transform .4s var(--ease)}
.cap__a:hover{background:rgba(var(--fg-rgb),.035)}
.cap__a:hover::before{transform:scaleY(1)}
.cap__ix{font-family:var(--f-mono);font-size:.7rem;font-weight:700;letter-spacing:.1em;
  color:rgba(var(--fg-rgb),.26);transition:color .3s}
.cap__a:hover .cap__ix{color:var(--red-ink)}
.cap__t{font-family:var(--f-disp);text-transform:uppercase;line-height:1;color:var(--head);
  font-size:clamp(1.12rem,2vw,1.6rem)}
.cap__d{color:var(--mute);font-size:.92rem;line-height:1.55}
.cap__ar{justify-self:end;width:19px;height:19px;color:rgba(var(--fg-rgb),.26);
  transition:transform .3s var(--ease),color .3s}
.cap__a:hover .cap__ar{transform:translateX(6px);color:var(--red-ink)}
@media (max-width:820px){
  .cap__a{grid-template-columns:44px minmax(0,1fr) 26px;gap:14px;row-gap:8px}
  .cap__d{grid-column:2/4}
  .cap__ar{width:16px;height:16px}
}

/* ---------- 13. Service detail rows ---------- */
.svc{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:clamp(22px,3.6vw,58px);padding-block:clamp(36px,5vw,64px);border-top:1px solid var(--line)}
.svc__ix{display:flex;align-items:baseline;gap:14px;margin-bottom:16px}
.svc__ix b{font-family:var(--f-mono);font-size:.68rem;font-weight:700;letter-spacing:.18em;color:var(--red-ink)}
.svc__ix span{flex:1;height:1px;background:var(--line)}
.svc__ico{width:38px;height:38px;color:var(--red);margin-bottom:20px}
.svc__body p{color:var(--mute);font-size:1rem}
.svc__list{display:grid;gap:1px;background:var(--line);margin-top:24px}
.svc__list li{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:var(--ink);
  font-size:.9rem;color:var(--text-2)}
.svc__list li::before{content:"";flex:none;width:6px;height:6px;margin-top:.55em;
  background:var(--red);transform:rotate(45deg)}
@media (max-width:860px){.svc{grid-template-columns:1fr;gap:20px}}

/* ---------- 14. Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line)}
.stat{padding:clamp(22px,2.8vw,38px);background:var(--ink-2)}
.stat b{display:block;font-family:var(--f-disp);font-size:clamp(2rem,4.2vw,3.4rem);
  color:var(--head);line-height:.9;letter-spacing:-.01em}
.stat b i{font-style:normal;color:var(--red)}
.stat span{display:block;margin-top:12px;font-family:var(--f-mono);font-size:.575rem;
  letter-spacing:.17em;text-transform:uppercase;color:var(--mute)}
@media (max-width:800px){.stats{grid-template-columns:repeat(2,1fr)}}

/* ---------- 15. Cards ---------- */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.8vw,22px)}
@media (max-width:1080px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.cards{grid-template-columns:1fr}}
.card .nf__in{padding:clamp(24px,2.8vw,34px);height:100%;display:flex;flex-direction:column;
  transition:background .3s var(--ease)}
.card:hover .nf__in{background:var(--ink-4)}
.card__ico{width:34px;height:34px;color:var(--red);margin-bottom:22px}
.card__t{font-family:var(--f-disp);text-transform:uppercase;color:var(--head);
  font-size:clamp(1.06rem,1.6vw,1.28rem);line-height:1.02;margin-bottom:12px}
.card__d{color:var(--mute);font-size:.92rem;line-height:1.6}
.card__ix{margin-top:auto;padding-top:22px;font-family:var(--f-mono);font-size:.575rem;
  letter-spacing:.2em;color:rgba(var(--fg-rgb),.24)}

/* ---------- 16. Sector tiles ---------- */
.sectors{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line)}
.sector{display:flex;align-items:center;gap:14px;padding:clamp(18px,2vw,24px);background:var(--ink);
  transition:background .3s var(--ease)}
.sector:hover{background:var(--ink-3)}
.sector svg{width:22px;height:22px;flex:none;color:var(--red)}
.sector span{font-family:var(--f-mono);font-size:.635rem;font-weight:500;letter-spacing:.13em;
  text-transform:uppercase;color:var(--text-2);line-height:1.4}
@media (max-width:900px){.sectors{grid-template-columns:repeat(2,1fr)}}
@media (max-width:460px){.sectors{grid-template-columns:1fr}}

/* ---------- 16b. Compliance checks ---------- */
.checks{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line)}
.chk{display:grid;grid-template-columns:24px minmax(0,1fr);gap:16px;
  padding:clamp(20px,2.4vw,30px);background:var(--ink-2)}
.chk svg{width:22px;height:22px;margin-top:3px}
.chk h3{font-size:clamp(1rem,1.4vw,1.14rem);line-height:1.04;margin-bottom:9px}
.chk p{color:var(--mute);font-size:.9rem;line-height:1.58}
@media (max-width:760px){.checks{grid-template-columns:1fr}}

/* ---------- 17. Protocol steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line)}
.step{position:relative;padding:clamp(22px,2.6vw,34px);background:var(--ink-2);overflow:hidden}
.step::after{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--red);
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.step:hover::after{transform:scaleX(1)}
.step b{display:block;font-family:var(--f-mono);font-size:.635rem;font-weight:700;
  letter-spacing:.2em;color:var(--red-ink);margin-bottom:20px}
.step h3{font-size:clamp(1.02rem,1.5vw,1.22rem);line-height:1.04;margin-bottom:11px}
.step p{color:var(--mute);font-size:.88rem;line-height:1.55}
@media (max-width:920px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* ---------- 18. Split feature ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(26px,4vw,70px);align-items:center}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.frame{position:relative;padding:clamp(26px,3.4vw,46px);
  background-color:var(--ink-2);
  background-image:radial-gradient(90% 80% at 70% 20%,var(--glow),rgba(var(--veil-rgb),0) 62%),
                   linear-gradient(rgba(var(--veil-rgb),.6),rgba(var(--veil-rgb),.6)),var(--plate);
  background-size:auto,auto,28px 28px;
  border:1px solid var(--line);display:grid;place-items:center}
.frame img{width:min(100%,330px);filter:drop-shadow(0 20px 40px var(--shadow))}
.frame__cnr{position:absolute;width:16px;height:16px;border:2px solid var(--red)}
.frame__cnr:nth-of-type(1){top:-1px;left:-1px;border-right:0;border-bottom:0}
.frame__cnr:nth-of-type(2){top:-1px;right:-1px;border-left:0;border-bottom:0}
.frame__cnr:nth-of-type(3){bottom:-1px;left:-1px;border-right:0;border-top:0}
.frame__cnr:nth-of-type(4){bottom:-1px;right:-1px;border-left:0;border-top:0}

/* keyed list (about / principles) */
.keyed{border-top:1px solid var(--line)}
.keyed li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:clamp(14px,2vw,26px);
  padding:clamp(20px,2.4vw,28px) 0;border-bottom:1px solid var(--line)}
.keyed b{font-family:var(--f-mono);font-size:.665rem;font-weight:700;letter-spacing:.18em;color:var(--red-ink)}
.keyed h3{font-size:clamp(1.06rem,1.6vw,1.3rem);margin-bottom:10px;line-height:1.04}
.keyed p{color:var(--mute);font-size:.94rem;max-width:66ch}
@media (max-width:600px){.keyed li{grid-template-columns:1fr;gap:10px}}

/* quote / statement band */
.statement{padding-block:clamp(52px,7vw,104px);text-align:left}
.statement blockquote{margin:0;max-width:22ch;font-family:var(--f-disp);text-transform:uppercase;
  color:var(--head);font-size:clamp(1.8rem,4.4vw,3.4rem);line-height:.94;letter-spacing:-.006em}
.statement blockquote .stroke{display:block}
.statement figcaption{margin-top:26px;font-family:var(--f-mono);font-size:.615rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}

/* ---------- 19. Page header ---------- */
.phead{position:relative;padding-top:calc(var(--navh) + clamp(48px,6.4vw,86px));
  padding-bottom:clamp(38px,5vw,64px);overflow:hidden;
  background-color:var(--ink);
  background-image:radial-gradient(110% 100% at 92% 0%,var(--glow),rgba(var(--veil-rgb),0) 60%),
                   linear-gradient(rgba(var(--veil-rgb),.64),rgba(var(--veil-rgb),.64)),var(--plate);
  background-size:auto,auto,28px 28px}
.phead__crumb{display:flex;align-items:center;gap:10px;margin-bottom:clamp(20px,2.6vw,28px);
  font-family:var(--f-mono);font-size:.615rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}
.phead__crumb a{text-decoration:none;transition:color .24s}
.phead__crumb a:hover{color:var(--head)}
.phead__crumb b{color:var(--red-ink);font-weight:500}
.phead h1{max-width:20ch}
.phead__lede{margin-top:clamp(20px,2.6vw,28px);max-width:62ch}

/* ---------- 20. Contact ---------- */
.contact{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(26px,3.6vw,58px);align-items:start}
@media (max-width:940px){.contact{grid-template-columns:1fr}}
.ledger{border-top:1px solid var(--line)}
.ledger a,.ledger div{display:grid;grid-template-columns:clamp(96px,24%,132px) minmax(0,1fr);gap:16px;
  padding:20px 4px;border-bottom:1px solid var(--line);text-decoration:none;
  transition:background .3s var(--ease)}
.ledger a:hover{background:rgba(var(--fg-rgb),.035)}
.ledger dt,.ledger .k{font-family:var(--f-mono);font-size:.575rem;letter-spacing:.19em;
  text-transform:uppercase;color:var(--mute);padding-top:.35em}
.ledger .v{font-size:1.02rem;color:var(--head);line-height:1.5}
.ledger .v small{display:block;margin-top:5px;font-size:.8rem;color:var(--mute);letter-spacing:.02em}

.form{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.fr{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line)}
@media (max-width:640px){.fr{grid-template-columns:1fr}}
.f{position:relative;background:var(--ink-2);padding:15px 18px 13px}
.f label{display:block;font-family:var(--f-mono);font-size:.545rem;letter-spacing:.19em;
  text-transform:uppercase;color:var(--mute);margin-bottom:7px}
.f input,.f select,.f textarea{width:100%;background:none;border:0;padding:0;
  font-size:.98rem;color:var(--head);font-family:var(--f-ui)}
.f textarea{resize:vertical;min-height:118px;line-height:1.55}
.f input::placeholder,.f textarea::placeholder{color:var(--placeholder)}
.f input:focus,.f select:focus,.f textarea:focus{outline:none}
.f:focus-within{background:var(--ink-3)}
.f:focus-within label{color:var(--red-ink)}
.f select{appearance:none;cursor:pointer}
.f select option{background:var(--ink-3);color:var(--head)}
.f--sel::after{content:"";position:absolute;right:18px;bottom:20px;width:7px;height:7px;
  border-right:1.5px solid var(--mute);border-bottom:1.5px solid var(--mute);
  transform:rotate(45deg);pointer-events:none}
.form__foot{background:var(--ink-2);padding:18px;display:flex;flex-wrap:wrap;gap:14px;
  align-items:center;justify-content:space-between}
.form__note{font-family:var(--f-ui);font-size:.83rem;color:var(--mute);
  max-width:46ch;line-height:1.55;margin:0}

.map{border:1px solid var(--line);overflow:hidden;background:var(--ink-2);line-height:0}
.map iframe{width:100%;height:clamp(280px,42vw,430px);border:0;filter:var(--map-filter)}

.alert{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(16px,3vw,40px);
  padding:clamp(24px,3vw,38px);border:1px solid var(--line);
  background-color:var(--ink-2);
  background-image:linear-gradient(90deg,var(--glow),rgba(var(--veil-rgb),0) 58%),
                   linear-gradient(rgba(var(--veil-rgb),.5),rgba(var(--veil-rgb),.5)),var(--plate);
  background-size:auto,auto,28px 28px}
.alert__t{flex:1 1 260px}
.alert__t b{display:block;font-family:var(--f-disp);text-transform:uppercase;color:var(--head);
  font-size:clamp(1.2rem,2.2vw,1.7rem);line-height:1.02}
.alert__t span{display:block;margin-top:9px;font-family:var(--f-mono);font-size:.575rem;
  letter-spacing:.17em;text-transform:uppercase;color:var(--mute)}
.alert__n{font-family:var(--f-disp);font-size:clamp(1.6rem,4vw,2.7rem);color:var(--head);
  text-decoration:none;letter-spacing:.01em;transition:color .24s;white-space:nowrap}
.alert__n:hover{color:var(--red-hot)}

/* ---------- 21. CTA band ---------- */
.cta{position:relative;overflow:hidden;padding-block:clamp(54px,7vw,104px)}
.cta__in{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
  gap:clamp(24px,3.4vw,56px);align-items:end}
@media (max-width:860px){.cta__in{grid-template-columns:1fr;align-items:start}}
.cta h2{color:#fff;max-width:20ch}
.cta__s{margin-top:20px;max-width:48ch;color:rgba(255,255,255,.82);font-size:1.02rem}
.cta__side{display:grid;gap:12px;justify-items:start}
.cta__side .mono{color:rgba(255,255,255,.72)}

/* ---------- 22. Footer ---------- */
.foot{border-top:1px solid var(--line);
  background-color:var(--ink-2);
  background-image:linear-gradient(rgba(var(--veil-rgb),.62),rgba(var(--veil-rgb),.62)),var(--plate);
  background-size:auto,28px 28px}
.foot__top{display:grid;grid-template-columns:minmax(0,1.25fr) repeat(3,minmax(0,.85fr));
  gap:clamp(26px,3vw,44px);padding-block:clamp(46px,5.6vw,76px)}
@media (max-width:960px){.foot__top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot__top{grid-template-columns:1fr}}
.foot__brand img{width:76px;margin-bottom:20px}
.foot__brand p{color:var(--mute);font-size:.9rem;max-width:38ch}
.foot__h{font-family:var(--f-mono);font-size:.575rem;letter-spacing:.21em;text-transform:uppercase;
  color:var(--head);margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.foot__l li{margin-bottom:11px}
.foot__l a{font-size:.92rem;color:var(--mute);text-decoration:none;transition:color .24s;
  overflow-wrap:anywhere}
.foot__l a:hover{color:var(--head)}
.foot__l .v{font-size:.92rem;color:var(--text-2);line-height:1.6}
.foot__bar{border-top:1px solid var(--line);padding-block:20px;display:flex;flex-wrap:wrap;
  gap:12px 26px;align-items:center;justify-content:space-between}
.foot__bar p{margin:0;font-family:var(--f-mono);font-size:.545rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--mute)}
.foot__bar .sep{color:rgba(var(--fg-rgb),.2);margin-inline:8px}

/* ---------- 22b. Responsive corrections ---------- */
@media (max-width:1180px){
  .hero__grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
}
@media (min-width:961px) and (max-width:1180px){
  .foot__top{grid-template-columns:minmax(0,1.1fr) repeat(3,minmax(0,.9fr))}
}
@media (max-width:960px){
  .hero__grid{grid-template-columns:1fr;gap:clamp(34px,7vw,50px)}
  .hero__badge{justify-items:start}
  .hero__badge::before{left:34%}
  .hero__badge img{width:clamp(196px,46vw,296px)}
  .board{max-width:100%;margin-top:clamp(18px,3vw,26px)}
  .hero__kick{align-items:flex-start}
  .hero__kick .dot{margin-top:.5em}
}
@media (max-width:720px){
  .hero__mini div{flex:1 1 100%;padding:16px 0 16px 0;border-right:0;
    border-bottom:1px solid var(--line)}
  .hero__mini div+div{padding-left:0}
  .hero__mini div:last-child{border-bottom:0;padding-bottom:0}
  .hero__badge{justify-items:stretch}
  .statement blockquote{max-width:none}
}
@media (max-width:560px){
  .btn{white-space:normal;text-align:center;padding:15px 20px;line-height:1.35}
  .btn-row{flex-direction:column;align-items:stretch}
  .btn-row .btn{width:100%}
  .cta__side{justify-items:stretch}
  .cta__side .btn{width:100%}
  .ledger a,.ledger div{grid-template-columns:1fr;gap:7px}
  .ledger dt,.ledger .k{padding-top:0}
  .foot__bar{flex-direction:column;align-items:flex-start}
  .alert__n{font-size:clamp(1.5rem,9vw,2.2rem)}
}

/* ---------- 23. Reveal ---------- */
.rv{opacity:0;transform:translateY(14px);
  transition:opacity .62s var(--ease),transform .62s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.07s}
.rv-d2{transition-delay:.14s}
.rv-d3{transition-delay:.21s}
.rv-d4{transition-delay:.28s}

/* ---------- 24. Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .mq__t,.dot,.boot__scan,.boot__sweep,.boot__blip{animation:none!important}
  .boot__shield path{animation:none;stroke-dashoffset:0}
  .boot__disc{animation:none;opacity:1}
  .boot__sh{transition:none}
  .cap__a::before,.step::after,.btn svg,.cap__ar{transition:none}
}

/* ---------- 25. Print ---------- */
@media print{
  .spine,.nav,.sheet,.boot,.mq,.cta{display:none!important}
  body{background:#fff;color:#111}
  .shell{padding-left:0}
}


/* ---------- 26. Theme toggle ---------- */
.tgl{position:relative;width:38px;height:38px;flex:none;display:grid;place-items:center;
  background:none;border:1px solid var(--line);cursor:pointer;padding:0;
  transition:background .24s var(--ease),border-color .24s var(--ease)}
.tgl:hover{background:rgba(var(--fg-rgb),.06);border-color:var(--line-2)}
.tgl svg{width:17px;height:17px;fill:none;stroke:var(--head);stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.tgl__sun{display:none}
:root[data-theme=dark] .tgl__sun{display:block}
:root[data-theme=dark] .tgl__moon{display:none}

/* short cross-fade while the palette swaps, so the flip is not a hard cut */
.theming,.theming *{
  transition:background-color .26s ease,border-color .26s ease,color .26s ease,
             fill .26s ease,stroke .26s ease!important}

@media (max-width:1099px){
  .tgl{margin-left:auto}
  .burger{margin-left:12px}
}
@media (prefers-reduced-motion:reduce){
  .theming,.theming *{transition:none!important}
}

/* ---------- 27. Light-theme loader corrections ----------
   On paper the red washes and wide glows read as a smudge, so the radar becomes
   a pale instrument face with crisper rings and a stronger sweep. */
:root[data-theme=light] .boot__shield path{
  fill:rgba(255,255,255,.74);
  filter:drop-shadow(0 2px 9px rgba(227,27,12,.16))}
:root[data-theme=light] .boot.is-secure .boot__shield path{fill:rgba(227,27,12,.13)}
:root[data-theme=light] .boot__disc{
  background:radial-gradient(circle,rgba(var(--fg-rgb),.035),rgba(var(--fg-rgb),0) 72%)}
:root[data-theme=light] .boot__ring{border-color:rgba(var(--fg-rgb),.22)}
:root[data-theme=light] .boot__cross{
  background:linear-gradient(rgba(var(--fg-rgb),.18),rgba(var(--fg-rgb),.18)) 50% 0/1px 100% no-repeat,
             linear-gradient(rgba(var(--fg-rgb),.18),rgba(var(--fg-rgb),.18)) 0 50%/100% 1px no-repeat}
:root[data-theme=light] .boot__sweep{
  background:conic-gradient(from 0deg,
    rgba(227,27,12,0) 0deg,rgba(227,27,12,0) 262deg,
    rgba(206,18,10,.20) 318deg,rgba(196,16,9,.52) 350deg,
    rgba(140,8,4,.9) 358.5deg,rgba(227,27,12,0) 360deg)}
:root[data-theme=light] .boot__eye{
  box-shadow:0 0 3px 1px var(--red),0 0 11px 3px rgba(227,27,12,.28)}
:root[data-theme=light] .boot__blip{box-shadow:0 0 7px 1px rgba(227,27,12,.4)}
:root[data-theme=light] .boot__bar i{box-shadow:0 0 8px rgba(227,27,12,.4)}
:root[data-theme=light] .spine__mark{filter:drop-shadow(0 1px 5px rgba(227,27,12,.3))}
