/* /Components/Layout/MainLayout.razor.rz.scp.css */
.jz-shell[b-v8ugqpiun3] {
  --color-accent-100: color-mix(in srgb, var(--color-accent) 14%, var(--color-neutral-100));
  --color-accent-200: color-mix(in srgb, var(--color-accent) 32%, var(--color-neutral-100));
  --color-accent-300: color-mix(in srgb, var(--color-accent) 60%, var(--color-neutral-100));
  --color-accent-400: color-mix(in srgb, var(--color-accent) 80%, var(--color-neutral-200));
  --color-accent-700: color-mix(in srgb, var(--color-accent) 42%, var(--color-bg));
  --color-accent-800: color-mix(in srgb, var(--color-accent) 26%, var(--color-bg));
  --color-accent-900: color-mix(in srgb, var(--color-accent) 14%, var(--color-bg));
  --color-surface: color-mix(in srgb, var(--color-accent) 5%, #1b1e2b);
  --color-section: color-mix(in srgb, var(--color-accent) 22%, var(--color-bg));
  --color-section-glow: color-mix(in srgb, var(--color-accent) 34%, var(--color-bg));

  position: relative;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  min-height: 100%;
  overflow-x: hidden;
}

/* Background grid + scanlines, masked to a soft radial fade at the top. */
.jz-shell[b-v8ugqpiun3]::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    linear-gradient(to right, color-mix(in srgb, var(--color-accent) 7%, transparent) 1px, transparent 1px) 0 0 / 96px 96px,
    linear-gradient(to bottom, color-mix(in srgb, var(--color-accent) 7%, transparent) 1px, transparent 1px) 0 0 / 96px 96px,
    repeating-linear-gradient(to bottom, color-mix(in srgb, var(--color-text) 4%, transparent) 0 1px, transparent 1px 3px);
  mask-image: radial-gradient(120% 90% at 50% 0%, #000 20%, transparent 85%);
}

/* Mouse-follow glow orb (see home-effects.js). Sits at the same z-index as
   the background grid, i.e. behind every content band. */
.jz-orb[b-v8ugqpiun3] {
  position: fixed; left: 0; top: 0; z-index: 0; width: 640px; height: 640px;
  border-radius: 50%; pointer-events: none; opacity: 0; transition: opacity .6s ease;
  background: radial-gradient(circle, color-mix(in srgb, var(--color-accent) 20%, transparent), transparent 62%);
  will-change: transform;
}

#blazor-error-ui[b-v8ugqpiun3] {
  display: none;
  position: fixed; left: 16px; bottom: 16px; right: 16px; z-index: 1000;
  padding: 14px 18px; border-radius: var(--radius-md);
  background: var(--color-surface); color: var(--color-text);
  box-shadow: var(--shadow-lg); font-size: 14px;
}
#blazor-error-ui.show[b-v8ugqpiun3] { display: block; }
#blazor-error-ui .reload[b-v8ugqpiun3] { color: var(--color-accent); margin-left: 6px; }
#blazor-error-ui .dismiss[b-v8ugqpiun3] { position: absolute; top: 8px; right: 12px; cursor: pointer; }
/* /Components/Pages/Components/CertificationCard.razor.rz.scp.css */
.jz-card.jz-card-dashed[b-jikch9av98] { border-style: dashed; border-color: color-mix(in srgb, var(--color-accent) 40%, transparent); background: transparent; }

