@import url('https://fonts.googleapis.com/css2?family=Sorts+Mill+Goudy:ital@0;1&family=Inter:wght@400;500;600&display=swap');

:root { color-scheme: light; --paper:#faf9f6; --ink:#4a322e; --muted:#6f6258; --accent:#a3a397; --blue:#002fa7; --line:#dedbd3; --serif:'Sorts Mill Goudy',Georgia,serif; --sans:Inter,Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:28px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.75; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-underline-offset:5px; }
a:hover { color:var(--blue); text-decoration:underline; }
a:focus-visible { outline:2px solid var(--blue); outline-offset:5px; border-radius:2px; }
::selection { background:var(--blue); color:#fff; }
.page-width { width:min(1160px,calc(100% - 96px)); margin-inline:auto; }
.skip-link { position:fixed; top:-100px; left:8px; z-index:3; padding:10px 18px; background:var(--paper); }
.skip-link:focus { top:8px; }
.site-header { min-height:108px; display:flex; justify-content:space-between; align-items:center; gap:24px; }
.wordmark { font-family:var(--serif); font-size:20px; letter-spacing:.07em; background:var(--accent); padding:5px 19px; text-decoration:none; white-space:nowrap; }
nav { display:flex; gap:30px; align-items:center; }
nav a { font-size:13px; font-weight:500; text-decoration:none; display:inline-flex; align-items:center; gap:7px; min-height:44px; }
.hero { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:88px; align-items:center; padding-block:65px 102px; }
.eyebrow { font-size:11px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; margin:0 0 16px; color:var(--muted); }
h1,h2,h3,h4 { font-family:var(--serif); font-weight:400; }
h1 { font-size:clamp(58px,6vw,84px); line-height:1.08; margin:0 0 24px; letter-spacing:-.045em; }
.hero-lead { font-family:var(--serif); font-size:25px; line-height:1.5; margin:0 0 18px; }
.hero-bio { color:var(--muted); font-size:15px; line-height:1.85; margin:0; }
.hero-links { display:flex; flex-wrap:wrap; align-items:center; gap:25px; margin-top:28px; font-size:13px; }
.button { display:inline-flex; gap:26px; min-height:48px; align-items:center; background:var(--blue); color:#fff; padding:10px 20px; text-decoration:none; }
.button:hover { background:#002582; color:#fff; text-decoration:none; }
.text-link { min-height:44px; display:inline-flex; align-items:center; gap:9px; }
.portrait { margin:0; }
.portrait-frame { aspect-ratio:4/5; overflow:hidden; background:#d0ccd0; }
.portrait img { display:block; width:100%; height:100%; object-fit:cover; object-position:50% 40%; }
.portrait figcaption { display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 16px; font-size:10px; letter-spacing:.02em; color:var(--muted); padding-top:12px; }
.section-heading { padding-top:12px; margin-bottom:58px; }
h2 { font-size:clamp(36px,4vw,52px); line-height:1.17; letter-spacing:-.025em; margin:0; }
.experience-item { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:84px; padding-bottom:76px; }
.experience-item + .experience-item { padding-top:24px; }
.index { display:block; font-family:var(--serif); color:var(--muted); font-size:16px; margin-bottom:10px; }
.experience-meta h3 { font-size:32px; line-height:1.2; margin:0 0 10px; }
.experience-meta p { margin:0; color:var(--muted); font-size:13px; }
.experience-meta .role { font-weight:600; color:var(--ink); }
.experience-meta .date { font-size:12px; margin-top:3px; }
.specialty { display:block; font-size:11px; line-height:1.6; margin-top:16px; color:var(--muted); }
.experience-copy { max-width:68ch; }
.experience-copy h4 { font-size:30px; line-height:1.3; margin:0 0 22px; letter-spacing:-.012em; }
.experience-copy p { margin:0 0 16px; color:#5b5049; }
.experience-copy p:last-child { margin-bottom:0; }
.experience-copy .outcome { background:#efeee7; padding:18px 22px; margin-top:24px; color:var(--ink); font-size:15px; }
strong { font-weight:600; }
.project-video { margin:28px 0 8px; }
.project-video video { display:block; width:100%; aspect-ratio:16/9; background:#171719; object-fit:contain; }
.project-video video:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
.project-video figcaption { font-size:11px; line-height:1.6; color:var(--muted); margin-top:10px; }
.project-links { display:flex; flex-wrap:wrap; gap:4px 24px; }
.project-links a { display:inline-flex; align-items:center; gap:8px; min-height:44px; font-size:13px; color:var(--blue); }
.education { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:84px; padding-block:20px 76px; }
.education .section-heading { padding:0; margin:0; }
.education-entry + .education-entry { margin-top:36px; }
.education-entry h3 { font-size:28px; line-height:1.3; margin:0 0 8px; }
.education-entry p { margin:0 0 6px; }
.education-school,.education-date { font-size:13px; color:var(--muted); }
.education-degree { font-size:15px; }
.education-entry .education-detail { font-size:14px; color:var(--muted); margin-top:12px; }
.contact { display:grid; grid-template-columns:1fr 1fr; gap:80px; padding:36px 0 70px; }
.contact p:not(.eyebrow) { font-size:14px; max-width:39ch; color:var(--muted); }
.contact-links { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:6px; }
.contact-links a { display:inline-flex; align-items:center; gap:20px; min-height:44px; font-size:15px; overflow-wrap:anywhere; }
footer { display:flex; justify-content:space-between; gap:20px; padding-block:20px 30px; font-size:11px; color:var(--muted); }
footer a { display:flex; align-items:center; min-height:44px; text-decoration:none; }
footer span { align-self:center; }
@media (max-width:1000px) {
  .page-width { width:calc(100% - 64px); }
  .hero { gap:40px; padding-block:45px 80px; }
  .experience-item { gap:42px; }
  .education { gap:42px; }
  .hero-lead { font-size:22px; }
  .contact { gap:40px; }
}
@media (max-width:700px) {
  .page-width { width:calc(100% - 40px); }
  .site-header { min-height:85px; gap:12px; flex-wrap:wrap; padding-block:16px; }
  .wordmark { font-size:16px; padding:5px 12px; }
  nav { gap:12px; width:100%; justify-content:space-between; }
  nav a { font-size:12px; }
  .hero { grid-template-columns:1fr; gap:30px; padding-block:30px 60px; }
  h1 { font-size:62px; margin-bottom:20px; }
  .hero-lead { font-size:23px; }
  .hero-bio { font-size:15px; }
  .hero-links { margin-top:23px; }
  .portrait { display:grid; grid-template-columns:84px 1fr; align-items:center; gap:18px; }
  .portrait-frame { width:84px; aspect-ratio:1; }
  .portrait img { object-position:center; transform:scale(1.8); transform-origin:50% 23%; }
  .portrait figcaption { display:flex; flex-direction:column; justify-content:center; font-size:11px; gap:4px; padding:0; }
  .section-heading { margin-bottom:36px; }
  .experience-item { grid-template-columns:1fr; gap:22px; padding-bottom:52px; }
  .experience-item + .experience-item { padding-top:10px; }
  .experience-meta { position:relative; padding-left:36px; }
  .index { position:absolute; left:0; top:1px; margin:0; }
  .experience-meta h3 { font-size:27px; margin-bottom:6px; }
  .specialty { margin-top:8px; }
  .experience-copy h4 { font-size:28px; margin-bottom:17px; }
  .experience-copy p { font-size:16px; }
  .experience-copy .outcome { font-size:15px; padding:16px 18px; margin-top:20px; }
  .contact { grid-template-columns:1fr; gap:14px; padding-block:20px 36px; }
  .education { grid-template-columns:1fr; gap:28px; padding-block:10px 48px; }
  .education-entry h3 { font-size:26px; }
  .contact-links a { font-size:14px; }
  footer { padding-bottom:20px; }
}
@media (max-width:380px) {
  .site-header { align-items:flex-start; }
  nav { width:100%; justify-content:space-between; }
  h1 { font-size:56px; }
  .hero { padding-top:18px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print {
  body { background:white; }
  .page-width { width:100%; }
  nav,.hero-links,.skip-link,footer { display:none; }
  .hero { padding:20px 0 36px; gap:30px; }
  .experience-item { break-inside:avoid; padding-bottom:32px; gap:30px; }
  a { text-decoration:none; }
}

.personal-work,.beyond-work { padding-block:20px 70px; }
.personal-project { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:52px; align-items:center; }
.personal-project h3,.photography-intro h3 { font-size:32px; line-height:1.25; margin:0 0 16px; }
.personal-project p,.photography-intro p { color:var(--muted); margin:0 0 16px; }
.personal-project .eyebrow { font-size:11px; }
.personal-project .project-note { font-size:12px; line-height:1.7; }
.workflow-preview { display:block; padding:30px; background:#efeee7; text-decoration:none; }
.workflow-preview:hover { text-decoration:none; }
.workflow-preview>.eyebrow { display:block; }
.workflow-step { display:flex; gap:20px; padding-block:15px; }
.workflow-step>span:first-child { color:var(--blue); font-family:var(--serif); font-size:24px; }
.workflow-step strong,.workflow-step small { display:block; }
.workflow-step small { color:var(--muted); font-size:12px; margin-top:4px; }
.design-project img { display:block; width:100%; height:auto; }
.photography-intro { margin-top:60px; max-width:58ch; }
.photo-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:24px; }
.photo-grid figure { margin:0; }
.photo-grid img { display:block; width:100%; height:auto; }
.photo-grid figcaption { font-size:12px; color:var(--muted); margin-top:10px; }
@media (max-width:700px) {
  nav { flex-wrap:wrap; gap:4px 16px; justify-content:flex-start; }
  .personal-work,.beyond-work { padding-block:10px 48px; }
  .personal-project { grid-template-columns:1fr; gap:26px; }
  .personal-project h3,.photography-intro h3 { font-size:28px; }
  .workflow-preview { padding:22px; }
  .photo-grid { grid-template-columns:1fr; gap:24px; }
  .photography-intro { margin-top:42px; }
}

.focus-areas { padding-bottom:60px; }
.focus-areas ul { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 40px; }
.focus-areas li { font-size:14px; font-weight:500; }
.focus-areas li::before { content:'•'; color:var(--blue); margin-right:12px; }
@media(max-width:700px) { .focus-areas { padding-bottom:42px; } .focus-areas ul { grid-template-columns:1fr; gap:10px; } }
