/* =========================================================
   Micah Berkley · résumé.micahberkley.com
   "Forward Deployed" · mission-control console x editorial
   ========================================================= */

:root{
  --serif:'Fraunces',Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;

  --maxw:1140px;
  --gutter:clamp(20px,5vw,64px);
  --r:14px;
  --ease:cubic-bezier(.22,.61,.36,1);

  /* per-view accent (base hue, tuned for dark) */
  --accent:#6aa6d8;
}

/* ---------- THEME: DARK (default) ---------- */
html[data-theme="dark"]{
  --bg:#09131c;
  --bg-2:#0d1a26;
  --bg-3:#102536;
  --panel:rgba(255,255,255,.025);
  --ink:#e9eff5;
  --ink-2:#a9bccc;
  --ink-3:#6c8295;
  --hair:rgba(255,255,255,.09);
  --hair-2:rgba(255,255,255,.05);
  --shadow:0 24px 60px -28px rgba(0,0,0,.8);
  --link:var(--accent);
  --accent-soft:color-mix(in srgb,var(--accent) 16%,transparent);
  --accent-line:color-mix(in srgb,var(--accent) 60%,transparent);
  --grid-ink:rgba(255,255,255,.035);
  color-scheme:dark;
}
/* ---------- THEME: LIGHT (warm paper) ---------- */
html[data-theme="light"]{
  --bg:#f1ebdd;
  --bg-2:#faf6ec;
  --bg-3:#eae2d0;
  --panel:rgba(20,40,55,.018);
  --ink:#15242f;
  --ink-2:#465562;
  --ink-3:#7c8893;
  --hair:rgba(20,40,55,.14);
  --hair-2:rgba(20,40,55,.07);
  --shadow:0 22px 50px -30px rgba(31,45,58,.45);
  --link:color-mix(in srgb,var(--accent) 72%,#000 28%);
  --accent-soft:color-mix(in srgb,var(--accent) 20%,transparent);
  --accent-line:color-mix(in srgb,var(--accent) 70%,#000 6%);
  --grid-ink:rgba(20,40,55,.05);
  color-scheme:light;
}

/* ---------- per-view accent hues ---------- */
html[data-view="ats"]       {--accent:#6aa6d8;}
html[data-view="leadgen"]   {--accent:#54e08a;}
html[data-view="automation"]{--accent:#37cfe6;}
html[data-view="fde"]       {--accent:#ff7a45;}
html[data-view="applied"]   {--accent:#b48cff;}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--sans);font-weight:400;font-size:16.5px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  transition:background .5s var(--ease),color .4s var(--ease);
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:var(--link);text-decoration:none;}
a:hover{text-decoration:underline;text-underline-offset:3px;}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);}
.mono{font-family:var(--mono);font-weight:500;letter-spacing:.02em;}
.muted{color:var(--ink-3);}

.skip{position:fixed;left:12px;top:-60px;z-index:200;background:var(--accent);color:#04121d;
  padding:10px 16px;border-radius:8px;font-weight:600;transition:top .2s;}
.skip:focus{top:12px;}

:focus-visible{outline:2.5px solid var(--accent);outline-offset:3px;border-radius:4px;}

/* ============ STATUS BAR ============ */
.statusbar{position:sticky;top:0;z-index:60;
  background:color-mix(in srgb,var(--bg) 82%,transparent);
  backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);
  border-bottom:1px solid var(--hair);}
.statusbar__in{max-width:var(--maxw);margin-inline:auto;padding:0 var(--gutter);height:52px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;}
.statusbar__id{display:flex;align-items:center;gap:11px;font-size:12.5px;min-width:0;}
.statusbar__id .mono{font-size:12.5px;letter-spacing:.12em;color:var(--ink);}
.statusbar__sub{color:var(--accent)!important;border-left:1px solid var(--hair);padding-left:11px;}
.dot{width:8px;height:8px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 0 0 var(--accent-line);animation:pulse 2.6s var(--ease) infinite;flex:none;}
@keyframes pulse{0%{box-shadow:0 0 0 0 var(--accent-line);}70%{box-shadow:0 0 0 7px transparent;}100%{box-shadow:0 0 0 0 transparent;}}
.statusbar__right{display:flex;align-items:center;gap:8px;}
.statusbar__clock{font-size:12px;color:var(--ink-3);letter-spacing:.1em;}
.iconbtn{appearance:none;background:transparent;border:1px solid var(--hair);color:var(--ink-2);
  height:34px;min-width:34px;padding:0 9px;border-radius:9px;cursor:pointer;display:inline-flex;
  align-items:center;justify-content:center;gap:6px;font-size:12px;transition:.2s var(--ease);}
.iconbtn:hover{border-color:var(--accent-line);color:var(--ink);background:var(--panel);}
.iconbtn .mono{font-size:11.5px;}
.theme-toggle svg{fill:none;stroke:currentColor;stroke-width:1.7;}
.theme-toggle .ic-moon{display:none;}
html[data-theme="light"] .theme-toggle .ic-sun{display:none;}
html[data-theme="light"] .theme-toggle .ic-moon{display:block;}

/* ============ HERO ============ */
.hero{position:relative;overflow:hidden;padding-top:clamp(48px,8vw,96px);padding-bottom:clamp(34px,5vw,60px);
  border-bottom:1px solid var(--hair);}
.hero__grid{position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--grid-ink) 1px,transparent 1px),linear-gradient(90deg,var(--grid-ink) 1px,transparent 1px);
  background-size:46px 46px;mask-image:radial-gradient(120% 90% at 16% 0%,#000 0%,transparent 72%);
  -webkit-mask-image:radial-gradient(120% 90% at 16% 0%,#000 0%,transparent 72%);}
.hero__glow{position:absolute;top:-30%;left:-8%;width:60vw;height:60vw;max-width:760px;max-height:760px;
  pointer-events:none;border-radius:50%;filter:blur(40px);opacity:.5;
  background:radial-gradient(circle at 50% 50%,var(--accent-soft),transparent 62%);
  transition:background .6s var(--ease);}
.hero__in{position:relative;}
.kicker{color:var(--accent);font-size:12.5px;letter-spacing:.18em;margin:0 0 18px;
  text-transform:uppercase;}
.name{font-family:var(--serif);font-optical-sizing:auto;font-weight:600;
  font-size:clamp(48px,11vw,118px);line-height:.92;letter-spacing:-.02em;margin:0;
  font-variation-settings:'SOFT' 28,'WONK' 1;}
.hero__headline{font-size:clamp(18px,2.5vw,25px);line-height:1.45;max-width:30ch;color:var(--ink);
  margin:22px 0 0;font-weight:400;letter-spacing:-.01em;}
.hero__headline strong{font-weight:600;}

.instruments{list-style:none;margin:38px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--hair);
  border:1px solid var(--hair);border-radius:var(--r);overflow:hidden;}
.inst{background:var(--bg);padding:18px 18px 16px;display:flex;flex-direction:column;gap:7px;
  transition:background .3s var(--ease);}
.inst__n{font-family:var(--serif);font-weight:600;font-size:clamp(26px,3.4vw,38px);line-height:1;
  letter-spacing:-.02em;color:var(--ink);font-variation-settings:'SOFT' 0,'WONK' 0;}
.inst__l{font-size:11px;line-height:1.35;color:var(--ink-3);letter-spacing:.04em;text-transform:uppercase;}

.cta{display:flex;flex-wrap:wrap;gap:11px;margin-top:34px;}
.btn{appearance:none;font-family:var(--sans);font-size:14.5px;font-weight:500;cursor:pointer;
  border:1px solid var(--hair);background:var(--panel);color:var(--ink);padding:11px 18px;border-radius:11px;
  display:inline-flex;align-items:center;gap:8px;transition:.2s var(--ease);text-decoration:none;}
.btn:hover{border-color:var(--accent-line);background:color-mix(in srgb,var(--accent) 8%,var(--panel));
  transform:translateY(-1px);text-decoration:none;}
.btn--primary{background:var(--accent);color:#06141f;border-color:var(--accent);font-weight:600;}
html[data-theme="light"] .btn--primary{color:#fff;}
.btn--primary:hover{background:color-mix(in srgb,var(--accent) 88%,#fff);filter:none;}
.btn svg{flex:none;}

/* ============ LENSES (view selector) ============ */
.lenses{position:sticky;top:52px;z-index:50;padding:18px 0 14px;
  background:color-mix(in srgb,var(--bg) 90%,transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--hair);}
.lenses__head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:13px;}
.lenses__eyebrow{font-size:11.5px;letter-spacing:.2em;color:var(--accent);}
.lenses__hint{font-size:13px;color:var(--ink-3);line-height:1.4;}
.lenses__rail{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;}
.lens{position:relative;text-align:left;cursor:pointer;font-family:var(--sans);
  background:var(--panel);border:1px solid var(--hair);border-radius:12px;padding:13px 14px;
  display:flex;flex-direction:column;gap:3px;color:var(--ink);transition:.22s var(--ease);overflow:hidden;}
.lens__k{font-size:11px;color:var(--ink-3);letter-spacing:.1em;}
.lens__t{font-size:15px;font-weight:600;letter-spacing:-.01em;}
.lens__d{font-size:12px;color:var(--ink-3);}
.lens:hover{border-color:var(--accent-line);transform:translateY(-2px);}
.lens::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2.5px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);}
.lens.is-active{border-color:var(--accent-line);background:color-mix(in srgb,var(--accent) 9%,var(--panel));}
.lens.is-active::after{transform:scaleX(1);}
.lens.is-active .lens__k{color:var(--accent);}

/* ============ BLOCKS / LAYOUT ============ */
main{padding-top:clamp(38px,6vw,72px);padding-bottom:40px;}
.block{display:grid;grid-template-columns:200px 1fr;gap:clamp(20px,4vw,56px);
  padding:clamp(30px,4vw,46px) 0;border-top:1px solid var(--hair);}
.block:first-child{border-top:0;}
.block__rail{position:relative;}
.h2{font-family:var(--serif);font-weight:500;font-size:clamp(24px,3vw,32px);line-height:1.05;
  letter-spacing:-.02em;margin:0;position:sticky;top:150px;display:flex;flex-direction:column;gap:6px;
  font-variation-settings:'SOFT' 14;}
.h2__n{font-family:var(--mono);font-size:12px;color:var(--accent);letter-spacing:.14em;font-weight:500;}

/* ---- Summary ---- */
.summary p{margin:0 0 16px;font-size:clamp(16px,1.7vw,18.5px);line-height:1.62;color:var(--ink-2);max-width:64ch;}
.summary p:first-child{color:var(--ink);font-size:clamp(17px,1.9vw,20px);}
.summary p:last-child{margin-bottom:0;}
.ibuild{font-family:var(--mono);font-size:.86em;color:var(--accent);letter-spacing:.02em;white-space:nowrap;}

/* ---- Timeline ---- */
.timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:30px;}
.role{position:relative;padding-left:26px;}
.role__line{position:absolute;left:5px;top:8px;bottom:-30px;width:1px;background:var(--hair);}
.role:last-child .role__line{display:none;}
.role::before{content:"";position:absolute;left:0;top:7px;width:11px;height:11px;border-radius:50%;
  background:var(--bg);border:2px solid var(--accent-line);transition:.3s var(--ease);z-index:1;}
.role:hover::before{background:var(--accent);box-shadow:0 0 0 5px var(--accent-soft);}
.role__head{margin-bottom:11px;}
.role__co{font-family:var(--serif);font-weight:600;font-size:20px;letter-spacing:-.01em;
  font-variation-settings:'SOFT' 10;}
.role__via{font-family:var(--sans);font-weight:400;font-size:14px;color:var(--ink-3);font-style:normal;}
.role__title{font-size:15px;font-weight:500;color:var(--accent);margin-top:1px;}
html[data-theme="light"] .role__title{color:var(--link);}
.role__note{color:var(--ink-3);font-weight:400;}
.role__meta{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:5px;font-size:12.5px;color:var(--ink-3);}
.role__meta .mono{font-size:12px;letter-spacing:.04em;}
.role__loc{position:relative;padding-left:15px;}
.role__loc::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:4px;height:4px;border-radius:50%;background:var(--ink-3);}
.role__bullets{margin:12px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px;}
.role__bullets li{position:relative;padding-left:20px;font-size:15.2px;line-height:1.55;color:var(--ink-2);max-width:70ch;}
.role__bullets li::before{content:"";position:absolute;left:2px;top:.62em;width:6px;height:1.5px;background:var(--accent);opacity:.85;}
.role__bullets li strong{color:var(--ink);font-weight:600;}
.role--compact .role__head{margin-bottom:0;}

/* ---- Skills ---- */
.skills{display:grid;grid-template-columns:1fr 1fr;gap:26px 36px;}
.skillgroup__t{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);
  margin:0 0 13px;padding-bottom:9px;border-bottom:1px solid var(--hair);}
.chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;}
.chips li{font-size:13px;color:var(--ink-2);background:var(--panel);border:1px solid var(--hair);
  padding:6px 12px;border-radius:999px;transition:.2s var(--ease);}