.jz-cert-head[b-jikch9av98] { display: flex; align-items: flex-start; gap: 12px; }
/* PhosphorIcon renders its own <i> as a child component, so reaching it needs ::deep. */
.jz-cert-head[b-jikch9av98]  i { font-size: 22px; color: var(--color-accent); margin-top: 2px; }
.jz-cert-head-text[b-jikch9av98] { min-width: 0; }
/* /Components/Pages/Components/FlagshipWork.razor.rz.scp.css */
.jz-flagship[b-kwevh88uk6] {
  border-radius: var(--radius-lg);
  background: radial-gradient(130% 150% at 100% 0%, var(--color-accent-900), var(--color-surface) 58%);
  box-shadow: var(--shadow-sm); padding: 36px 32px; margin-bottom: 28px;
  display: flex; flex-wrap: wrap; gap: 40px;
}
.jz-flagship-copy[b-kwevh88uk6] { flex: 1 1 320px; min-width: 0; }
.jz-flagship-badge[b-kwevh88uk6] { display: flex; align-items: center; gap: 10px; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-accent); margin-bottom: 14px; font-family: ui-monospace, Menlo, Consolas, monospace; }
.jz-flagship-badge-rule[b-kwevh88uk6] { width: 22px; height: 1px; background: var(--color-accent); }
.jz-flagship-title[b-kwevh88uk6] { font-size: clamp(28px, 3.6vw, 40px); line-height: 1.06; letter-spacing: -0.02em; margin: 0 0 14px; }
.jz-flagship-desc[b-kwevh88uk6] { font-size: 16px; line-height: 1.6; max-width: 52ch; color: color-mix(in srgb, var(--color-text) 80%, transparent); margin: 0 0 20px; }
.jz-flagship-desc strong[b-kwevh88uk6] { font-weight: 500; color: var(--color-text); }
.jz-flagship-actions[b-kwevh88uk6] { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }

.jz-flagship-facts[b-kwevh88uk6] { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.jz-fact-row[b-kwevh88uk6] { display: flex; gap: 14px; padding: 12px 0; align-items: baseline; border-bottom: 1px solid var(--color-neutral-800); }
.jz-fact-row:last-child[b-kwevh88uk6] { border-bottom: none; }
.jz-fact-label[b-kwevh88uk6] { flex: 0 0 96px; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: color-mix(in srgb, var(--color-text) 55%, transparent); }
.jz-fact-value[b-kwevh88uk6] { font-size: 14px; }
/* /Components/Pages/Components/HeroSection.razor.rz.scp.css */
.jz-hero[b-x7rbusuwaa] {
  position: relative; z-index: 1;
  overflow: hidden; max-width: 1100px; margin: 0 auto;
  padding: 72px 24px 56px; display: flex; flex-wrap: wrap; gap: 48px; align-items: center;
}
.jz-hero-copy[b-x7rbusuwaa] { flex: 1 1 340px; min-width: 0; }
.jz-eyebrow[b-x7rbusuwaa] {
  display: flex; align-items: center; gap: 10px; font-size: 11px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--color-accent); margin-bottom: 20px;
  font-family: ui-monospace, Menlo, Consolas, monospace;
}
.jz-heading[b-x7rbusuwaa] { 
  font-size: clamp(38px, 6vw, 62px);
  line-height: 1.04;
  letter-spacing: -0.025em;
  margin: 0 0 20px;
  max-width: 18ch;
  text-wrap: pretty;

  &:focus-visible {
    outline: none;
  }
}

.jz-lead[b-x7rbusuwaa] { font-size: 17px; line-height: 1.6; max-width: 54ch; color: color-mix(in srgb, var(--color-text) 78%, transparent); margin: 0 0 28px; }
.jz-hero-actions[b-x7rbusuwaa] { display: flex; flex-wrap: wrap; gap: 10px; }

.jz-hero-portrait[b-x7rbusuwaa] { flex: 0 1 240px; position: relative; display: grid; place-items: center; }
.jz-hero-portrait-glow[b-x7rbusuwaa] {
  position: absolute; width: 260px; height: 260px; border-radius: 50%;
  background: radial-gradient(circle, var(--color-accent-700), transparent 68%);
  filter: blur(28px); opacity: 0.75;
}
.jz-hero-portrait img[b-x7rbusuwaa] { position: relative; width: 100%; max-width: 240px; border-radius: 50%; box-shadow: var(--shadow-md); }
/* /Components/Pages/Components/SecuritySection.razor.rz.scp.css */
.jz-row[b-nzextubi51] { transition: background .18s ease; }
.jz-row:hover[b-nzextubi51] { background: color-mix(in srgb, var(--color-text) 5%, transparent); }

