/* ============================================================
   Minimal theme (v10): white, quiet, serif display headings,
   blue accent buttons. Loaded after the app CSS and overrides it.
   ============================================================ */
@font-face { font-family: "Instrument Serif"; src: url(/fonts/instrument-serif-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Serif"; src: url(/fonts/instrument-serif-latin-400-italic.woff2) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter"; src: url(/fonts/inter-latin-wght-normal.woff2) format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url(/fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2"); font-weight: 400; font-display: swap; }

:root, html[data-theme=light] {
  --m-bg: #FAFAFA; --m-surface: #FFFFFF; --m-rail: #F4F4F5; --m-ink: #111111; --m-ink-2: #3F3F46;
  --m-muted: #71717A; --m-line: #E4E4E7; --m-line-2: #D4D4D8; --m-blue: #2C5BD6; --m-blue-2: #1F46B0;
  --m-blue-tint: #EEF2FD; --m-serif: "Instrument Serif", Georgia, "Times New Roman", serif;
  --m-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; --m-mono: "JetBrains Mono", ui-monospace, monospace;
  --cream: var(--m-bg); --paper: var(--m-surface); --white: var(--m-surface); --plate: var(--m-bg);
  --navy: var(--m-ink); --muted: var(--m-muted); --line: var(--m-line); --line-strong: var(--m-line-2);
  --divider: var(--m-line); --tint: rgba(0,0,0,.035); --tint-strong: rgba(0,0,0,.06); --glass: rgba(255,255,255,.9);
  --orange: var(--m-blue); --orange-hover: var(--m-blue-2); --orange-ink: var(--m-blue);
  --neo-a: var(--m-blue); --neo-b: var(--m-blue); --neo-c: var(--m-blue); --neo-d: var(--m-blue);
  --neo-grad: linear-gradient(var(--m-blue), var(--m-blue)); --neo-glow: none;
  --shadow-soft: 0 1px 2px rgba(0,0,0,.04); --shadow-card: 0 1px 2px rgba(0,0,0,.04); --shadow-btn: none;
  --font-display: var(--m-serif); --radius-card: 14px; --rail-w: 252px; --ls-display: -.01em;
}
html[data-theme=dark] {
  --m-bg: #0B0B0C; --m-surface: #141416; --m-rail: #111113; --m-ink: #F4F4F5; --m-ink-2: #D4D4D8;
  --m-muted: #A1A1AA; --m-line: #27272A; --m-line-2: #3F3F46; --m-blue: #6B8DF0; --m-blue-2: #5276E6; --m-blue-tint: rgba(107,141,240,.14);
  --cream: var(--m-bg); --paper: var(--m-surface); --white: var(--m-surface); --plate: var(--m-bg);
  --navy: var(--m-ink); --muted: var(--m-muted); --line: var(--m-line); --line-strong: var(--m-line-2); --divider: var(--m-line);
  --orange: var(--m-blue); --orange-hover: var(--m-blue-2); --orange-ink: var(--m-blue); --glass: rgba(20,20,22,.9);
  --neo-a: var(--m-blue); --neo-b: var(--m-blue); --neo-c: var(--m-blue); --neo-d: var(--m-blue);
  --shadow-soft: none; --shadow-card: none;
}

html, body { background: var(--m-bg) !important; color: var(--m-ink); }
body, button, input, textarea, select { font-family: var(--m-sans); }

/* quiet the decoration */
.hero-canvas, .cursor-ring { display: none !important; }
.home__glass { background: transparent !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; padding-left: 0 !important; padding-right: 0 !important; }
.home__glass::before, .home__glass::after, .bento__card::before, .bento__card::after { display: none !important; }

/* ---------- rail (sidebar) ---------- */
.rail { background: transparent !important; border: 0 !important; padding: 10px !important; }
.rail__inner { background: var(--m-rail) !important; border: 1px solid var(--m-line) !important; border-radius: 16px !important; box-shadow: none !important; padding: 18px 12px 14px !important; align-items: stretch !important; text-align: left !important; gap: 0 !important; }
.rail__avatar { display: none !important; }
.rail__name { font-family: var(--m-sans) !important; font-size: 15px !important; font-weight: 650 !important; letter-spacing: -.01em !important; color: var(--m-ink) !important; margin: 0 8px 2px !important; text-align: left !important; justify-content: flex-start !important; }
.rail__handle { font-size: 12.5px !important; color: var(--m-muted) !important; margin: 0 8px 10px !important; text-align: left !important; }
.rail__status { align-self: flex-start !important; margin: 0 8px 14px !important; font-size: 11.5px !important; padding: 3px 9px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; color: var(--m-ink-2) !important; box-shadow: none !important; }
.rail__actions { order: 20; margin: 10px 8px 0 !important; justify-content: flex-start !important; }
.rail__socials { justify-content: flex-start !important; gap: 6px !important; }
.rail__social { width: 32px !important; height: 32px !important; background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; box-shadow: none !important; }
.resume-btn { order: 21; margin: 10px 8px 0 !important; align-self: stretch !important; justify-content: center !important; font-size: 13px !important; padding: 9px 12px !important; border-radius: 9px !important; background: var(--m-surface) !important; color: var(--m-ink) !important; border: 1px solid var(--m-line-2) !important; box-shadow: 0 2px 0 var(--m-line-2) !important; }
.resume-btn:hover { background: var(--m-bg) !important; }
.rail__nav { margin: 4px 0 0 !important; padding: 10px 0 0 !important; border-top: 1px solid var(--m-line) !important; border-bottom: 0 !important; }
.rail__link { font-size: 14px !important; font-weight: 500 !important; padding: 7px 10px !important; border-radius: 9px !important; color: var(--m-ink-2) !important; background: transparent !important; box-shadow: none !important; min-height: 0 !important; gap: 10px !important; }
.rail__link::before, .rail__link::after { display: none !important; }
.rail__link:hover { background: rgba(0,0,0,.045) !important; color: var(--m-ink) !important; }
html[data-theme=dark] .rail__link:hover { background: rgba(255,255,255,.06) !important; }
.rail__link.active { background: var(--m-blue-tint) !important; color: var(--m-blue) !important; }
.rail__link .ricon { width: 16px !important; height: 16px !important; opacity: .85; }
.rail__copy { order: 30; font-size: 11px !important; color: var(--m-muted) !important; margin: 14px 8px 0 !important; padding-top: 10px !important; border-top: 1px solid var(--m-line) !important; text-align: left !important; }

/* ---------- typography ---------- */
.pgrid__eyebrow, .home__tools-eyebrow, .apage .pgrid__eyebrow, .bento__kicker, .bento__doc-eyebrow {
  font-family: var(--m-mono) !important; font-size: 11.5px !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: var(--m-muted) !important; font-weight: 400 !important; }
.pgrid__eyebrow::before { display: none !important; }
.pgrid__title, .home__title, .apage__title, .home__tools-label, h1, h2 {
  font-family: var(--m-serif) !important; font-weight: 400 !important; letter-spacing: -.01em !important; color: var(--m-ink) !important; background: none !important; -webkit-text-fill-color: currentColor !important; }
.pgrid__title { font-size: clamp(44px, 5.4vw, 72px) !important; line-height: 1.02 !important; }
.home__title { font-size: clamp(54px, 7.4vw, 104px) !important; line-height: .98 !important; }
.home__accent, .m-blue { color: var(--m-blue) !important; background: none !important; -webkit-text-fill-color: var(--m-blue) !important; }
.apage__title { font-size: clamp(36px, 4vw, 52px) !important; }
.home__tools-label { font-size: 34px !important; }
.pgrid__lede, .home__lede { font-size: 17px !important; color: var(--m-ink-2) !important; line-height: 1.6 !important; max-width: 680px; }
h3, .apage__role-title, .bento__title { font-family: var(--m-sans) !important; letter-spacing: -.01em !important; }

/* ---------- buttons ---------- */
a[class*="btn"]:not(.resume-btn):not(.rail__social), button[class*="btn--primary"], .cta, .home__cta, .contact__submit, button[type=submit] {
  border-radius: 9px !important; }
.btn--primary, .btn-primary, .home__cta--primary, .contact__submit, button[type=submit], .cta--primary {
  background: var(--m-blue) !important; color: #fff !important; border: 0 !important; box-shadow: 0 3px 0 var(--m-blue-2) !important; }
.btn--primary:hover, .btn-primary:hover, .contact__submit:hover, button[type=submit]:hover { background: var(--m-blue-2) !important; }

/* ---------- cards ---------- */
.bento__card, .apage__glass, .agrid__bar, .apage__cert, .svc-card, .service-card, [class*="__card"]:not(.bento__card--build):not(.tools-marquee__tile) {
  background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; box-shadow: 0 1px 2px rgba(0,0,0,.03) !important; border-radius: 14px !important; }
.bento__card:hover { border-color: var(--m-line-2) !important; transform: none !important; box-shadow: 0 4px 16px -6px rgba(0,0,0,.08) !important; }
.bento__card--build { background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; box-shadow: none !important; }
.pgrid__hint { background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; color: var(--m-muted) !important; box-shadow: none !important; font-family: var(--m-mono) !important; font-size: 11px !important; }
.home__services li, .str-prev__chips i, .bento__doc-flow i { box-shadow: none !important; }
.home__services li { background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; color: var(--m-ink-2) !important; }
.tools-marquee__tile { background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; box-shadow: none !important; }
.apage__glass { padding: clamp(22px, 3vw, 36px) !important; }

/* ---------- About: photo top right, name in blue ---------- */
.agrid { position: relative; }
.agrid .pgrid__head { padding-right: 190px; }
.agrid__portrait { position: absolute !important; top: 6px !important; right: 0 !important; left: auto !important; bottom: auto !important;
  width: 150px !important; height: 150px !important; border-radius: 20px !important; overflow: hidden !important; margin: 0 !important;
  border: 1px solid var(--m-line) !important; box-shadow: 0 4px 0 var(--m-line-2) !important; background: #FFD400 !important; transform: none !important; z-index: 2; }
.agrid__portrait::before, .agrid__portrait::after { display: none !important; }
.agrid__portrait * { border-radius: 0 !important; box-shadow: none !important; transform: none !important; }
.agrid__portrait img { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: 50% 18% !important; position: static !important; }
.agrid__glass { display: block !important; }
.agrid__copy { max-width: 760px !important; }
.agrid__lead { font-family: var(--m-sans) !important; font-size: 20px !important; font-weight: 500 !important; line-height: 1.45 !important; color: var(--m-ink) !important; }
.agrid__lead span { color: var(--m-muted) !important; }
.agrid__cap { border-color: var(--m-line) !important; }
.agrid__link { color: var(--m-blue) !important; }
@media (max-width: 700px) {
  .agrid .pgrid__head { padding-right: 0; padding-top: 0; }
  .agrid__portrait { position: relative !important; top: 0 !important; width: 112px !important; height: 112px !important; margin: 0 0 18px !important; order: -1; }
  .agrid { display: flex !important; flex-direction: column; }
}

/* timeline + misc */
.apage__dates { font-family: var(--m-mono) !important; font-size: 11.5px !important; color: var(--m-muted) !important; letter-spacing: .04em !important; }
.apage__org { color: var(--m-ink-2) !important; }
.rail__theme, .theme-fab { background: var(--m-surface) !important; border: 1px solid var(--m-line) !important; box-shadow: none !important; }

/* small status bar at the bottom of the page (desktop) */
.m-statusbar { position: fixed; left: calc(var(--rail-w) + 0px); right: 0; bottom: 0; height: 28px; display: flex; align-items: center; gap: 18px; padding: 0 24px;
  font-family: var(--m-mono); font-size: 11.5px; color: var(--m-muted); background: var(--m-bg); border-top: 1px solid var(--m-line); z-index: 30; }
.m-statusbar b { font-weight: 400; color: var(--m-ink-2); }
.m-statusbar i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #22A15C; margin-right: 6px; font-style: normal; }
@media (max-width: 1099px) { .m-statusbar { display: none; } }

/* v10 layout fixes */
.shell__panel { background: var(--m-bg) !important; background-image: none !important; }
.shell__panel::before, .shell__panel::after { display: none !important; }
.shell__panel > section, .shell__panel > div > section, .about-page > section { max-width: 1080px !important; margin-left: auto !important; margin-right: auto !important; }
section.pgrid.agrid { position: relative !important; }
.agrid__glass { position: static !important; transform: none !important; contain: none !important; }
.rail__nav ul { gap: 2px !important; display: flex !important; flex-direction: column !important; }
.rail__nav li { margin: 0 !important; }
.rail__copy { display: block !important; padding-left: 0 !important; }
.rail__copy * { margin: 0 !important; }
.agrid__portrait { top: 60px !important; }
.agrid__copy { padding-left: 0 !important; padding-right: 0 !important; }
.sgrid__method { background: var(--m-surface) !important; background-image: none !important; border: 1px solid var(--m-line) !important; box-shadow: none !important; }
.sgrid__stage { background: var(--m-bg) !important; border: 1px solid var(--m-line) !important; box-shadow: none !important; }
.sgrid__stage-ghost { color: var(--m-line) !important; -webkit-text-stroke: 0 !important; opacity: .9; }
.sgrid__method-title { font-family: var(--m-serif) !important; font-weight: 400 !important; }
@media (max-width: 700px) {
  .agrid .pgrid__head { padding-right: 0 !important; padding-top: 96px !important; }
  .agrid__portrait { position: absolute !important; top: 0 !important; left: 0 !important; right: auto !important; width: 80px !important; height: 80px !important; margin: 0 !important; border-radius: 16px !important; box-shadow: 0 3px 0 var(--m-line-2) !important; }
  .agrid { display: block !important; }
}
@media (max-width: 700px) { .agrid__portrait { top: 18px !important; left: 20px !important; } .agrid .pgrid__head { padding-top: 112px !important; } }

/* v22: hide the old boot animation (it overlapped the Ask hero); replaced by the new intro */
.boot { display: none !important; }