:root { --paper:#f5f4ee; --white:#fffef9; --ink:#232e2b; --muted:#5c6860; --accent:#173d37; --line:#d0d5cb; --wash:#e9ece2; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.7 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
::selection { background:#d6dfb8; color:var(--accent); }
a { color:inherit; text-underline-offset:5px; text-decoration-thickness:1px; }
a:hover { color:#46643b; }
a:focus-visible,summary:focus-visible,button:focus-visible { outline:3px solid #9a5b12; outline-offset:6px; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p,figure { margin:0; }
p + p { margin-top:16px; }
.wrap { width:min(1160px,calc(100% - 88px)); margin-inline:auto; }
.skip { position:absolute; top:-100px; left:20px; z-index:10; padding:10px 20px; background:white; }
.skip:focus { top:8px; }
.site-header { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:25px 0; border-bottom:1px solid var(--line); }
.brand { display:flex; gap:12px; align-items:center; font-weight:650; text-decoration:none; font-size:15px; }
.monogram { font:21px/1 Georgia,serif; border:1px solid var(--accent); width:40px; height:40px; display:grid; place-items:center; letter-spacing:-2px; padding-right:2px; color:var(--accent); }
nav { display:flex; gap:29px; font-size:13px; }
nav a { text-decoration:none; }
nav a:hover { text-decoration:underline; }
.eyebrow,.label,.tools { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
.eyebrow,.label { font-size:11px; font-weight:400; line-height:1.7; text-transform:uppercase; letter-spacing:1.5px; color:var(--muted); }
.hero { padding:82px 0 90px; display:grid; grid-template-columns:1.5fr .8fr; gap:100px; align-items:end; }
h1 { font:400 clamp(76px,8.5vw,116px)/.94 Georgia,"Times New Roman",serif; letter-spacing:-5.5px; margin:29px 0 30px; }
h1 em { color:var(--accent); font-weight:400; }
.intro { font-size:clamp(20px,2.1vw,26px); line-height:1.45; letter-spacing:-.55px; }
.hero-description { color:var(--muted); max-width:530px; font-size:15px; line-height:1.8; }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:27px; margin-top:29px; font-size:13px; }
.button { background:var(--accent); color:var(--white); display:inline-flex; align-items:center; justify-content:space-between; gap:28px; padding:13px 21px; text-decoration:none; border:1px solid var(--accent); }
.button:hover { background:#2b5148; color:white; }
.text-link { font-size:13px; font-weight:550; }
.hero-aside { border-top:2px solid var(--accent); padding-top:22px; margin-bottom:4px; }
.availability { display:flex; align-items:center; gap:9px; color:var(--accent); }
.availability > span { width:6px; height:6px; background:var(--accent); border-radius:50%; }
.hero-aside h2 { font:400 29px/1.2 Georgia,serif; letter-spacing:-.5px; margin:20px 0 14px; max-width:280px; }
.hero-aside p:not(.label) { font-size:14px; color:var(--muted); }
.hero-facts { margin:25px 0 20px; padding-top:22px; border-top:1px solid var(--line); display:grid; grid-template-columns:1.4fr 1fr; gap:16px; }
dt { font-size:11px; color:var(--muted); }
dd { margin:6px 0 0; font-size:13px; line-height:1.6; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; padding:33px 0 32px; border-top:1px solid var(--ink); }
.section-heading h2 { font:400 clamp(32px,4vw,45px)/1.2 Georgia,serif; letter-spacing:-1px; margin-top:9px; }
.section-heading > p { font-size:12px; color:var(--muted); padding-bottom:4px; }
.project { display:grid; grid-template-columns:1fr 1fr; gap:75px; padding:48px 0 50px; border-top:1px solid var(--line); }
.project h3,.lab-project h3 { font:400 34px/1.2 Georgia,serif; letter-spacing:-.6px; margin:9px 0 20px; }
.project-copy > p:not(.label):not(.tools):not(.project-intro),.lab-project p:not(.label):not(.tools) { color:var(--muted); font-size:15px; }
.project-copy > .project-intro { font-size:20px; line-height:1.45; letter-spacing:-.3px; margin-bottom:19px; }
.repair-counts { display:flex; gap:48px; margin:26px 0; }
.repair-counts > div { display:flex; flex-direction:column-reverse; }
.repair-counts dd { font:400 39px/1 Georgia,serif; margin:0 0 9px; }
.repair-counts dt { font-size:11px; }
.tools { font-size:11px; color:var(--muted); line-height:1.9; margin:23px 0 20px; }
.project-links { display:flex; gap:25px; flex-wrap:wrap; font-size:13px; font-weight:550; }
.bench-photo { width:100%; aspect-ratio:1.5; object-fit:cover; border:1px solid var(--line); }
figcaption { color:var(--muted); font-size:11px; line-height:1.7; margin-top:10px; }
.case-note { margin-top:25px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
summary { list-style:none; display:flex; justify-content:space-between; align-items:center; gap:20px; cursor:pointer; padding:17px 0; font-size:12px; font-weight:550; }
summary::-webkit-details-marker { display:none; }
summary > span { font-size:20px; font-weight:300; flex-shrink:0; }
details[open] summary > span { transform:rotate(45deg); }
.case-body { padding:0 0 22px; font-size:13px; color:var(--muted); }
.case-body .text-link { display:inline-block; margin-top:16px; color:var(--ink); }
.simulation-link { display:block; text-decoration:none; background:#0e1922; border:1px solid #25343c; }
.simulation-link img { width:100%; aspect-ratio:1.6; object-fit:contain; padding:18px; }
.image-action { display:flex; justify-content:space-between; border-top:1px solid #38434a; color:#e0e8e3; font-size:11px; padding:12px 18px; }
.simulation-link:hover .image-action { background:#1b2f37; }
.results-panel { background:var(--wash); border:1px solid #d4dbca; padding:32px; }
.test-result { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:35px 0 28px; }
.result-number { display:block; font:400 clamp(38px,4vw,57px)/1.1 Georgia,serif; letter-spacing:-2px; }
.result-number span { font-size:23px; color:var(--muted); letter-spacing:-1px; }
.result-label { display:block; font-size:11px; color:var(--muted); margin-top:10px; }
.result-arrow { color:#65785c; font-size:22px; padding-bottom:23px; }
.results-panel > p:last-child { font-size:12px; line-height:1.8; color:var(--muted); border-top:1px solid #c9d1bf; padding-top:20px; }
.lab-project { display:grid; grid-template-columns:1fr 1fr; gap:75px; padding:39px 0 50px; border-top:1px solid var(--line); }
.lab-project h3 { max-width:360px; }
.lab-project .tools { margin-bottom:0; }
.background { margin-top:30px; padding-bottom:65px; }
.background-grid { display:grid; grid-template-columns:1fr 1fr; gap:75px; padding:17px 0 40px; }
.education h3 { font:400 28px/1.25 Georgia,serif; letter-spacing:-.5px; margin:10px 0 12px; }
.education > p:not(.label) { font-size:14px; color:var(--muted); }
.education > .text-link { display:inline-block; margin-top:25px; }
.experience-list article + article { border-top:1px solid var(--line); padding-top:23px; margin-top:23px; }
.experience-heading { display:flex; justify-content:space-between; align-items:baseline; gap:20px; }
.experience-heading h3 { font-size:16px; font-weight:600; }
.experience-heading span { font:10px/1.5 ui-monospace,monospace; color:var(--muted); }
.experience-list .role { font-size:12px; margin:4px 0 10px; color:var(--accent); }
.experience-list p:not(.role) { font-size:13px; color:var(--muted); }
.tool-list { display:grid; grid-template-columns:repeat(4,1fr); gap:25px; border-top:1px solid var(--line); margin:0; padding-top:26px; }
.tool-list dt { color:var(--ink); font-size:12px; font-weight:600; }
.tool-list dd { font-size:12px; color:var(--muted); }
.contact { background:var(--accent); color:var(--white); padding:58px 0 63px; }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:75px; }
.contact .eyebrow { color:#b7c9ba; }
.contact h2 { font:400 clamp(32px,4vw,43px)/1.2 Georgia,serif; letter-spacing:-1px; margin:15px 0 18px; }
.contact p:not(.eyebrow) { font-size:13px; color:#d0dccf; }
.contact-email { display:flex; justify-content:space-between; align-items:baseline; gap:12px; font-size:clamp(15px,1.7vw,20px); text-decoration:none; border-bottom:1px solid #728b7b; padding-bottom:15px; overflow-wrap:anywhere; }
.contact-links > div { display:flex; gap:30px; font-size:12px; margin-top:22px; }
.contact a:hover { color:#d2e1aa; }
.contact a:focus-visible { outline-color:#e2d393; }
.site-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:27px 0; font-size:10px; color:var(--muted); }
.site-footer a { text-decoration:none; }
.site-footer a:hover { text-decoration:underline; }
@media(max-width:1000px) {
  .hero { gap:55px; grid-template-columns:1.4fr .85fr; padding-top:66px; }
  .hero-facts { grid-template-columns:1fr; gap:14px; }
  .project,.lab-project,.background-grid,.contact-grid { gap:40px; }
  .results-panel { padding:24px; }
  .project h3,.lab-project h3 { font-size:30px; }
}
@media(max-width:720px) {
  .wrap { width:calc(100% - 40px); }
  .site-header { flex-wrap:wrap; gap:18px; padding:20px 0; }
  .brand { font-size:14px; }
  nav { gap:22px; font-size:12px; }
  .hero { grid-template-columns:1fr; gap:44px; padding:47px 0 50px; }
  h1 { font-size:clamp(76px,17vw,105px); letter-spacing:-4px; margin-top:24px; }
  .hero-description { font-size:14px; max-width:480px; }
  .hero-aside { display:grid; grid-template-columns:1fr 1fr; column-gap:25px; padding-top:20px; }
  .hero-aside .availability { grid-column:1 / -1; }
  .hero-aside h2 { grid-column:1; margin-bottom:12px; font-size:27px; }
  .hero-aside > p:not(.label) { grid-column:1; font-size:12px; }
  .hero-facts { grid-column:2; grid-row:2 / 5; margin:20px 0 0; border:0; padding:0; align-content:start; gap:18px; }
  .hero-aside > .text-link { grid-column:1; margin-top:17px; }
  .section-heading { align-items:start; padding:29px 0; }
  .section-heading > p { display:none; }
  .section-heading h2 { font-size:32px; }
  .project,.lab-project,.background-grid,.contact-grid { grid-template-columns:1fr; gap:30px; }
  .project { padding:32px 0 36px; }
  .project h3 { font-size:33px; }
  .project-copy > .project-intro { font-size:19px; }
  .project-copy > p:not(.label):not(.tools):not(.project-intro) { font-size:14px; }
  .repair-counts { margin:23px 0; }
  .bench-photo { aspect-ratio:1.55; }
  .results-panel { padding:26px; }
  .test-result { justify-content:start; gap:30px; margin-top:28px; }
  .result-number { font-size:50px; }
  .lab-project { padding:32px 0 35px; gap:0; }
  .lab-project h3 { max-width:100%; }
  .background { margin-top:12px; padding-bottom:40px; }
  .background-grid { padding-top:5px; gap:35px; }
  .tool-list { grid-template-columns:1fr 1fr; gap:25px; }
  .contact { padding:40px 0 45px; }
  .contact h2 { font-size:34px; }
  .contact-email { font-size:18px; }
  .site-footer { gap:16px; flex-wrap:wrap; }
}
@media(max-width:380px) {
  nav { gap:18px; }
  .hero-aside { column-gap:18px; }
  .hero-aside h2 { font-size:24px; }
  .hero-aside dd { font-size:12px; }
  .desktop-break { display:none; }
  .test-result { gap:18px; }
  .result-number { font-size:42px; }
  .contact-email { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