.chips li:hover{border-color:var(--accent-line);color:var(--ink);}

/* ---- Recognition / cols ---- */
.cols{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;}
.col__t{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);
  margin:0 0 13px;padding-bottom:9px;border-bottom:1px solid var(--hair);}
.plainlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.plainlist li{font-size:14.5px;line-height:1.5;color:var(--ink-2);}
.plainlist em{color:var(--ink);font-style:italic;}
.plainlist strong{color:var(--ink);}

/* ============ FOOTER ============ */
.foot{border-top:1px solid var(--hair);padding:46px 0 30px;background:var(--bg-2);}
.foot__in{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start;}
.foot__name{font-family:var(--serif);font-weight:600;font-size:24px;margin:0;font-variation-settings:'SOFT' 18;}
.foot__t{font-size:11px;letter-spacing:.14em;color:var(--ink-3);margin:6px 0 0;}
.foot__links{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14px;}
.foot__links a{color:var(--ink-2);}
.foot__links a:hover{color:var(--accent);}
.foot__fine{margin-top:30px;font-size:11.5px;color:var(--accent);letter-spacing:.18em;}

/* ============ COMMAND PALETTE ============ */
.cmdk{position:fixed;inset:0;z-index:120;display:flex;align-items:flex-start;justify-content:center;padding-top:14vh;}
.cmdk[hidden]{display:none;}
.cmdk__scrim{position:absolute;inset:0;background:rgba(2,8,14,.6);backdrop-filter:blur(4px);
  animation:fade .2s var(--ease);}
