/* Jacob Goldstein - professional home, September 2026 */
:root { --paper:#f8fafb; --paper-2:#eef2f4; --ink:#182c32; --ink-2:#465c62; --ink-3:#586e74; --rule:#dce4e6; --rule-2:#cbd8dc; --accent:#216b5b; --accent-soft:#e5f0eb; --amber:#775b28; --plum:#605277; }
body { background:var(--paper); }
body::before { display:none; }
.wrap,.topbar-inner { max-width:1180px; padding-left:2.5rem; padding-right:2.5rem; }
.topbar { position:relative; background:var(--paper); border-bottom:0; backdrop-filter:none; }
.topbar-inner { min-height:100px; align-items:center; justify-content:space-between; gap:1rem; border-bottom:1px solid var(--rule); }
.wordmark { font-family:var(--sans); font-size:1rem; letter-spacing:-.025em; color:var(--ink-3); }
.wordmark b { font-weight:600; color:var(--ink); }
.wordmark>span { margin:0 .45rem; color:#8da1a5; }
.topnav { margin-left:auto; gap:1.6rem; width:auto; }
.topnav a { color:var(--ink-2); font-family:var(--sans); font-size:.9375rem; text-transform:none; letter-spacing:0; gap:.35rem; }
.topnav a:last-child { color:var(--accent); }
.topnav a:hover { text-decoration:underline; text-underline-offset:.4em; }
.eyebrow { font-family:var(--mono); font-size:.75rem; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); margin-bottom:1.3rem; }
.home-hero { padding:5.5rem 0 5rem; border:0; }
.hero-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(250px,.75fr); gap:5rem; align-items:center; }
.hero-copy { min-width:0; }
.home-hero h1.name { font-size:clamp(4rem,7.8vw,6.5rem); line-height:.97; letter-spacing:-.065em; font-weight:400; max-width:none; }
.home-hero h1.name em { color:var(--accent); font-style:normal; }
.home-hero .deck { margin-top:1.9rem; max-width:41ch; font-size:1.125rem; line-height:1.8; }
.home-hero .deck strong { font-weight:500; color:var(--ink); }
.hero-ctas { margin-top:2rem; gap:1.8rem; }
.text-link { display:inline-flex; align-items:center; gap:.9rem; min-height:44px; font-size:.9375rem; font-weight:500; text-decoration:none; color:var(--ink-2); }
.text-link.primary,.text-link:hover { color:var(--accent); }
.text-link.primary { border-bottom:1px solid var(--accent); }
.text-link:hover { text-decoration:underline; text-underline-offset:.3em; }
.hero-portrait { margin:0; max-width:360px; width:100%; justify-self:end; padding-top:1rem; }
.hero-portrait img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:18px; }
.hero-portrait figcaption { display:flex; align-items:center; justify-content:center; gap:.5rem; font-size:.8125rem; color:var(--ink-3); margin-top:1rem; }
.role-dot { width:6px; height:6px; background:var(--accent); border-radius:50%; flex-shrink:0; }
section { padding:4.5rem 0; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:2rem; margin-bottom:2rem; }
.section-heading .eyebrow { margin-bottom:.6rem; }
.section-heading h2,.personal-about h2,.hello-section h2 { font:400 clamp(2rem,3.5vw,3.1rem)/1.13 var(--serif); letter-spacing:-.035em; color:var(--ink); }
.section-heading>p { font-size:1rem; color:var(--ink-3); max-width:25ch; margin-bottom:.3rem; }
.selected-work { padding-top:2rem; border-bottom:0; }
.featured-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.featured-project { background:#fff; border:1px solid var(--rule); border-radius:12px; padding:2rem; display:flex; flex-direction:column; min-width:0; }
.project-label { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:space-between; font-family:var(--mono); font-size:.75rem; line-height:1.6; color:var(--ink-3); }
.project-label>span:last-child { color:var(--accent); }
.featured-project h3 { font:400 clamp(1.8rem,3vw,2.6rem)/1.15 var(--serif); letter-spacing:-.035em; margin:2.1rem 0 1rem; }
.featured-project h3 a { display:flex; justify-content:space-between; align-items:center; gap:1rem; text-decoration:none; }
.featured-project h3 a>span { font-family:var(--sans); font-size:1.5rem; color:var(--accent); }
.featured-project h3 a:hover { color:var(--accent); }
.featured-project p { color:var(--ink-2); font-size:1rem; line-height:1.75; padding-bottom:2rem; }
.project-bottom { border-top:1px solid var(--rule); padding-top:1rem; margin-top:auto; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.8125rem; color:var(--ink-3); }
.project-bottom a { font-size:.875rem; color:var(--accent); text-decoration:none; padding:.15rem 0; }
.project-bottom a:hover { text-decoration:underline; }
.work-bridge { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; padding:1.4rem 1.6rem; margin-top:1.25rem; border:1px solid var(--rule); border-radius:10px; text-decoration:none; color:var(--ink-2); font-size:.9375rem; }
.work-bridge strong { color:var(--ink); font-weight:500; }
.work-bridge>span:last-child { font-size:1.5rem; color:var(--accent); }
.work-bridge:hover { background:var(--accent-soft); }
.field-notes { border:0; padding-top:2.5rem; }
details>summary { cursor:pointer; list-style:none; }
details>summary::-webkit-details-marker { display:none; }
.field-note { border-top:1px solid var(--rule-2); }
.field-note>summary { display:flex; align-items:center; gap:2rem; padding:1.65rem 0; }
.note-number { flex:0 0 75px; }
.note-id { color:var(--accent); font-size:.8125rem; }
.note-summary { flex:1; min-width:0; }
.note-summary strong { display:block; font:400 1.35rem/1.4 var(--serif); letter-spacing:-.015em; color:var(--ink); }
.note-summary>span { display:block; margin-top:.35rem; font-size:.875rem; color:var(--ink-3); }
.expand-label { font:300 1.8rem/1 var(--sans); width:30px; text-align:center; color:var(--accent); }
details[open]>.field-note>summary .expand-label { transform:rotate(45deg); }
.field-note[open]>summary .expand-label { transform:rotate(45deg); }
.field-note .note-body { padding:0 0 1.8rem 107px; gap:1.1rem; }
.note-row .k { font-size:.75rem; }
.note-row p { font-size:1rem; }
.latest-note { display:flex; align-items:center; gap:2rem; text-decoration:none; padding:1.65rem 0; border-top:1px solid var(--rule-2); border-bottom:1px solid var(--rule-2); }
.latest-note>span:first-child { flex:0 0 75px; font:400 .8125rem var(--mono); color:var(--accent); }
.latest-note strong { flex:1; font:400 1.35rem/1.4 var(--serif); }
.latest-note>span:last-child { font-size:1.5rem; color:var(--accent); width:30px; text-align:center; }
summary:hover .note-summary strong,.latest-note:hover strong { color:var(--accent); }
.personal-about { background:#eef3f2; border:0; padding:4.5rem 0; }
.personal-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:5.5rem; align-items:center; }
.personal-about h2 { margin-bottom:1.8rem; }
.personal-about p:not(.eyebrow) { font-size:1rem; color:var(--ink-2); margin-bottom:1.15rem; max-width:56ch; }
.personal-about .text-link { margin-top:.6rem; }
.off-clock { margin:0; }
.off-clock img { display:block; width:100%; height:auto; max-height:470px; object-fit:cover; border-radius:12px; }
.off-clock figcaption { font:400 .8125rem var(--mono); color:var(--ink-3); margin-top:1rem; }
.background-details { margin-top:2rem; }
.background-details>summary,.project-history summary,.infrastructure summary { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.6rem 0; border-bottom:1px solid var(--rule); font-size:1rem; font-weight:500; }
.details-meta { color:var(--ink-3); font-size:.8125rem; font-weight:400; }
.details-meta span { margin-left:1rem; font-size:1.2rem; }
.background-content { padding:1rem 0 2rem; }
.background-content .wrap,.infrastructure-content .wrap { padding-left:0; padding-right:0; }
.background-content section { padding:2rem 0; }
.background-content .sec-head { margin-bottom:1rem; }
.background-content .sec-title { font-size:1.5rem; }
.background-content .xp { padding:1.5rem 0; }
.background-content .edu,.background-content .cap-row { background:transparent; }
.project-history { padding:0; border:0; }
.archive-content { padding:2rem 0; }
.proj { background:#fff; border:1px solid var(--rule); border-radius:10px; }
.proj:hover { box-shadow:none; transform:none; border-color:var(--accent); }
.proj .tags { font-size:.8125rem; letter-spacing:0; }
.proj p { font-size:1rem; }
.hello-section { border:0; padding:5rem 0; }
.hello-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.hello-section p:not(.eyebrow) { font-size:1rem; color:var(--ink-2); max-width:42ch; margin-bottom:1.5rem; }
.hello-email { display:inline-flex; gap:.8rem; color:var(--accent); text-decoration:none; border-bottom:1px solid var(--accent); padding:.5rem 0; font-size:clamp(.95rem,1.7vw,1.15rem); overflow-wrap:anywhere; }
.social-links { display:flex; gap:1.4rem; margin-top:1.5rem; }
.social-links a { color:var(--ink-3); text-decoration:none; font-size:.9375rem; min-height:44px; display:flex; align-items:center; }
.social-links a:hover { color:var(--accent); text-decoration:underline; }
.infrastructure>details>summary { border-top:1px solid var(--rule); }
.infrastructure-content #colophon { padding:2rem 0; }
.infrastructure-content .server-watch { margin-top:0; }
.site-footer { align-items:center; font-family:var(--sans); font-size:.875rem; letter-spacing:0; padding:2rem 0; }
.site-footer>div { display:flex; gap:1.5rem; }
.site-footer a { color:var(--ink-3); min-height:44px; display:inline-flex; align-items:center; }
.readout { border-radius:8px; font-size:.8125rem; letter-spacing:0; gap:.5rem 1.25rem; }
.readout span { white-space:normal; }
.colo { background:#fff; border-radius:8px; }
.colo h3 { font-size:.875rem; letter-spacing:0; text-transform:none; font-family:var(--sans); }
.colo-foot,.watch-note { font-size:.875rem; }
.watch-metric dt,.watch-metric dd span,.server-watch .watch-state,.readout-foot { font-size:.8125rem; }
.portfolio-projects .hero { padding:5rem 0 4rem; }
.portfolio-projects .kicker { font-size:.75rem; color:var(--ink-3); letter-spacing:.09em; }
.portfolio-projects .kicker::before { display:none; }
.portfolio-projects h1 { max-width:none; font-size:clamp(3rem,7vw,5.7rem); letter-spacing:-.055em; }
.title-period { color:var(--accent); }
.portfolio-projects .deck { font-size:1.125rem; max-width:64ch; }
.portfolio-projects section { padding:3.5rem 0; }
.portfolio-projects .sec-title { font-size:2rem; }
.portfolio-projects .p { background:#fff; border:1px solid var(--rule); border-radius:12px; overflow:hidden; margin-bottom:1.8rem; }
.portfolio-projects .p-head { background:#fff; padding:1.65rem 2rem; border-bottom:1px solid var(--rule); }
.portfolio-projects .p-head h3 { font-size:1.65rem; }
.portfolio-projects .p-head .when { font-family:var(--sans); letter-spacing:0; font-size:.875rem; }
.portfolio-projects .p-body { padding:1.6rem 2rem 2rem; }
.portfolio-projects .p-body>p { max-width:78ch; line-height:1.75; }
.portfolio-projects .stamp { border:0; border-radius:5px; font-size:.75rem; letter-spacing:.04em; }
.portfolio-projects .lnk { font-family:var(--sans); letter-spacing:0; text-transform:none; font-size:.9375rem; border-color:var(--rule-2); border-radius:5px; min-height:44px; }
.portfolio-projects .lnk.go { border-color:var(--accent); }
.portfolio-projects .metric dd small { font-size:.8125rem; }
.portfolio-projects .note { border:0; background:none; margin-bottom:0; }
.portfolio-projects table.res { font-size:1rem; }
.portfolio-projects table.res th { font-size:.8125rem; }
.portfolio-resume .topnav { width:auto; }
section[id] { scroll-margin-top:1.5rem; }
@media (max-width:960px) {
  .wrap,.topbar-inner { padding-left:1.5rem; padding-right:1.5rem; }
  .hero-layout { gap:2.5rem; grid-template-columns:1.35fr .8fr; }
  .topnav { gap:1.2rem; }
  .personal-grid { gap:3rem; }
  .featured-project { padding:1.6rem; }
  .hello-grid { gap:2rem; }
}
@media (max-width:700px) {
  .topbar-inner { min-height:0; padding-top:1.25rem; padding-bottom:1rem; gap:.75rem; }
  .wordmark { font-size:.9375rem; }
  .topnav { width:100%; margin-left:0; gap:1.35rem; justify-content:flex-start; }
  .topnav a,.topnav a:not(.cta) { display:inline-flex; font-size:.9375rem; min-height:44px; }
  .home-hero { padding:2.8rem 0 3.2rem; }
  .hero-layout { grid-template-columns:1fr; gap:2.5rem; }
  .home-hero h1.name { font-size:clamp(3.5rem,13vw,5.6rem); letter-spacing:-.055em; }
  .eyebrow { font-size:.75rem; line-height:1.8; }
  .home-hero .deck { font-size:1.0625rem; }
  .hero-portrait { width:min(100%,330px); max-width:none; justify-self:start; padding:0; }
  .hero-portrait img { aspect-ratio:1.2; object-position:50% 40%; border-radius:12px; }
  .hero-portrait figcaption { justify-content:flex-start; }
  .section-heading { align-items:start; gap:1rem; flex-direction:column; }
  .section-heading>p { max-width:none; }
  .featured-grid,.personal-grid,.hello-grid { grid-template-columns:1fr; }
  .featured-project h3 { margin-top:1.6rem; }
  .selected-work { padding-top:1rem; padding-bottom:2rem; }
  .field-notes { padding-top:2rem; padding-bottom:3rem; }
  .field-note>summary,.latest-note { gap:1rem; padding:1.4rem 0; }
  .note-number,.latest-note>span:first-child { flex-basis:56px; }
  .note-summary strong,.latest-note strong { font-size:1.125rem; }
  .note-summary>span { font-size:.8125rem; }
  .field-note .note-body { padding:0 0 1.5rem; }
  .personal-about { padding:3rem 0; }
  .personal-grid { gap:2rem; }
  .off-clock { max-width:400px; }
  .background-details>summary,.project-history summary,.infrastructure summary { align-items:start; flex-direction:column; gap:.3rem; }
  .hello-section { padding:3.5rem 0; }
  .hello-email { font-size:1rem; }
  .site-footer { gap:.5rem; }
  .site-footer>div { width:100%; }
  .portfolio-projects .hero { padding:3rem 0; }
  .portfolio-projects h1 { font-size:clamp(2.75rem,11vw,4.5rem); }
  .portfolio-projects .p-head,.portfolio-projects .p-body { padding:1.3rem; }
  .portfolio-projects .p-head h3 { font-size:1.4rem; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print { details:not([open]) { display:none; } .hero-portrait,.topbar,.hello-section,.site-footer { display:none; } }