.jz-security-grid[b-nzextubi51] { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 40px; align-items: start; }
.jz-security-intro[b-nzextubi51] { font-size: 15px; max-width: 46ch; color: color-mix(in srgb, var(--color-text) 78%, transparent); }
.jz-security-highlight[b-nzextubi51] { margin-top: 20px; padding: 18px 20px; border-radius: var(--radius-md); background: var(--color-surface); border: 1px solid var(--color-neutral-800); max-width: 46ch; }
.jz-security-highlight-badge[b-nzextubi51] { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-accent); margin-bottom: 8px; }
.jz-security-highlight-body[b-nzextubi51] { margin: 0; font-size: 14px; line-height: 1.6; color: color-mix(in srgb, var(--color-text) 80%, transparent); }
.jz-security-links[b-nzextubi51] { display: flex; flex-direction: column; }
.jz-security-link[b-nzextubi51] { display: flex; align-items: center; gap: 12px; padding: 12px 10px; border-radius: var(--radius-sm); font-size: 14px; }
/* PhosphorIcon renders its own <i> as a child component, so reaching it needs ::deep. */
.jz-security-link[b-nzextubi51]  i { color: var(--color-accent); }
.jz-security-link-sub[b-nzextubi51] { margin-left: auto; font-size: 12px; opacity: .55; }
/* /Components/Pages/Components/SiteFooter.razor.rz.scp.css */
.jz-footer[b-pmhmswugi6] {
  position: relative; z-index: 1;
  max-width: 1100px; margin: 0 auto; padding: 72px 24px 56px;
  display: flex; flex-wrap: wrap; gap: 16px; align-items: center;
  font-size: 12px; font-family: ui-monospace, Menlo, Consolas, monospace;
  color: color-mix(in srgb, var(--color-text) 50%, transparent);
}
.jz-footer-copyright[b-pmhmswugi6] { margin-right: auto; }
.jz-footer-links[b-pmhmswugi6] { display: flex; gap: 16px; }
.jz-footer-links a[b-pmhmswugi6] { text-decoration: none; }
/* /Components/Pages/Components/SiteHeader.razor.rz.scp.css */
/* Already non-static (sticky) with z-index 10, so it's above the fixed
   background grid (z-index 0) without needing the explicit lift the other,
   otherwise-static content bands need. */