.cmdk__panel{position:relative;width:min(520px,92vw);background:var(--bg-2);border:1px solid var(--hair);
  border-radius:16px;box-shadow:var(--shadow);overflow:hidden;animation:pop .24s var(--ease);}
.cmdk__head{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;
  border-bottom:1px solid var(--hair);font-size:11px;letter-spacing:.16em;color:var(--ink-3);}
.cmdk__list{list-style:none;margin:0;padding:8px;}
.cmdk__item{display:flex;align-items:center;gap:13px;padding:12px 14px;border-radius:10px;cursor:pointer;
  color:var(--ink);transition:background .15s;}
.cmdk__item .ck{font-family:var(--mono);font-size:11px;color:var(--ink-3);width:18px;}
.cmdk__item .cd{font-size:12.5px;color:var(--ink-3);margin-left:auto;}
.cmdk__item .ct{font-weight:500;}
.cmdk__item:hover,.cmdk__item.is-cur{background:var(--accent-soft);}
.cmdk__item .swatch{width:9px;height:9px;border-radius:50%;}
@keyframes fade{from{opacity:0;}to{opacity:1;}}
@keyframes pop{from{opacity:0;transform:translateY(-8px) scale(.98);}to{opacity:1;transform:none;}}

/* ============ TOAST ============ */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);z-index:130;
  background:var(--bg-3);color:var(--ink);border:1px solid var(--accent-line);padding:12px 20px;
  border-radius:12px;font-size:14px;box-shadow:var(--shadow);opacity:0;transition:.3s var(--ease);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast[hidden]{display:none;}

