/* Editorial refinement. Builds on the portfolio's original typography and palette. */
:root { --gap:clamp(72px,8vw,112px); --radius:10px; }
html { scroll-padding-top:150px; }
body { overflow-wrap:break-word; }
.skip-link { position:fixed; top:-80px; left:20px; z-index:100; padding:12px 20px; background:var(--ink); color:var(--bg); }
.skip-link:focus { top:12px; }
a,button,summary { -webkit-tap-highlight-color:transparent; }
summary { cursor:pointer; }
summary:focus-visible { outline:2px solid var(--ink); outline-offset:5px; }
.nav ul a { display:inline-flex; align-items:center; min-height:44px; }
.nav .logo { min-height:44px; align-items:center; }
.logo .logo-signature { display:block; width:72px; height:24px; }
@media(prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) .logo .logo-signature { filter:brightness(2.1); }
}
:root[data-theme="dark"] .logo .logo-signature { filter:brightness(2.1); }
.intro.editorial-intro { padding:clamp(56px,7vw,96px) 0 clamp(44px,5vw,64px); }
.intro-eyebrow,.project-index,.section-label>span,.footer-eyebrow { font:500 11px/1.6 var(--latin); letter-spacing:.12em; color:var(--mute); }
.editorial-intro h1 { font-size:clamp(36px,5.3vw,68px); line-height:1.28; font-weight:700; max-width:17em; margin-top:22px; letter-spacing:-.035em; }
.editorial-intro h1 em { color:var(--ink-2); font-weight:400; }
.intro-bottom { display:flex; justify-content:space-between; gap:24px; align-items:end; margin-top:30px; }
.intro-bottom>p:first-child { color:var(--ink-2); max-width:30em; font-size:17px; }
.intro-credentials { color:var(--mute); font-size:12px; line-height:1.9; flex-shrink:0; }
.section-label { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:18px; border-top:1px solid var(--line); margin-bottom:28px; }
.section-label h2 { font-size:16px; font-weight:500; }
.selected-work { padding-bottom:0; }
.project-row { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(28px,4.5vw,64px); align-items:center; padding:0 0 clamp(56px,7vw,92px); }
.project-media { display:block; min-width:0; aspect-ratio:6/5; overflow:hidden; border-radius:var(--radius); }
.project-media>img { height:100%; width:100%; object-fit:contain; transition:transform .45s ease; }
.project-media:hover>img { transform:scale(1.025); }
.tint-1 { background:var(--tint-1); }.tint-2 { background:var(--tint-2); }.tint-3 { background:var(--tint-3); }.tint-4 { background:var(--tint-4); }.tint-5 { background:var(--tint-5); }
.project-index { font-size:10px; }
.project-name { color:var(--mute); font-size:13px; margin-top:22px; }
.project-copy h3 { font-size:clamp(24px,2.8vw,36px); font-weight:700; line-height:1.5; margin-top:8px; letter-spacing:-.025em; max-width:14em; }
.project-copy h3 a:hover { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:6px; }
.project-desc { margin-top:20px; font-size:15px; line-height:1.85; color:var(--ink-2); max-width:29em; }
.text-link { display:inline-flex; gap:28px; padding:10px 0; border-bottom:1px solid var(--ink); min-height:44px; font-size:14px; font-weight:500; }
.project-copy .text-link { margin-top:22px; }
.skill-art { height:100%; padding:clamp(22px,3vw,40px); display:flex; flex-direction:column; justify-content:space-between; color:#161615; }
.skill-art>span { font:500 10px var(--latin); letter-spacing:.12em; color:#6b675f; }
.skill-art small { display:block; font-size:13px; color:#6b675f; }
.skill-art strong { display:block; font:500 clamp(52px,6vw,86px)/1.2 var(--latin); letter-spacing:-.06em; white-space:nowrap; }
.skill-art strong em { font:500 .36em var(--sans); letter-spacing:0; }
.skill-art>p { padding-top:16px; border-top:1px solid #cec9bf; display:flex; justify-content:space-between; gap:16px; font-size:11px; color:#6b675f; }
.more-work { padding-bottom:var(--gap); }
.secondary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px; }
.secondary-project .cover { aspect-ratio:8/5; }
.secondary-project .project-index { margin-top:22px; }
.secondary-project h3 { margin-top:9px; font-size:clamp(21px,2vw,26px); font-weight:500; line-height:1.55; }
.secondary-project h3 span { font-weight:400; }
.secondary-project>p:last-child { margin-top:10px; color:var(--mute); font-size:13px; }
.secondary-project:hover h3 { text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:1px; }
.working-section { padding-bottom:var(--gap); }
.working-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; }
.working-grid article>span { font:400 12px var(--latin); color:var(--mute); }
.working-grid h3 { font-size:22px; font-weight:500; margin-top:18px; }
.working-grid p { font-size:15px; color:var(--ink-2); margin-top:12px; }
.working-grid a { display:inline-block; min-height:44px; margin-top:16px; padding-block:8px; font-size:13px; text-decoration:underline; text-underline-offset:5px; }
.home-about { display:flex; justify-content:space-between; align-items:center; gap:28px; border-top:1px solid var(--line); padding-top:32px; margin-top:56px; }
.home-about p { font-size:18px; color:var(--ink-2); }
.footer-eyebrow { color:var(--band-mute); margin-bottom:22px; }
.band { padding-top:clamp(60px,7vw,96px); }
.band h2 { font-size:clamp(32px,4.5vw,58px); font-weight:500; line-height:1.45; max-width:18em; }
/* Case studies: short opening, supporting detail on demand. */
.cs-hero { padding-top:48px; padding-bottom:40px; }
.cs-hero .status { margin-top:28px; }
.cs-hero h1 { font-size:clamp(34px,5vw,64px); line-height:1.3; max-width:17em; font-weight:700; }
.cs-hero .lead { margin-top:20px; font-size:clamp(17px,1.8vw,21px); max-width:35em; }
.case-byline { margin-top:28px; display:grid; grid-template-columns:1fr 1fr auto; gap:20px; align-items:start; border-top:1px solid var(--line); padding-top:18px; font-size:13px; color:var(--ink-2); }
.case-byline b { display:block; font-size:11px; font-weight:400; color:var(--mute); margin-bottom:4px; }
.case-byline>p:nth-child(2) { color:var(--mute); }
.case-byline>a { min-height:44px; padding-block:5px; text-decoration:underline; text-underline-offset:5px; }
.project-details { margin-top:18px; }
.project-details>summary { color:var(--mute); font-size:12px; padding:8px 0; min-height:44px; }
.project-details .meta { margin-top:10px; grid-template-columns:repeat(3,minmax(0,1fr)); }
.cs-cover { aspect-ratio:2/1; }
.cs-cover img { object-fit:contain; }
.overview { padding-top:64px; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:20px 48px; }
.overview h2 { font-size:24px; font-weight:500; }
.overview p { font-size:17px; line-height:1.9; }
.kpis { margin-top:24px; gap:28px; }
.kpis div { padding:22px 0; border:none; border-top:1px solid var(--line); background:transparent; border-radius:0; }
.kpis b { font-size:clamp(34px,4.5vw,58px); line-height:1.25; }
.kpis span { margin-top:8px; font-size:13px; }
.ch-head { gap:20px 48px; margin-bottom:32px; }
.ch-head h2 { font-size:clamp(26px,3vw,38px); line-height:1.5; font-weight:700; }
.ch-head h3 { font-size:clamp(21px,2.3vw,29px); line-height:1.5; font-weight:500; }
.ch-head .num { font-size:12px; margin-bottom:14px; }
.chapter>.ch-head~.ch-head { margin-top:48px; }
.principles,.sum-grid,.retros { gap:28px; }
.principle,.sum-card,.retro { border:none; border-top:1px solid var(--line); border-radius:0; background:transparent; padding:24px 0; }
.case-appendix { border-block:1px solid var(--line); margin-top:40px; }
.case-appendix+.case-appendix { border-top:0; margin-top:0; }
.case-appendix>summary { font-size:15px; padding:20px 8px; min-height:60px; }
.appendix-body { padding:20px 0 32px; }
.appendix-body .ch-head { grid-template-columns:1fr; gap:14px; margin-top:24px; }
.appendix-body .wrap { padding-inline:0; }
.appendix-body .spec-grid { margin-top:24px; }
.appendix-body .reveal.pre { opacity:1; transform:none; }
.evidence-note { grid-column:1/-1; padding:20px 24px; border-left:2px solid var(--ink); background:var(--soft); margin-top:16px; }
.evidence-note b { font-size:12px; font-weight:500; }
.evidence-note p { font-size:14px; max-width:58em; margin-top:5px; }
.measurement-note { grid-column:1/-1; font-size:12px!important; color:var(--mute)!important; max-width:65em!important; }
.permission-wrap { max-width:100%; overflow:auto; border-block:1px solid var(--line); }
.permission-table { width:100%; min-width:570px; border-collapse:collapse; font-size:15px; }
.permission-table caption { text-align:left; padding:14px 16px; font-size:12px; color:var(--mute); }
.permission-table th,.permission-table td { text-align:left; padding:18px 20px; border-bottom:1px solid var(--line); vertical-align:top; }
.permission-table thead { background:var(--soft); }
.permission-table th { font-weight:500; }
.permission-table small { display:block; font-size:11px; color:var(--mute); margin-top:4px; font-weight:400; }
.permission-table tr:last-child>* { border-bottom:none; }
.early-demo { padding-top:48px; padding-bottom:56px; }
.early-demo .placements { padding:28px; }
.time-cover { aspect-ratio:2/1; padding:clamp(24px,4vw,56px); }
.time-cover .time-result strong { font-size:clamp(56px,8vw,116px); }
.time-cover .time-badge { font-size:12px; }
.sum-lead { font-size:clamp(24px,3vw,36px); font-weight:500; }
.extend { margin-top:28px; }
.about-sec { grid-template-columns:minmax(0, 1fr); gap:24px; }
.about-sec > :not(h2) { width:min(100%, 58rem); }
.capability-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px clamp(24px,4vw,48px); }
.capability-list article { display:grid; grid-template-rows:auto auto 1fr; padding-top:18px; border-top:1px solid var(--line); }
.capability-list h3,.education-entry h3 { font-size:20px; font-weight:700; }
.capability-list article p,.education-entry p { color:var(--ink-2); margin-top:8px; font-size:15px; }
.capability-list article p { text-wrap:balance; }
.capability-cases { align-self:start; margin-top:6px; }
.capability-cases a { display:inline-flex; align-items:center; gap:5px; min-height:44px; font-size:14px; text-decoration:underline; text-underline-offset:4px; }
.capability-list .tool-note { grid-column:1/-1; font-size:14px; color:var(--mute); }
.tool-note span { color:var(--ink-2); margin-inline-end:.75em; font-weight:500; }
.growth-copy { font-size:17px; color:var(--ink-2); max-width:40em; }
.education-entry { padding-top:16px; border-top:1px solid var(--line); }
.experience-section .timeline > li {
  grid-template-columns:8rem minmax(0, 1fr);
  column-gap:clamp(24px, 4vw, 48px);
  align-items:baseline;
}
.experience-section .timeline .when { padding-top:0; font-variant-numeric:tabular-nums; }
@media(max-width:680px) {
  .about-sec { gap:18px; }
  .capability-list { grid-template-columns:minmax(0,1fr); gap:14px; }
  .experience-section .timeline > li { grid-template-columns:minmax(0, 1fr); row-gap:8px; }
}
@media(min-width:1100px) { .toc ol { justify-content:flex-start; } }
@media(max-width:1000px) { .case-byline { grid-template-columns:1fr 1fr; }.case-byline>a { grid-column:1/-1; }.project-copy h3 { font-size:27px; }.project-index { font-size:9px; } }
@media(max-width:800px) {
 .intro-bottom { flex-direction:column; align-items:start; gap:16px; }.intro-credentials { font-size:12px; }
 .project-row { grid-template-columns:1fr; gap:24px; }.project-media { aspect-ratio:8/5; }.project-copy h3 { max-width:22em; font-size:27px; }.project-name { margin-top:12px; }.project-desc { max-width:44em; margin-top:12px; }.project-copy .text-link { margin-top:12px; }
 .skill-art strong { font-size:clamp(58px,12vw,92px); }.section-label>span { font-size:9px; text-align:right; }
 .working-grid { gap:24px; }.working-grid h3 { font-size:19px; }
 .overview { grid-template-columns:1fr; gap:20px; }.overview p { max-width:42em; }.ch-head { grid-template-columns:1fr; }
 .home-about { align-items:start; flex-direction:column; }.project-details .meta { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:560px) {
 .editorial-intro h1 { font-size:clamp(30px,7.9vw,42px); }.intro-bottom>p:first-child { font-size:15px; }.secondary-grid,.working-grid { grid-template-columns:1fr; gap:40px; }
 .project-copy h3 { font-size:25px; }.section-label { align-items:baseline; }.section-label>span { max-width:17em; }.skill-art>p { font-size:10px; }
 .project-row { padding-bottom:56px; }.project-media { aspect-ratio:6/5; }.secondary-project h3 { font-size:23px; }
 .working-grid article { border-top:1px solid var(--line); padding-top:20px; }.working-grid article:first-child { border-top:0; padding-top:0; }
 .case-byline { grid-template-columns:1fr; gap:12px; }.case-byline>a { grid-column:auto; }.project-details .meta { grid-template-columns:1fr; }
 .cs-cover { aspect-ratio:8/5; }.cs-hero { padding-top:32px; }.cs-hero h1 { font-size:34px; }.cs-hero .status { margin-top:20px; }
 .kpis { grid-template-columns:1fr; gap:0; margin-top:12px; }.kpis div { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); align-items:center; gap:14px; padding:18px 0; }.kpis b { font-size:34px; }.kpis span { margin-top:0; font-size:13px; }
 .time-cover { aspect-ratio:auto; min-height:440px; }.time-cover-body { grid-template-columns:1fr; gap:28px; }.time-cover .time-result strong { font-size:clamp(64px,17vw,96px); }.time-cover-head span:last-child { display:none; }
 .early-demo .placements { padding:22px; }.evidence-note { padding:18px; }.band-grid { gap:28px; }.band h2 { font-size:32px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }

/* Avoid layout overflow when a drawer contains full-size research artifacts. */
.appendix-body,.project-copy,.case-byline>p,.overview>* { min-width:0; }
.case-appendix .panel { max-width:100%; }
.project-details .meta .hl { grid-column:auto; }
@media(max-width:560px) { .case-appendix>summary { font-size:14px; }.section-label h2 { flex-shrink:0; } }

/* Selected AI workflow cover: concept visualization, kept fully visible. */
.concept-media { position:relative; }
.concept-media>img { object-fit:contain; }
.concept-caption { position:absolute; right:12px; bottom:12px; padding:3px 9px; border-radius:4px; background:rgba(250,250,248,.94); color:#6b675f; font-size:10px; line-height:1.6; }

/* Keep the home introduction sentence on one line at desktop widths. */
@media(min-width:801px) {
  .intro-bottom { flex-wrap:wrap; align-items:flex-start; }
  .intro-bottom>p:first-child { flex-basis:100%; max-width:none; white-space:nowrap; font-size:clamp(13px,1.4vw,17px); }
}
@media(max-width:800px) {
  .intro-bottom>p:first-child { max-width:none; }
}

/* Project metadata: phase beside the project name; skills as a separate index. */
.project-heading-meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; margin-top:20px; }
.project-heading-meta .project-name { margin:0; color:var(--ink-2); font-size:12px; }
.project-phase { display:inline-flex; align-items:center; gap:7px; padding:4px 9px; border-radius:4px; background:var(--soft); color:var(--ink-2); font-size:10px; line-height:1.6; }
.project-phase::before { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; flex-shrink:0; }
.capability-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; padding-top:0; list-style:none; }
.capability-tags li { padding:4px 10px; border:1px solid var(--line); border-radius:4px; font-size:11px; line-height:1.6; color:var(--mute); }
.project-copy .capability-tags+.text-link { margin-top:18px; }
@media(max-width:800px) { .project-heading-meta { margin-top:14px; }.capability-tags { margin-top:18px; padding-top:0; } }

.capability-tags li.ai-capability { color:#484088; border-color:#d8d3eb; background:#f0edf8; }
@media(prefers-color-scheme:dark) { :root:not([data-theme="light"]) .capability-tags li.ai-capability { color:#c8c1ef; border-color:#514a71; background:#292536; } }
:root[data-theme="dark"] .capability-tags li.ai-capability { color:#c8c1ef; border-color:#514a71; background:#292536; }
