/* Jennie Healy Website — warm, scholarly theme. No external dependencies. */
:root {
  --accent: #7a4b2a;
  --bg: #faf7f2;
  --surface: #ffffff;
  --ink: #2b2622;
  --muted: #7a7068;
  --line: #e8e0d5;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --radius: 10px;
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#1d1a17; --surface:#262220; --ink:#ede6dd; --muted:#a69a8e; --line:#3a342f; }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin:0; background:var(--bg); color:var(--ink); font:17px/1.65 var(--sans); }
img { max-width:100%; display:block; }
a { color:var(--accent); }
h1, h2, h3 { font-family:var(--serif); font-weight:600; line-height:1.2; margin:0 0 .5em; }
h1 { font-size:clamp(2rem, 4vw, 2.9rem); letter-spacing:-.01em; }
h2 { font-size:1.35rem; }
h3 { font-size:1.1rem; }
code { background:var(--line); padding:.1em .35em; border-radius:4px; font-size:.9em; }
.wrap { max-width:1060px; margin:0 auto; padding:0 20px; }
.muted { color:var(--muted); }
.eyebrow { text-transform:uppercase; letter-spacing:.14em; font-size:.75rem; color:var(--accent); font-weight:600; margin:0 0 .6rem; }
.lead { font-size:1.12rem; color:var(--muted); max-width:62ch; }

/* Header / nav */
.site-header { border-bottom:1px solid var(--line); background:var(--bg); position:sticky; top:0; z-index:10; }
.header-inner { display:flex; align-items:center; justify-content:space-between; min-height:76px; }
.brand { text-decoration:none; color:var(--ink); display:flex; flex-direction:column; }
.brand-name { font-family:var(--serif); font-size:1.4rem; font-weight:600; }
.brand-tag { font-size:.78rem; color:var(--muted); letter-spacing:.04em; }
.site-nav { display:flex; gap:28px; }
.site-nav a { color:var(--ink); text-decoration:none; font-size:.95rem; padding:6px 0; border-bottom:2px solid transparent; }
.site-nav a.active { border-color:var(--menu-active, var(--accent)); color:var(--menu-active, var(--accent)); }
.site-nav a:hover, .site-nav a:focus-visible { border-color:var(--menu-hover, var(--accent)); color:var(--menu-hover, var(--accent)); }
.nav-toggle { display:none; background:none; border:0; padding:8px; cursor:pointer; }
.nav-toggle span { display:block; width:22px; height:2px; background:var(--ink); margin:5px 0; }

main { padding:56px 20px 80px; }
.page-head { margin-bottom:40px; }

/* Buttons */
.btn-row { display:flex; gap:12px; flex-wrap:wrap; margin-top:28px; }
.btn { display:inline-block; background:var(--accent); color:#fff; border:2px solid var(--accent); border-radius:999px;
       padding:.65em 1.5em; font:600 .95rem var(--sans); text-decoration:none; cursor:pointer; }
.btn:hover { filter:brightness(1.1); }
.btn-ghost { background:transparent; color:var(--accent); }

/* About */
.hero { display:grid; grid-template-columns:1.4fr 1fr; gap:56px; align-items:center; }
.hero-photo { margin:0; }
.hero-photo img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:180px 180px var(--radius) var(--radius);
                  border:1px solid var(--line); }
.about-body { display:grid; grid-template-columns:1.4fr 1fr; gap:56px; margin-top:72px; padding-top:48px; border-top:1px solid var(--line); }
.prose p { margin:0 0 1.2em; }
.facts { margin:0; display:grid; gap:18px; }
.facts div { border-left:3px solid var(--accent); padding-left:14px; }
.facts dt { font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); }
.facts dd { margin:0; font-family:var(--serif); font-size:1.08rem; }

/* Resume */
.resume-grid { display:grid; grid-template-columns:1.7fr 1fr; gap:56px; }
.block { margin-bottom:44px; }
.block > h2 { padding-bottom:10px; border-bottom:1px solid var(--line); margin-bottom:22px; }
.entry { margin-bottom:26px; }
.entry-head { display:flex; justify-content:space-between; gap:16px; align-items:baseline; flex-wrap:wrap; }
.entry h3 { margin:0; }
.dates { font-size:.85rem; color:var(--muted); white-space:nowrap; }
.org { margin:.15em 0 .4em; color:var(--accent); font-style:italic; font-family:var(--serif); }
.entry ul { margin:.3em 0 0; padding-left:1.2em; }
.chips { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:8px; }
.chips li { background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:.3em .9em; font-size:.88rem; }
.plain { list-style:none; padding:0; margin:0; }
.plain li { padding:.45em 0; border-bottom:1px solid var(--line); }
.plain li:last-child { border-bottom:0; }

/* Gallery */
/* Résumé: flexible sections */
.resume { max-width:860px; }
.resume-list { margin:0; padding-left:1.2em; }
.resume-list li { margin-bottom:.35em; }
.resume-section .prose p { margin:0 0 1em; }
.entry .entry-links { list-style:none; margin:.5em 0 0; padding:0; }
.entry-links li { margin:.2em 0; }
.entry-links a { text-decoration:none; border-bottom:1px solid currentColor; padding-bottom:1px; }
.entry-links a::after { content:" \2197"; font-size:.85em; }
.entry-links a:hover { opacity:.75; }
.entry-photos { display:flex; flex-wrap:wrap; gap:10px; margin:.8em 0 .2em; }
.entry-photos { align-items:flex-start; }
.rthumb { max-width:100%; padding:0; border:1px solid var(--line); border-radius:6px; overflow:hidden; cursor:zoom-in;
  background:var(--surface); box-shadow:0 1px 3px rgba(0,0,0,.08); transition:transform .2s, box-shadow .2s; line-height:0; }