/* ============ ENTRANCE ANIMATION ============ */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(14px);animation:rise .7s var(--ease) forwards;}
  @keyframes rise{to{opacity:1;transform:none;}}
  .v-anim{animation:vfade .45s var(--ease);}
  @keyframes vfade{from{opacity:.2;transform:translateY(6px);}to{opacity:1;transform:none;}}
}

/* ============ VIEW FILTERING ============ */
/* ATS view shows everything (complete résumé). Focused views hide non-matching. */
html[data-view="leadgen"] .role:not([data-views~="leadgen"]),
html[data-view="leadgen"] .role__bullets>li:not([data-views~="leadgen"]),
html[data-view="leadgen"] .skillgroup:not([data-views~="leadgen"]){display:none;}

html[data-view="automation"] .role:not([data-views~="automation"]),
html[data-view="automation"] .role__bullets>li:not([data-views~="automation"]),
html[data-view="automation"] .skillgroup:not([data-views~="automation"]){display:none;}

html[data-view="fde"] .role:not([data-views~="fde"]),
html[data-view="fde"] .role__bullets>li:not([data-views~="fde"]),
html[data-view="fde"] .skillgroup:not([data-views~="fde"]){display:none;}

html[data-view="applied"] .role:not([data-views~="applied"]),
html[data-view="applied"] .role__bullets>li:not([data-views~="applied"]),
html[data-view="applied"] .skillgroup:not([data-views~="applied"]){display:none;}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .block{grid-template-columns:1fr;gap:18px;}
  .h2{position:static;flex-direction:row;align-items:baseline;gap:12px;}
  .lenses__rail{grid-template-columns:repeat(5,minmax(132px,1fr));overflow-x:auto;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:4px;
    margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter);}
  .lens{scroll-snap-align:start;}
  .skills{grid-template-columns:1fr;}
  .cols{grid-template-columns:1fr;gap:24px;}
}
@media (max-width:620px){
  body{font-size:16px;}
  .instruments{grid-template-columns:1fr 1fr;}
  .statusbar__sub{display:none;}
  .lenses{top:52px;}
  .hero__headline{max-width:none;}
  .foot__in{flex-direction:column;}
}
@media (max-width:380px){
  .instruments{grid-template-columns:1fr;}
}

