/* Targeted refinements of Argon's supplied drafting-table design. */
header.site-header { position:fixed; top:0; left:0; right:0; z-index:100; background:var(--paper); backdrop-filter:none; -webkit-backdrop-filter:none; }
body { transition:none; }
.theme-changing *, .theme-changing *::before, .theme-changing *::after { transition:none !important; }
:root { --ink-3:#626a74; --ink-2:#484f58; --accent:#b9362a; }
html[data-theme="dark"] { --ink-3:#a5afc0; --ink-2:#bec6d2; }
.scroll-progress { width:100%; transform:scaleX(0); transform-origin:left; transition:transform .1s linear; }

/* ── PROFILE LAYOUT: flex-based column matching, no fragile calc() ── */
.profile-layout { align-items:stretch; }
.profile-layout .prose {
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  max-width:none;
  gap:22px;
}
.profile-layout .prose p { margin:0; line-height:1.82; }

.education {
  align-self:stretch;
  display:flex;
  flex-direction:column;
}
.education > h3 { flex-shrink:0; }
.education > dl {
  flex:1 1 auto;
  display:grid;
  gap:18px;
  align-content:space-between;
}

/* Justified prose across wide-viewport blocks (paragraphs, timeline bullets, postscript, dialog body) */
@media (min-width:961px) {
  .profile-layout .prose p,
  .tl-list li,
  .project-postscript > div > p:not(.drawing-title),
  .dialog-content p {
    text-align:justify;
    text-align-last:left;
    hyphens:auto;
  }
}

/* ── ACCESSIBILITY SIZING ── */
.case-fallbacks article h2 { font-size:1.6rem; }
.close-button,.scene-actions button,.text-control,.scene-model summary,.icon-btn,.nav-link { min-height:44px; }
.icon-btn { min-width:44px; }
.model-fields input,.model-fields select { min-height:44px; }

/* ── FORM ── */
.enquiry-note { font-size:.9rem; color:var(--ink-2); }
.form-status { min-height:2.5em; }

/* ── VIGNETTES ── */
.vignette-picture svg { height:320px; }
.truss-vignette .vignette-picture svg { height:360px; }
.frame-vignette .vignette-picture svg { height:300px; }
.vignette-picture svg .scene-callout-text { font:500 11.5px var(--font-body); fill:var(--ink); letter-spacing:0; }
.speech-bubble[data-speaker="1"] .scene-callout-box { stroke:var(--blue); }
.speech-tail { fill:var(--paper-2); stroke:var(--accent); stroke-width:1.2; }
.speech-bubble[data-speaker="1"] .speech-tail { stroke:var(--blue); }
.speech-bubble { pointer-events:none; }
.scene-callout-box { fill:var(--paper-2); }
html:not(.has-scenes) :is(.scene-actions,.scene-model) { display:none; }
.scene-phase { text-transform:none; letter-spacing:0; font-family:var(--font-body); line-height:1.45; }
.vignette-picture svg text { font-size:11px; letter-spacing:0; }

/* ── MODEL PANELS ── */
.model-note { font-size:.8rem; line-height:1.6; }
.model-fields label { font-size:.85rem; }
.model-fields select { font-size:16px; }

/* ── PROSE / TIMELINE / TITLES ── */
.prose,.tl-list { color:var(--ink-2); }
.tl-list li { font-size:1rem; }
.section-title { text-wrap:balance; }

/* ── DIALOG / REVEAL ── */
.has-dialogs .case-fallbacks { display:none; }
.js-motion [data-reveal] { opacity:1; transform:none; transition:none; }
#project-dialog { overscroll-behavior:contain; }
.dialog-content :is(p,li) { font-size:1rem; }
.dialog-content ul { list-style:disc; padding-left:1.3em; margin-top:14px; }
.dialog-content li { line-height:1.7; margin-bottom:8px; }
.dialog-top { position:sticky; top:0; z-index:2; background:var(--paper-2); padding-top:10px; }

/* ── FIELD DRILLS: 3-up gallery for the small scenes ── */
.field-drills {
  scroll-margin-top:var(--header-h);
  margin-top:4rem;
  padding-top:3rem;
  border-top:1px solid var(--line);
}
.field-drills > .section-head--wide { margin-left:auto; margin-right:auto; }
.drills-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:22px;
  margin-top:2.5rem;
}
.drills-grid > .engineering-vignette { height:100%; }
.drills-grid .vignette-copy { display:flex; flex:1; flex-direction:column; }
.drills-grid .vignette-copy > p:not(.drawing-title) { flex:1; max-width:none; }
.drills-grid .model-fields { grid-template-columns:1fr; }
.drills-grid .drawing-title { min-height:3.3em; }
.drills-grid .scene-actions { margin-top:16px; }
.drills-grid:has(details[open]) { align-items:start; }
.drills-grid:has(details[open]) > .engineering-vignette { height:auto; }

/* Paired columns share their outer edges; expanding a model restores natural flow. */
@media (min-width:961px) {
  .hero-grid,.skills-layout,.project-postscript,.contact-grid { align-items:stretch; }
  .hero .vignette-picture,.skills-layout .vignette-picture { display:flex; align-items:center; flex:1; }
  .hero .vignette-copy,.skills-layout .vignette-copy { margin-top:auto; }
  .skills-layout:has(details[open]),.project-postscript:has(details[open]),.hero-grid:has(details[open]) { align-items:start; }
  .project-postscript > div:first-child { display:flex; flex-direction:column; }
  .project-postscript:not(:has(details[open])) > div:first-child > p:last-child { margin-top:auto; padding-top:20px; }
  .contact-info { display:flex; flex-direction:column; justify-content:space-between; gap:24px; }
  .contact-note { margin-top:0; }
}

@media (min-width:721px) and (max-width:1199px) {
  .drills-grid { grid-template-columns:1fr; }
  .drills-grid > .engineering-vignette { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:stretch; gap:22px; height:auto; }
  .drills-grid .vignette-picture { align-self:start; margin:0; border-bottom:0; }
  .drills-grid .vignette-picture svg { height:280px; }
  .drills-grid .drawing-title { min-height:0; }
}

.shoe-vignette .vignette-picture svg,
.jacking-vignette .vignette-picture svg,
.clash-vignette .vignette-picture svg { height:260px; }

@media (max-width:1100px) and (min-width:961px) {
  .drills-grid { gap:16px; }
  .shoe-vignette .vignette-picture svg,
  .jacking-vignette .vignette-picture svg,
  .clash-vignette .vignette-picture svg { height:260px; }
}

/* ── MOBILE ── */
@media (max-width:960px) {
  .nav { position:fixed; inset:var(--header-h) 0 auto; display:flex; flex-direction:column; align-items:stretch; background:var(--paper); padding:16px var(--pad) 22px; transform:translateY(-130%); visibility:hidden; border-bottom:1px solid var(--line); }
  .nav.is-open { transform:none; visibility:visible; }
  .nav-link { padding:10px; font-size:1rem; }
  .menu-btn { display:flex; }

  /* Reset education stack: block flow, natural height */
  .education { display:block; }
  .education > dl { display:grid; height:auto; gap:22px; align-content:normal; }
  .profile-layout .prose { gap:20px; }
  .section-head { max-width:100%; }

  /* Field drills stack */
  .drills-grid { grid-template-columns:1fr; gap:22px; }
  .shoe-vignette .vignette-picture svg,
  .jacking-vignette .vignette-picture svg,
  .clash-vignette .vignette-picture svg { height:260px; }
}

@media (max-width:720px) {
  .hero-name { font-size:clamp(3.5rem,13vw,5rem); }
  .hero .engineering-vignette { margin-top:6px; }
  .engineering-vignette { padding:12px; }
  .vignette-picture svg { height:320px; }
  .truss-vignette .vignette-picture svg { height:300px; }
  .frame-vignette .vignette-picture svg { height:300px; }
  .shoe-vignette .vignette-picture svg,
  .jacking-vignette .vignette-picture svg,
  .clash-vignette .vignette-picture svg { height:260px; }
  .vignette-copy > p:not(.drawing-title) { font-size:1rem; }
  .scene-actions { gap:0 22px; }
  .scene-phase { width:100%; margin:3px 0 5px; font-size:.82rem; }
  .scene-model summary { font-size:.8rem; }
  .dialog-top { flex-wrap:wrap; gap:6px; }
  .dialog-top p { max-width:55%; font-size:.7rem; }
  .section-title { font-size:clamp(1.9rem,7vw,2.5rem); }
  .contact-list dd { overflow-wrap:anywhere; }
  .file-paper { min-height:325px; }
  .file-paper h3 { line-height:1.35; }
}

@media (prefers-reduced-motion:reduce) { .speech-bubble { transition:none; } }