.jz-header[b-jof0mro1p2] {
  position: sticky; top: 0; z-index: 10;
  background: color-mix(in srgb, var(--color-bg) 88%, transparent);
  backdrop-filter: blur(10px);
}
.jz-header-inner[b-jof0mro1p2] {
  max-width: 1100px; margin: 0 auto; padding: 14px 24px;
  display: flex; align-items: center; gap: 28px;
}
.jz-brand[b-jof0mro1p2] {
  font-family: var(--font-heading); font-weight: 500; font-size: 16px;
  margin-right: auto; display: flex; align-items: center; gap: 9px;
  min-width: 0;
}
.jz-brand-dot[b-jof0mro1p2] {
  flex: none;
  width: 7px; height: 7px; border-radius: 50%; background: var(--color-accent);
  box-shadow: 0 0 10px var(--color-accent);
}
.jz-brand-name[b-jof0mro1p2] {
  min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.jz-nav[b-jof0mro1p2] { display: flex; gap: 22px; font-size: 13px; }

.jz-header-toggle[b-jof0mro1p2] {
  display: none;
  align-items: center; justify-content: center; flex: none;
  width: 36px; height: 36px;
  border: 1px solid var(--color-divider); border-radius: var(--radius-md);
  background: transparent; color: var(--color-text); cursor: pointer;
}
.jz-header-toggle:hover[b-jof0mro1p2] { border-color: var(--color-accent); color: var(--color-accent); }

@media (max-width: 640px) {
  .jz-header-inner[b-jof0mro1p2] { flex-wrap: wrap; padding: 12px 20px; gap: 12px; }
  .jz-brand[b-jof0mro1p2] { order: 1; }
  .jz-header-toggle[b-jof0mro1p2] { display: flex; order: 2; }
  .jz-header-email[b-jof0mro1p2] { order: 3; padding: 8px 10px; }

  .jz-nav[b-jof0mro1p2] {
    order: 4; flex-basis: 100%;
    flex-direction: column; gap: 0;
    max-height: 0; overflow: hidden;
    transition: max-height .25s ease;
  }
  .jz-nav.jz-nav--open[b-jof0mro1p2] { max-height: 260px; }
  .jz-nav .jz-link[b-jof0mro1p2] {
    display: block; padding: 12px 4px;
    border-top: 1px solid var(--color-neutral-800);
  }
}

@media (max-width: 380px) {
  .jz-header-email-label[b-jof0mro1p2] { display: none; }
  .jz-header-email[b-jof0mro1p2] { width: 36px; padding: 0; }
}
/* /Components/Pages/Components/StackSection.razor.rz.scp.css */
.jz-stack-grid[b-ptt8l2s2sj] { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap: 32px 40px; }
.jz-stack-title[b-ptt8l2s2sj] { margin: 0 0 12px; color: color-mix(in srgb, var(--color-text) 60%, transparent); }
.jz-stack-pill[b-ptt8l2s2sj] { display: inline-flex; align-items: center; gap: 6px; }

/* The icon markup comes from IconProvider as raw injected SVG (not compiled
   Razor markup), so it never carries this component's scope attribute —
   ::deep is required to reach it. */
.jz-stack-pill[b-ptt8l2s2sj]  img,
.jz-stack-pill[b-ptt8l2s2sj]  svg { width: 13px; height: 13px; display: block; }
/* simple-icons ship with no fill, which defaults to black; inherit the pill's text color instead. */
.jz-stack-pill[b-ptt8l2s2sj]  svg { fill: currentColor; }
/* /Components/Pages/Components/Tag.razor.rz.scp.css */
.jz-tag[b-vkve237khj] { font-family: ui-monospace, Menlo, Consolas, monospace; }
/* /Components/Pages/Components/TerminalCard.razor.rz.scp.css */
.jz-terminal[b-nvwryyg6uw] { position: relative; margin-top: 30px; max-width: 480px; border-radius: var(--radius-md); background: var(--color-surface); box-shadow: var(--shadow-sm); overflow: hidden; }
.jz-terminal-bar[b-nvwryyg6uw] { display: flex; align-items: center; gap: 7px; padding: 9px 12px; border-bottom: 1px solid var(--color-neutral-800); }
.jz-terminal-dot[b-nvwryyg6uw] { width: 8px; height: 8px; border-radius: 50%; background: var(--color-neutral-700); }
.jz-terminal-dot--accent[b-nvwryyg6uw] { background: var(--color-accent-700); }
.jz-terminal-label[b-nvwryyg6uw] { margin-left: 6px; font-size: 11px; color: color-mix(in srgb, var(--color-text) 50%, transparent); }
.jz-terminal-body[b-nvwryyg6uw] { padding: 14px 14px 16px; font-size: 13px; line-height: 1.75; }
.jz-terminal-prompt[b-nvwryyg6uw] { color: var(--color-neutral-500); }
.jz-terminal-typed[b-nvwryyg6uw] { color: var(--color-accent-300); }

@keyframes jzblink-b-nvwryyg6uw { 0%, 50% { opacity: 1; } 50.01%, 100% { opacity: 0; } }
.jz-caret[b-nvwryyg6uw] {
  display: inline-block; width: 8px; height: 14px; margin-left: 3px;
  vertical-align: -2px; background: var(--color-accent);
  animation: jzblink-b-nvwryyg6uw 1s steps(1) infinite;
}
@media (prefers-reduced-motion: reduce) { .jz-caret[b-nvwryyg6uw] { animation: none; } }
/* /Components/Pages/Home.razor.rz.scp.css */
.jz-work-grid[b-26ovn0fr3l] { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 16px; }
.jz-certs-grid[b-26ovn0fr3l] { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 16px; }