/* ============ PRINT / PDF ============ */
@media print{
  @page{size:Letter;margin:14mm 14mm;}
  html,body{background:#fff!important;color:#10212c!important;font-size:10.6pt;}
  .statusbar,.lenses,.hero__grid,.hero__glow,.cta,.cmdk,.toast,.skip,.role__line,.iconbtn,.foot__fine{display:none!important;}
  .hero{border:0;padding:0 0 8pt;}
  .hero__in{position:static;}
  .kicker{color:#000!important;font-size:8pt;letter-spacing:.14em;margin-bottom:4pt;}
  .name{font-size:30pt;line-height:1;color:#10212c!important;}
  .hero__headline{font-size:11.5pt;max-width:none;margin-top:6pt;color:#28323a!important;}
  .instruments{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:0;margin-top:10pt;
    border-top:1.5pt solid var(--accent);padding-top:8pt;}
  .inst{background:#fff!important;padding:0 10pt 0 0;}
  .inst__n{font-size:15pt;color:#10212c!important;}
  .inst__l{font-size:7pt;color:#5a6772!important;}
  main{padding:0;}
  .block{grid-template-columns:1fr;gap:0;border-top:0;padding:9pt 0 0;break-inside:auto;}
  .block__rail{margin-bottom:5pt;}
  .h2{position:static;font-size:14pt;flex-direction:row;gap:8pt;color:#10212c!important;
    border-bottom:1pt solid #c9d2da;padding-bottom:3pt;break-after:avoid;}
  .role__head{break-after:avoid;}
  .h2__n{color:var(--accent)!important;}
  .summary p{color:#28323a!important;font-size:10.4pt;max-width:none;margin-bottom:7pt;}
  .summary p:first-child{font-size:11pt;color:#10212c!important;}
  .ibuild{color:#10212c!important;}
  .timeline{gap:11pt;}
  .role{padding-left:0;break-inside:avoid;}
  .role::before{display:none;}
  .role__co{font-size:13pt;color:#10212c!important;}
  .role__title{color:#1b2c38!important;font-size:10.4pt;}
  .role__via,.role__note,.role__meta,.role__loc::before{color:#5a6772!important;}
  .role__bullets li{color:#28323a!important;font-size:10pt;max-width:none;}
  .role__bullets li::before{background:var(--accent)!important;}
  .role__bullets li strong{color:#10212c!important;}
  .skills{gap:9pt 26pt;}
  .skillgroup__t,.col__t{color:#5a6772!important;border-color:#c9d2da;}
  .chips li{border:0;background:#eef1f4!important;color:#28323a!important;padding:2pt 7pt;font-size:8.6pt;}
  .cols{gap:18pt;}
  .plainlist li,.plainlist em,.plainlist strong{color:#28323a!important;}
  .foot{background:#fff!important;border-top:1pt solid #c9d2da;padding:8pt 0 0;}
  .foot__in{padding:0;}
  .foot__name{font-size:13pt;color:#10212c!important;}
  .foot__t,.foot__links a{color:#5a6772!important;}
  a{color:#10212c!important;text-decoration:none;}
  .wrap{max-width:none;padding:0;}
}