.rthumb:hover { transform:translateY(-2px); box-shadow:0 6px 14px rgba(0,0,0,.15); }
.rthumb:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.rthumb img { width:100%; height:auto; display:block; }
#lightbox img { max-width:90vw; max-height:80vh; height:auto; object-fit:contain; }

/* Fun Facts page */
.funfacts { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:22px; max-width:960px; }
.funfact { position:relative; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  padding:24px 24px 18px 70px; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.funfact-num { position:absolute; left:20px; top:20px; width:34px; height:34px; border-radius:50%; background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:600; }
.funfact h2 { font-size:1.2rem; margin:0 0 .4em; }
.funfact p { margin:0 0 .7em; }
@media (max-width:720px) { .funfacts { grid-template-columns:1fr; } }

/* Gallery: polaroid-style frames, three per row */
.gallery { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:44px 36px; padding:8px 4px 20px; }
.polaroid { margin:0; background:#fff; padding:14px 14px 0; border-radius:2px;
  box-shadow:0 1px 2px rgba(0,0,0,.08), 0 8px 22px rgba(0,0,0,.12);
  transform:rotate(var(--tilt, 0deg)); transition:transform .3s ease, box-shadow .3s ease; }
.polaroid:nth-child(3n+1) { --tilt:-1.6deg; }
.polaroid:nth-child(3n+2) { --tilt:1.1deg; }
.polaroid:nth-child(3n)   { --tilt:-0.6deg; }
.polaroid:hover { transform:rotate(0deg) translateY(-4px) scale(1.02); box-shadow:0 2px 4px rgba(0,0,0,.08), 0 14px 32px rgba(0,0,0,.18); }
.tile { display:block; width:100%; padding:0; border:0; background:#e9e4dc; cursor:zoom-in; aspect-ratio:1/1; overflow:hidden; }
.tile img { width:100%; height:100%; object-fit:cover; }
.tile:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.polaroid figcaption { min-height:62px; padding:12px 6px 14px; display:flex; align-items:center; justify-content:center;
  text-align:center; color:#3a332d; font-family:var(--serif); font-style:italic; font-size:1.02rem; line-height:1.3; overflow-wrap:anywhere; }
@media (max-width: 900px) { .gallery { grid-template-columns:repeat(2, minmax(0, 1fr)); gap:36px 28px; } }
@media (max-width: 520px) { .gallery { grid-template-columns:1fr; gap:32px; padding:8px 18px 20px; } }
.lightbox { position:fixed; inset:0; background:rgba(20,16,12,.92); display:flex; align-items:center; justify-content:center; z-index:50; }
.lightbox[hidden] { display:none; }
.lightbox figure { margin:0; max-width:90vw; text-align:center; color:#eee; }
.lightbox img { max-height:80vh; margin:0 auto; border-radius:6px; }
.lightbox figcaption { margin-top:12px; font-size:.95rem; }
.lightbox button { position:absolute; background:none; border:0; color:#fff; font-size:2.6rem; cursor:pointer; padding:12px; }
.lb-close { top:10px; right:16px; } .lb-prev { left:10px; } .lb-next { right:10px; }

/* Contact */
.contact-grid { display:grid; grid-template-columns:1.6fr 1fr; gap:32px; align-items:start; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:28px; }
.form label { display:block; font-size:.9rem; font-weight:600; margin-bottom:16px; }
.form input, .form textarea { display:block; width:100%; margin-top:6px; padding:.7em .85em; font:inherit; font-weight:400;
  color:var(--ink); background:var(--bg); border:1px solid var(--line); border-radius:8px; }
.form input:focus, .form textarea:focus { outline:2px solid var(--accent); outline-offset:1px; border-color:transparent; }
.row2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.hp { position:absolute; left:-9999px; }
.alert { padding:12px 16px; border-radius:8px; margin-bottom:18px; font-size:.95rem; }
.alert.ok { background:#e6f2e8; color:#25572f; }
.alert.err { background:#f8e6e3; color:#8a2a1c; }
.contact-info li { display:flex; flex-direction:column; }
.contact-info .muted { font-size:.75rem; text-transform:uppercase; letter-spacing:.1em; }

/* Footer */
.site-footer { border-top:1px solid var(--line); padding:26px 0; font-size:.88rem; color:var(--muted); }
.footer-inner { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; }
.footer-links a { margin-left:18px; }
.version { margin-left:6px; opacity:.75; font-size:.8rem; }
.hero-photo img { object-position:center 30%; }

/* Mobile */
@media (max-width: 820px) {
  .nav-toggle { display:block; }
  .site-nav { display:none; position:absolute; top:76px; left:0; right:0; flex-direction:column; gap:0;
              background:var(--bg); border-bottom:1px solid var(--line); padding:8px 20px; }
  .site-nav.open { display:flex; }
  .site-nav a { padding:12px 0; border-bottom:1px solid var(--line); }
  .hero, .about-body, .resume-grid, .contact-grid { grid-template-columns:1fr; gap:36px; }
  .hero-photo { max-width:340px; order:-1; }
  .row2 { grid-template-columns:1fr; gap:0; }
  main { padding-top:36px; }
}
