/* Ana Anes — personal portfolio. Shared tokens and document foundations. */
@font-face {
  font-family: "Manrope";
  src: url("assets/fonts/ManropeVariable.ttf") format("truetype");
  font-style: normal;
  font-weight: 300 400;
  font-display: swap;
}
:root {
  --paper: #fbfbfa;
  --ink: #1a1a1a;
  --muted: #64645f;
  --pink: #f13b85;
  --panel: #f0f0ed;
  --line: rgb(26 26 26 / .12);
  --font: "Manrope", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --pad: clamp(22px, 4.5vw, 86px);
  --max: 1800px;
  --header: 96px;
  --ease: cubic-bezier(.16, 1, .3, 1);
  color-scheme: light;
}
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--paper); scroll-padding-top: calc(var(--header) + 24px); -webkit-text-size-adjust: 100%; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 400 16px/1.5 var(--font); -webkit-font-smoothing: antialiased; font-synthesis: none; }
h1, h2, h3, h4, h5, h6, p, figure, dl, dd { margin: 0; }
h1, h2, h3, h4, h5, h6, strong, b, th { font-weight: 400; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { color: inherit; font: inherit; }
button, summary { cursor: pointer; }
img, video { display: block; max-width: 100%; height: auto; }
svg { display: inline-block; width: 24px; height: 24px; fill: none; stroke: currentColor; }
[hidden] { display: none !important; }
::selection { color: var(--ink); background: #f13b85; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 6px; }
main:focus, .project-card:focus { outline: none; }
.skip-link { position: fixed; top: 12px; left: 18px; padding: 12px 20px; z-index: 300; color: var(--paper); background: var(--ink); transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.eyebrow, .micro { font: 400 10px/1.6 var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.technical-index { color: var(--pink); font: 400 11px/1.5 var(--mono); font-variant-numeric: tabular-nums; }
.eyebrow .technical-index { margin-right: 20px; }
.arrow { width: 22px; height: 22px; stroke: currentColor; stroke-width: 1.5; fill: none; }
.hero-line { display: block; overflow: hidden; padding: .1em .04em .15em; margin: -.1em -.04em -.15em; }
[data-hero-line] { display: block; }
.work-page, .about-page { max-width: var(--max); margin-inline: auto; padding-inline: var(--pad); }

/* Text navigation. Every destination remains visible at every viewport width. */
.site-header { position: fixed; inset: 0 0 auto; z-index: 100; height: var(--header); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 40px; padding: 0 var(--pad); background: rgb(251 251 250 / .97); }
.brand { display: inline-flex; align-items: center; justify-self: start; gap: 9px; min-height: 44px; font-size: 18px; letter-spacing: -.025em; }
.brand > span { font-size: 13px; color: var(--pink); }
.main-nav, .language-switch { display: flex; align-items: center; }
.main-nav { gap: 38px; }
.nav-link { position: relative; display: inline-flex; align-items: center; gap: 5px; min-height: 44px; font-size: 13px; }
.nav-link::after { content: ""; position: absolute; bottom: 5px; left: 0; right: 0; height: 1px; background: var(--ink); transform: scaleX(0); transform-origin: right; transition: transform .65s var(--ease); }
.nav-link:hover::after, .nav-link:focus-visible::after, .nav-link[aria-current]::after { transform: scaleX(1); transform-origin: left; }
.nav-link sup { align-self: start; padding-top: 9px; color: var(--pink); font: 9px var(--mono); }
.language-switch { justify-self: end; gap: 4px; }
.language-switch a { display: grid; place-items: center; min-width: 36px; min-height: 44px; font-size: 10px; color: var(--muted); }
.language-switch a[aria-current] { color: var(--ink); text-decoration: underline; text-underline-offset: 5px; }

/* Contact: a usable destination, not a list of decorative controls. */
.text-link, .back-link, .all-projects { position: relative; display: inline-flex; align-items: center; gap: 14px; min-height: 44px; font-size: 13px; }
.text-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: 5px; height: 1px; background: var(--ink); transform: scaleX(0); transform-origin: right; transition: transform .65s var(--ease); }
.text-link:hover::after, .text-link:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.text-link span { transition: transform .65s var(--ease); }
.text-link:hover span { transform: translate3d(2px, -2px, 0); }

/* Shared-image transitions progressively enhance ordinary document links. */
.page-transition { position: fixed; inset: 0; z-index: 200; overflow: hidden; pointer-events: none; visibility: hidden; }
.page-transition.is-active, .transition-entry .page-transition { visibility: visible; }
.page-transition.is-active { pointer-events: auto; }
.transition-image { position: absolute; inset: 0; opacity: 0; transform-origin: 0 0; overflow: hidden; }
.transition-image img { position: absolute; object-fit: cover; max-width: none; transform-origin: 0 0; }
.transition-blade { position: absolute; inset: 0; background: var(--paper); transform: translate3d(0, 101%, 0); }
.transition-entry .transition-blade { transform: translate3d(0, 0, 0); }
.page-transition.is-shared .transition-blade { display: none; }
.shared-surface { position: absolute; inset: 0; overflow: hidden; background: var(--panel); }
.shared-picture { position: absolute; left: 0; top: 0; max-width: none; object-fit: cover; transform-origin: 0 0; }
html.shared-entry::before { content: ""; position: fixed; inset: 0; z-index: 202; background: var(--panel) var(--entry-cover) center / cover no-repeat; pointer-events: none; }

/* Case components, integrated from the existing project pages. */
/* Case studies. One reading grid, shared spacing, original project material. */
.case-body{--case-accent:#974564;--case-soft:#ede2e5;--case-dark:#352732}
.case-72{--case-accent:#285971;--case-soft:#e3ebef;--case-dark:#193843}.case-alcar{--case-accent:#93543b;--case-soft:#eee4d9;--case-dark:#352a1d}.case-sensory{--case-accent:#684e85;--case-soft:#e8e3ed;--case-dark:#2a2237}.case-mesh{--case-accent:#28594e;--case-soft:#e1e8e2;--case-dark:#193f36}.case-apart{--case-accent:#715b2b;--case-soft:#eae5d9;--case-dark:#2f2c24}.case-ins{--case-accent:#7a4155;--case-soft:#e9e5e6;--case-dark:#242625}
.case-main{max-width:var(--max);margin:auto;padding:0 var(--pad)}.case-heading{padding:calc(var(--header) + 69px) 0 57px}.case-heading>.eyebrow{color:var(--case-accent);font-size:11px;font-weight:400}.case-heading h1{font-size:clamp(65px,9.5vw,164px);line-height:1.08;letter-spacing:-.064em;margin:30px 0 30px}.case-ins .case-heading h1{font-size:clamp(55px,7.8vw,131px)}.case-lede{font-size:clamp(20px,2.06vw,33px);line-height:1.48;letter-spacing:-.036em;max-width:45ch}.case-cover{width:100%;aspect-ratio:8/5;overflow:hidden;background:var(--case-soft);max-height:960px}.case-cover img{width:100%;height:100%;object-fit:cover}.case-meta{display:grid;grid-template-columns:1fr 1fr;gap:8%;padding:44px 0 66px;margin-left:23.5%}.case-meta h2{margin-bottom:13px;color:var(--case-accent)}.case-meta p{font-size:14px;line-height:1.7;max-width:48ch;color:#484c46}
.case-layout{display:grid;grid-template-columns:18.5% minmax(0,1fr);column-gap:5%;align-items:start}.case-index{position:sticky;top:120px;padding:2px 0 32px;max-height:calc(100svh - 136px);overflow:auto;scrollbar-width:thin}.case-index>.eyebrow{font-size:10px;margin-bottom:20px;color:var(--muted)}.case-nav{display:flex;flex-direction:column;gap:1px}.chapter-link{display:flex;align-items:baseline;gap:13px;min-height:39px;font-size:12px;line-height:1.45;padding:9px 0;color:var(--muted);transition:transform .45s var(--ease),opacity .3s var(--ease)}.chapter-link>span{font-size:10px;min-width:17px;color:var(--case-accent);font-variant-numeric:tabular-nums}.chapter-link:hover,.chapter-link[aria-current=location]{color:var(--ink)}.chapter-link[aria-current=location]{font-weight:400}.case-content{min-width:0}.case-content .eyebrow{color:var(--case-accent);font-size:10px;font-weight:400}.case-content h3{font-size:24px;line-height:1.25;letter-spacing:-.035em}.case-content p{overflow-wrap:break-word}.case-content p,.case-content li,.case-content dd{font-size:16px;line-height:1.7;color:#464a44}.case-content strong{color:var(--ink)}.case-content .ui-icon{width:20px;height:20px;stroke:currentColor;stroke-width:1.5;fill:none}
.case-overview{scroll-margin-top:120px}.quick-read-heading{margin-bottom:26px}.quick-read-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 42px}.quick-read-grid>article{min-width:0}.quick-read-grid>article:last-child{grid-column:1/-1;max-width:68ch}.quick-read-grid>article>span{font-size:10px;letter-spacing:.04em;color:var(--case-accent)}.quick-read-grid>article>p{margin-top:10px;font-size:19px;line-height:1.6;letter-spacing:-.024em}.quick-read-grid>article:last-child p{font-size:14px;color:var(--muted);line-height:1.7}.decision-overview{margin-top:44px;margin-bottom:80px}.decision-overview>h2{margin-bottom:23px}.case-decision-grid,.case-conclusion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.case-decision-grid>article>span{font-size:11px;color:var(--case-accent);display:block;margin-bottom:12px}.case-decision-grid strong,.case-conclusion-grid strong{display:block;font-weight:400;font-size:18px;line-height:1.3;letter-spacing:-.028em;margin-bottom:12px}.case-decision-grid p,.case-conclusion-grid p{font-size:14px;line-height:1.7}
.case-section{margin:88px 0;scroll-margin-top:118px}.case-section:first-of-type{margin-top:65px}.chapter-copy{margin-bottom:33px;max-width:780px}.chapter-copy>.eyebrow{display:block;margin-bottom:20px}.chapter-copy h2{font-size:clamp(30px,3vw,48px);line-height:1.17;letter-spacing:-.048em;max-width:27ch;color:var(--ink)}.chapter-copy>p{max-width:58ch;margin-top:23px;font-size:17px;line-height:1.7;letter-spacing:-.017em}.case-section>:not(.chapter-copy)+:not(.chapter-copy){margin-top:26px}.case-content figcaption{font-size:11px!important;line-height:1.65!important;color:var(--muted);margin-top:15px}.case-content figcaption span{color:inherit}.case-content figure{min-width:0;margin-inline:0}.case-content .study-note{font-size:12px;line-height:1.65;color:var(--muted);max-width:79ch}.case-content .study-sources{display:flex;flex-wrap:wrap;list-style:none;padding:0;gap:10px 25px}.case-content .study-sources li,.case-content .study-sources a{font-size:12px;color:var(--case-accent)}.case-content .study-sources a:hover{text-decoration:underline}.case-content a:not(.prototype-ending):not(.invitation-link){overflow-wrap:anywhere}.case-conclusion{margin:85px 0 55px;scroll-margin-top:115px}.case-conclusion>h2{font-size:38px;line-height:1.22;letter-spacing:-.04em;margin:22px 0 34px;max-width:24ch}.case-conclusion-grid>article>span{display:block;font-size:11px;color:var(--case-accent);margin-bottom:12px}
/* Secondary detail is explicitly labelled, never required to discover the project. */
details.study-notes{background:#eeede7;padding:0 22px;margin-top:30px;border-radius:3px}details.project-context{margin-top:30px;margin-bottom:36px}details.study-notes>summary{list-style:none;cursor:pointer;font-size:13px;font-weight:400;min-height:60px;padding:17px 0;display:flex;gap:20px;align-items:center;justify-content:space-between;color:var(--ink)}details.study-notes>summary::-webkit-details-marker{display:none}details.study-notes>summary>svg{display:none}details.study-notes>summary::after{content:'+';font-size:21px;font-weight:400;line-height:1;color:var(--case-accent);flex-shrink:0}details.study-notes[open]>summary::after{content:'−'}.notes-content{padding:15px 0 28px}.notes-content>section+section{margin-top:36px}.notes-content h3{font-size:23px;margin:13px 0 16px}.notes-content p+p{margin-top:15px}.notes-content ul,.notes-content ol{padding-left:20px;margin-top:15px}.notes-content li{margin:7px 0;font-size:14px}.notes-content p{font-size:15px;line-height:1.75}.project-brief{display:grid;grid-template-columns:1fr;gap:24px;padding:10px 0 25px}.project-brief dt{font-size:10px;letter-spacing:.04em;color:var(--case-accent);margin-bottom:7px}.project-brief dd{font-size:14px;line-height:1.7}.notes-table{width:100%;border-collapse:collapse;margin:20px 0;font-size:13px;table-layout:fixed}.notes-table th{text-align:left;background:var(--case-soft);padding:12px;font-weight:400}.notes-table td{vertical-align:top;padding:13px 12px;font-size:13px;line-height:1.7;overflow-wrap:anywhere}.notes-table tr:nth-child(even) td{background:#f6f5f1}.study-quote{font-size:clamp(25px,2.9vw,42px);line-height:1.3;letter-spacing:-.036em;max-width:27ch;padding:27px 0;color:var(--ink)}.study-quote>span{font-size:50px;color:var(--case-accent)}
/* Source images always retain their proportions. Phone sequences have their own grid. */
.study-media{width:100%}.media-phones{display:grid;grid-template-columns:repeat(var(--screen-count,3),minmax(0,1fr));gap:32px 20px;align-items:start}.media-frame{display:flex;align-items:center;justify-content:center;min-width:0;overflow:hidden}.media-frame>img,.media-frame>.image-open>img{width:auto;max-width:100%;height:420px;object-fit:contain}.media-phones figcaption{max-width:27ch;margin-left:auto;margin-right:auto;text-align:center}.image-open{padding:0;border:0;background:transparent;display:flex;align-items:center;justify-content:center;max-width:100%;width:100%;cursor:default;color:inherit}.image-open img{transition:transform .45s var(--ease),opacity .3s var(--ease)}.image-open:hover img{transform:scale(1.015)}.media-duo,.v48-spatial-pair,.media-identity-separated{display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:start}.media-duo .media-frame img{height:auto;width:100%;max-height:530px;object-fit:contain}.v48-spatial-pair img{width:100%;aspect-ratio:16/10;object-fit:cover}.v48-full-space img,.faces-static img,.media-photo img,.media-setup img{max-height:640px;width:100%;object-fit:contain}.media-identity-separated .media-frame{background:var(--case-soft);height:415px;padding:34px}.media-identity-separated img{height:100%;width:100%;object-fit:contain}.media-storyboard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}.media-storyboard .media-frame{display:block}.media-storyboard img{width:100%;height:auto;aspect-ratio:1.49;object-fit:cover}.v48-apart-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}.v48-apart-flow img{max-height:425px;width:auto;margin:auto;object-fit:contain}.v48-apart-flow figcaption{text-align:center}
/* Diagrams and research snapshots: restrained, legible and visibly distinct from product UI. */
.study-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;padding:33px;background:var(--case-soft)}.study-stats>div{display:flex;flex-direction:column;gap:12px;min-width:0}.study-stats strong{font-size:clamp(31px,3.2vw,49px);letter-spacing:-.05em;font-weight:400;color:var(--case-accent);line-height:1.05}.study-stats span{font-size:12px;line-height:1.6;color:var(--case-dark)}.context-board{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding:36px;background:var(--case-soft)}.context-number strong{font-size:78px;line-height:1.1;letter-spacing:-.06em;display:block;font-weight:400}.context-number>span{font-size:14px}.context-detail{display:flex;flex-direction:column;justify-content:center;gap:12px}.context-detail strong{font-size:42px;font-weight:400;color:var(--case-accent)}.context-board>p,.context-board>.study-note{grid-column:1/-1}.proportion-bar{height:9px;background:#c5d4dc}.proportion-bar span{display:block;height:100%;background:var(--case-accent)}.visual-journey,.touch-sequence,.making-sequence,.mesh-flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:25px;padding:27px 0;list-style:none}.visual-journey li,.making-sequence li,.touch-sequence li,.mesh-flow li{min-width:0}.visual-journey li>span,.touch-sequence li>span,.making-sequence li>span,.mesh-flow li>span{display:block;font-size:10px;letter-spacing:.04em;color:var(--case-accent);margin-bottom:15px}.visual-journey h3,.making-sequence h3,.making-sequence strong,.visual-journey strong,.mesh-flow strong{font-size:21px;letter-spacing:-.035em;font-weight:400;display:block;line-height:1.2;margin-bottom:10px}.visual-journey p,.making-sequence p,.mesh-flow p,.touch-sequence p{font-size:12px;line-height:1.7}.touch-sequence strong{display:block;font-size:19px}.evidence-key{display:grid;grid-template-columns:repeat(2,1fr);gap:23px 30px;padding:26px;background:var(--case-soft)}.evidence-key>div{display:grid;grid-template-columns:22px 1fr;column-gap:12px;align-items:start}.evidence-key strong{font-size:15px}.evidence-key p{font-size:12px}.evidence-mark{height:9px;width:9px;margin-top:7px;background:var(--case-accent);border-radius:50%}.evidence-key p{grid-column:2}.evidence-mark.mark-1{background:#8a692c}.evidence-mark.mark-2{background:#566582}.evidence-mark.mark-3{background:#888b83}.study-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.study-cards article{padding:25px;background:var(--case-soft)}.study-cards h3{font-size:23px;margin-bottom:16px}.study-cards p{font-size:14px;line-height:1.75}
.engagement-chart{background:var(--case-soft);padding:34px;display:grid;grid-template-columns:1fr 1.4fr;gap:30px}.engagement-chart>div:first-child>p{font-size:34px;line-height:1.2;letter-spacing:-.044em;margin-top:22px;color:var(--case-dark)}.engagement-chart em{color:var(--case-accent)}.engagement-bars>div+div{margin-top:25px}.engagement-bars>div>span{font-size:12px}.chart-axis{height:20px;display:flex;align-items:center;position:relative;background:#d3ccd9;margin-top:10px}.chart-bar{display:block;height:100%;background:var(--case-accent)}.chart-axis strong{font-size:13px;margin-left:9px;color:var(--case-dark)}.chart-scale{display:flex;justify-content:space-between;color:var(--muted)}.chart-scale span{font-size:10px!important}.engagement-chart figcaption{grid-column:1/-1;margin-top:6px}.co-design-board{padding:32px;background:var(--case-soft)}.co-design-board h3{font-size:30px;letter-spacing:-.04em;margin:18px 0}.co-design-board p{max-width:60ch}.co-design-label{font-size:11px;color:var(--case-accent)}
/* The project demonstrations use real controls with visible state and keyboard focus. */
.case-interaction{padding:30px;background:var(--case-soft);margin-top:34px!important}.interaction-intro{max-width:650px;margin-bottom:26px}.interaction-intro h3{font-size:28px;margin:13px 0 16px}.interaction-intro p{font-size:14px;line-height:1.7}.status-demo-grid,.sensory-demo-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:24px;align-items:start}.status-demo-controls,.sensory-demo-controls{display:grid;gap:10px}.status-demo-controls button,.sensory-demo-controls button{border:0;background:var(--paper);color:var(--case-dark);padding:16px 17px;text-align:left;font-size:14px;min-height:49px;transition:transform .45s var(--ease),opacity .3s var(--ease)}.sensory-demo-controls button{position:relative;padding-right:39px}.sensory-demo-controls button::after{content:'+';position:absolute;right:16px;top:18px;font-size:18px}.sensory-demo-controls button[aria-pressed=true]::after{content:'✓'}.sensory-demo-controls small{display:block;font-size:11px;margin-top:4px;color:inherit}.status-demo-controls button[aria-pressed=true],.sensory-demo-controls button[aria-pressed=true]{color:var(--paper);background:var(--case-dark)}.status-demo-panel,.sensory-demo-panel{padding:26px;background:var(--paper);min-height:260px}.status-demo-panel h4,.status-demo-panel h3{font-size:25px;line-height:1.25;letter-spacing:-.035em;margin:15px 0}.status-demo-panel p{font-size:14px}.status-demo-kicker,.sensory-demo-kicker{font-size:10px;letter-spacing:.05em;color:var(--case-accent)}.status-demo-panel dl{display:grid;grid-template-columns:1fr;gap:14px;margin-top:24px}.status-demo-panel dt{font-size:10px;color:var(--case-accent)}.status-demo-panel dd{font-size:12px}.sensory-condition{display:flex;justify-content:space-between;gap:16px;padding:10px 0;font-size:12px}.sensory-condition:first-of-type{margin-top:15px}.sensory-profile{margin-top:23px}.sensory-profile>span{font-size:10px;color:var(--case-accent)}.sensory-profile p{font-size:13px;margin-top:10px}.sensory-profile [data-sensory-tags]{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}.sensory-profile [data-sensory-tags]>span{padding:6px 9px;background:var(--case-soft);font-size:10px;color:var(--case-dark);border-radius:20px}.case-content .interaction-note{font-size:11px;line-height:1.7;color:var(--case-dark);margin-top:22px}
/* MESH: source-derived components, device comparison and state explorer. */
.palette-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}.palette-colour{height:91px}.palette-item strong{display:block;font-size:11px;margin-top:13px}.palette-item code,.palette-item>span{display:block;font:10px/1.6 var(--font);color:var(--muted)}.type-pair{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:33px;padding:26px 0}.type-pair p{font-size:31px;line-height:1.25;letter-spacing:-.04em;margin-top:15px}.type-pair small{font-size:12px;line-height:1.65;display:block;margin-top:14px;color:var(--muted)}.state-explorer{background:var(--case-soft);padding:29px}.state-controls,.mesh-view-controls{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:30px}.state-controls button,.mesh-view-controls button{min-height:40px;font-size:11px;padding:10px 14px;border:0;border-radius:30px;background:var(--paper);color:var(--case-dark)}.state-controls button[aria-pressed=true],.mesh-view-controls button[aria-pressed=true]{background:var(--case-dark);color:var(--paper)}.state-explorer [data-state-panel]>img{width:100%;max-width:700px;height:auto;margin:38px auto}.state-explorer [data-state-panel]>p{font-size:13px;line-height:1.65}.state-explorer [data-state-panel]>p span{color:var(--case-accent);font-size:11px;margin-right:20px}.mesh-components-v41{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.mesh-comp-panel{background:var(--case-soft);padding:24px;min-width:0}.mesh-comp-wide{grid-column:1/-1}.mesh-comp-label{display:block;font-size:10px;letter-spacing:.035em;color:var(--case-accent);margin-bottom:25px}.mesh-button-row{display:flex;flex-wrap:wrap;gap:10px}.component-sample{display:inline-block;padding:10px 14px;background:#171816;color:#f6f5f1;font-size:12px;border-radius:6px}.component-sample.is-petrol{background:#174b4a}.component-sample.is-outline{box-shadow:inset 0 0 0 1px #174b4a;background:transparent;color:#174b4a}.component-sample.is-disabled{background:#bbc4bf;color:#46534d}.mesh-search-stack{display:grid;gap:9px}.mesh-search{font-size:12px;padding:9px 12px;background:var(--paper);border-radius:5px;color:#60675f}.mesh-search.is-focus{box-shadow:0 0 0 2px #174b4a}.mesh-search.is-muted{background:#cad2ce}.mesh-tabs{display:flex;flex-wrap:wrap;gap:12px}.mesh-tabs span{font-size:12px;padding:10px;background:var(--paper);border-radius:5px}.mesh-tabs .is-active{background:#174b4a;color:var(--paper)}.mesh-tabs .focus{outline:2px solid #174b4a;outline-offset:3px}.mesh-toggles{display:flex;gap:17px}.mesh-toggles i{display:block;width:43px;height:24px;border-radius:20px;background:#879990;position:relative}.mesh-toggles i::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--paper)}.mesh-toggles .on{background:#174b4a}.mesh-toggles .on::after{left:22px}.mesh-toggles .alt{background:#5b1f2a}.mesh-toggles .disabled{background:#b9c3bd}.mesh-card-demo{background:var(--paper);padding:17px;border-radius:7px}.mesh-card-demo strong{font-size:14px}.mesh-card-demo p{font-size:12px;margin-top:12px}.mesh-comparison{padding:26px;background:var(--case-soft)}.mesh-view-controls button span{font-size:10px;margin-left:15px}.mesh-desktop-view img{width:100%;max-height:520px;object-fit:contain}.mesh-desktop-view figcaption>strong{display:block;font-size:22px;margin:18px 0 9px}.mesh-mobile-view{display:grid;grid-template-columns:1fr 1.2fr;gap:33px;align-items:center}.mesh-phone-silhouette img{max-height:510px;width:auto;margin:auto}.mesh-mobile-notes ol{list-style:none;padding:0;margin-top:20px}.mesh-mobile-notes li{display:grid;grid-template-columns:20px 1fr;gap:15px;margin-top:23px}.mesh-mobile-notes li>span{font-size:10px;color:var(--case-accent);padding-top:5px}.mesh-mobile-notes h3{font-size:20px}.mesh-mobile-notes p{font-size:13px;margin-top:9px}.mesh-secondary-states{display:grid;grid-template-columns:1fr 1fr;gap:20px}.mesh-toast-row,.mesh-result-row,.mesh-focus-row{padding:18px;background:var(--case-soft)}
/* ALÇAR and the installation work keep image, sound and spatial evidence distinct. */
.decision-board{display:grid;gap:16px}.decision-board>article,.decision-board>div{display:grid;grid-template-columns:35px 1fr 24px 1.4fr;gap:20px;align-items:center;padding:23px;background:var(--case-soft)}.decision-number{font-size:11px;color:var(--case-accent)}.decision-insight{font-size:16px;font-weight:400;line-height:1.4}.decision-connector{font-size:22px;color:var(--case-accent)}.decision-board h3{font-size:22px}.decision-board p{font-size:13px;margin-top:8px}.model-viewer{position:relative;min-height:390px;background:var(--case-soft);overflow:hidden;display:grid;place-items:center}.model-poster{width:100%;position:relative}.model-poster img{width:100%;max-height:510px;object-fit:cover}.model-start{padding:30px;display:flex;align-items:center;justify-content:center;gap:15px;background:var(--case-dark);color:var(--paper);border:0;border-radius:2px;min-height:60px;position:relative}.model-start span{font-size:13px}.model-viewer p{font-size:13px;padding:20px;max-width:48ch}.model-viewer iframe{border:0;width:100%;height:540px}.model-viewer.is-live .model-poster,.model-viewer.is-live .model-start{display:none}.word-wall{display:grid;grid-template-columns:1fr 1fr;gap:25px;background:var(--case-soft);padding:28px}.word-wall h3{font-size:27px;margin:14px 0}.word-wall-copy>p{font-size:14px}.word-wall form{display:flex;gap:8px;flex-wrap:wrap;margin-top:23px}.word-wall form label{width:100%;font-size:11px;color:var(--case-accent)}.word-wall input{width:100%;border:0;background:var(--paper);padding:12px 15px;font-size:14px;color:var(--ink)}.word-wall form button{border:0;padding:11px 15px;background:var(--case-dark);color:var(--paper);font-size:12px;min-height:44px}.word-wall-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:15px}.word-wall-chips button{padding:7px 10px;background:var(--paper);border:0;color:var(--case-dark);font-size:11px;min-height:36px;border-radius:20px}.word-wall-stage{min-height:320px;position:relative;overflow:hidden;background:#252119 url('assets/alcar-projection-exact.webp') center/cover;color:#fff1bd}.word-wall-stage::before{content:'';position:absolute;inset:0;background:#17170f88}.word-wall-stage .word-wall-hint{position:absolute;bottom:25px;left:25px;right:25px;z-index:1;font-size:12px;color:#fff3d9}.word-wall.has-words .word-wall-hint{opacity:0}.projected-word{position:absolute;color:#fff2cc;font-size:24px;line-height:1.2;max-width:70%;overflow-wrap:anywhere;z-index:2}.invitation-editorial{display:grid;grid-template-columns:1fr 1.3fr;gap:36px;background:var(--case-soft);padding:35px;align-items:center}.invitation-screen img{max-height:495px;width:auto;margin:auto}.invitation-guide h3{font-size:35px;line-height:1.2;letter-spacing:-.04em;margin:15px 0 24px}.invitation-guide ol{list-style:none;padding:0}.invitation-guide li{font-size:14px;margin:13px 0}.invitation-guide li span{font-size:10px;color:var(--case-accent);margin-right:18px}.invitation-link{display:inline-flex;align-items:center;gap:16px;background:var(--case-dark);color:var(--paper);min-height:45px;padding:12px 16px;font-size:13px;margin-top:15px}.invitation-qr{margin-top:20px;font-size:11px}.invitation-qr img{width:82px;height:82px;margin-bottom:8px}.validation-board{padding:30px;background:var(--case-soft)}.validation-label{font-size:10px;color:var(--case-accent);letter-spacing:.04em}.validation-board h3{font-size:27px;margin-top:14px}.validation-ratings{margin-top:24px}.validation-row{display:grid;grid-template-columns:1.2fr 2fr auto;gap:18px;align-items:center;margin:17px 0;font-size:13px}.validation-row>div{height:11px;background:#dbcbc0}.validation-row>div>span{display:block;height:100%;background:var(--case-accent)}.validation-row strong{font-size:13px}.study-videos video{width:100%;max-height:620px;background:#090909}.enter-room{display:inline-flex;align-items:center;gap:20px;border:0;background:var(--case-dark);color:var(--paper);padding:15px 22px;font-size:12px;min-height:49px}.prototype-ending{display:block;padding:36px;background:var(--case-soft);margin-top:46px;color:var(--case-dark)}.prototype-ending>span{font-size:10px;display:block;letter-spacing:.05em}.prototype-ending strong,.prototype-ending h3{display:block;font-size:clamp(28px,3vw,43px);line-height:1.2;letter-spacing:-.043em;font-weight:400;margin-top:16px}.prototype-ending svg{margin-left:20px}.next-project{margin-top:65px;padding:54px 0 25px}.next-project>a{display:grid;grid-template-columns:1.5fr 1fr;gap:70px;align-items:center}.next-project h2{font-size:clamp(34px,4.4vw,73px);letter-spacing:-.05em;line-height:1.2;margin-top:21px}.next-project h2 .arrow{width:32px;height:32px;margin-left:15px}.next-project img{width:100%;max-width:410px;justify-self:end;aspect-ratio:8/5;object-fit:cover;transition:transform .45s var(--ease),opacity .3s var(--ease)}.next-project a:hover img{transform:scale(1.015)}
/* Shared image and film dialogs. */
.image-dialog,.cinema-v21{border:0;padding:62px 28px 30px;background:#171815;color:#f6f5f1;max-width:94vw;max-height:94svh;width:max-content;overflow:auto}.image-dialog::backdrop,.cinema-v21::backdrop{background:#000c}.image-dialog img{height:auto;width:auto;max-height:75svh;max-width:85vw;object-fit:contain;margin:auto}.image-dialog p{font-size:12px;line-height:1.6;color:#e1e1d8;padding-top:18px;max-width:70ch;margin:auto}.image-dialog>button,.cinema-v21>button{position:absolute;right:22px;top:16px;font-size:13px;padding:7px 11px;border:0;background:#f6f5f1;color:#242521;border-radius:3px;min-height:36px}.cinema-v21 video{max-height:75svh;max-width:86vw}
@media(max-width:1100px){.case-layout{grid-template-columns:17% 1fr;gap:4%}.case-meta{margin-left:21%;gap:6%}.case-index{top:111px}.chapter-link{font-size:11px;gap:10px}.chapter-link>span{font-size:9px}.chapter-copy h2{font-size:33px}.quick-read-grid{gap:26px}.media-frame>img,.media-frame>.image-open>img{height:342px}.case-decision-grid,.case-conclusion-grid{gap:20px}.case-decision-grid strong,.case-conclusion-grid strong{font-size:17px}.case-decision-grid p,.case-conclusion-grid p{font-size:13px}.palette-grid{grid-template-columns:repeat(4,1fr);gap:22px 14px}.decision-board>article,.decision-board>div{grid-template-columns:24px 1fr 18px 1.35fr;gap:12px;padding:18px}.context-number strong{font-size:61px}.engagement-chart{padding:25px;gap:20px}.word-wall{grid-template-columns:1fr}.word-wall-stage{min-height:360px}.study-stats{padding:25px;gap:22px}}
@media(max-width:840px){.case-layout{display:block}.case-index{position:sticky;top:72px;z-index:20;padding:8px 0 10px;background:var(--paper);max-height:none;overflow:visible;margin:0 0 30px}.case-index>.eyebrow{display:none}.case-nav{display:flex;flex-direction:row;gap:22px;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}.chapter-link{white-space:nowrap;flex:none;font-size:11px}.chapter-link>span{display:none}.case-meta{margin-left:0;gap:30px;padding-bottom:40px}.case-heading{padding-top:135px}.case-heading h1{font-size:10.5vw}.case-ins .case-heading h1{font-size:7.8vw}.case-lede{font-size:25px}.case-section{scroll-margin-top:150px}.chapter-copy h2{font-size:37px}.media-frame>img,.media-frame>.image-open>img{height:400px}}
@media(max-width:720px){.case-heading{padding-top:122px;padding-bottom:34px}.case-heading>.eyebrow{font-size:9px;line-height:1.6}.case-heading h1{font-size:12.4vw;margin:24px 0 22px}.case-ins .case-heading h1{font-size:8.2vw}.case-lede{font-size:20px;line-height:1.55;max-width:35ch}.case-cover{aspect-ratio:8/5}.case-meta{grid-template-columns:1fr;gap:23px;padding:31px 0 31px}.case-meta h2{margin-bottom:9px;font-size:10px}.case-meta p{font-size:13px}.case-index{margin-bottom:24px}.case-nav{gap:20px}.case-overview{scroll-margin-top:147px}.quick-read-heading{margin-bottom:22px}.quick-read-grid{grid-template-columns:1fr;gap:25px}.quick-read-grid>article:last-child{grid-column:auto}.quick-read-grid>article>p{font-size:18px;line-height:1.65}.case-decision-grid,.case-conclusion-grid{grid-template-columns:1fr;gap:26px}.decision-overview{margin-bottom:55px}.case-decision-grid strong,.case-conclusion-grid strong{font-size:21px}.case-decision-grid p,.case-conclusion-grid p{font-size:14px}.case-decision-grid>article>span{margin-bottom:8px}.case-section{margin:58px 0}.chapter-copy{margin-bottom:27px}.chapter-copy h2{font-size:30px;line-height:1.22;letter-spacing:-.047em;max-width:26ch}.chapter-copy>.eyebrow{font-size:9px;margin-bottom:16px}.chapter-copy>p{font-size:15px;line-height:1.75;margin-top:18px}.case-content p,.case-content li,.case-content dd{font-size:14px}.case-content figcaption{font-size:10px!important;margin-top:12px}.media-phones{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 13px}.media-phones>figure:only-child{grid-column:1/-1}.media-phones:has(>figure:only-child){grid-template-columns:1fr}.media-frame>img,.media-frame>.image-open>img{height:290px}.media-phones>figure:only-child .media-frame img{height:410px}.media-duo,.v48-spatial-pair,.media-identity-separated{gap:16px}.media-duo .media-frame img{height:auto;max-height:350px}.media-identity-separated .media-frame{height:250px;padding:20px}.media-storyboard{gap:22px 14px}.v48-apart-flow{grid-template-columns:repeat(2,1fr);gap:25px 14px}.v48-apart-flow img{max-height:300px}.study-note{font-size:11px!important;line-height:1.65!important}.notes-content p{font-size:14px}.notes-content h3{font-size:22px}.notes-table{font-size:11px}.notes-table td,.notes-table th{font-size:11px;padding:9px 7px;line-height:1.7}.notes-content ul,.notes-content ol{padding-left:16px}.study-notes{padding:0 17px!important}.study-notes>summary{font-size:12px!important;line-height:1.65!important;min-height:60px!important}.study-stats{padding:24px 19px;gap:17px;grid-template-columns:repeat(3,1fr)}.study-stats strong{font-size:29px}.study-stats span{font-size:10px}.context-board{padding:25px;gap:25px}.context-number strong{font-size:58px}.context-number>span{font-size:12px}.context-detail strong{font-size:32px}.context-detail{gap:8px}.visual-journey,.touch-sequence,.making-sequence,.mesh-flow{grid-template-columns:repeat(2,1fr);gap:24px 20px;padding:20px 0}.visual-journey h3,.making-sequence h3,.visual-journey strong,.making-sequence strong,.mesh-flow strong{font-size:19px}.evidence-key{padding:22px;gap:24px;grid-template-columns:1fr}.evidence-key strong{font-size:14px}.evidence-key p{font-size:12px}.study-cards{grid-template-columns:1fr;gap:17px}.study-cards article{padding:23px}.study-cards h3{font-size:22px}.engagement-chart{display:block;padding:24px}.engagement-chart>div:first-child>p{font-size:30px;margin:15px 0 26px}.engagement-chart figcaption{margin-top:25px}.co-design-board{padding:24px}.co-design-board h3{font-size:25px}.case-interaction{padding:23px 19px}.interaction-intro h3{font-size:25px}.interaction-intro p{font-size:13px}.status-demo-grid,.sensory-demo-grid{grid-template-columns:1fr;gap:17px}.status-demo-controls,.sensory-demo-controls{grid-template-columns:1fr 1fr;gap:9px}.status-demo-controls button,.sensory-demo-controls button{font-size:12px;padding:13px 12px;line-height:1.6}.sensory-demo-controls button{padding-right:25px}.sensory-demo-controls button::after{right:9px;top:13px;font-size:14px}.sensory-demo-controls small{font-size:10px}.status-demo-panel,.sensory-demo-panel{padding:22px;min-height:0}.status-demo-panel h3{font-size:23px}.status-demo-panel p{font-size:13px}.palette-grid{grid-template-columns:repeat(4,1fr);gap:23px 10px}.palette-colour{height:68px}.palette-item strong{font-size:10px}.palette-item code,.palette-item>span{font-size:9px}.type-pair{gap:20px}.type-pair p{font-size:25px}.state-explorer{padding:22px 18px}.state-controls{gap:7px;margin-bottom:18px}.state-controls button,.mesh-view-controls button{font-size:10px;padding:10px 12px}.state-explorer [data-state-panel]>img{margin:22px auto}.state-explorer [data-state-panel]>p span{display:block;margin-bottom:8px}.mesh-comp-panel{padding:18px}.mesh-comp-label{font-size:9px;margin-bottom:19px}.mesh-button-row{gap:7px}.component-sample{padding:8px 10px;font-size:10px}.mesh-components-v41{grid-template-columns:1fr;gap:14px}.mesh-comp-wide{grid-column:auto}.mesh-toggles{gap:16px}.mesh-mobile-view{grid-template-columns:1fr;gap:27px}.mesh-phone-silhouette img{max-height:410px}.mesh-comparison{padding:22px 17px}.mesh-mobile-notes li{margin-top:20px}.mesh-mobile-notes h3{font-size:20px}.decision-board>article,.decision-board>div{grid-template-columns:22px 1fr;gap:14px;padding:20px}.decision-board .decision-connector{display:none}.decision-board>article>:last-child,.decision-board>div>:last-child{grid-column:2}.decision-board h3{font-size:21px}.decision-board p{font-size:13px}.model-viewer{min-height:310px}.model-start{padding:21px;font-size:12px;max-width:90%}.model-viewer iframe{height:420px}.word-wall{padding:21px 18px;gap:23px}.word-wall-stage{min-height:285px}.word-wall h3{font-size:24px}.word-wall-copy p{font-size:13px}.invitation-editorial{grid-template-columns:1fr;padding:26px;gap:28px}.invitation-screen img{max-height:390px}.invitation-guide h3{font-size:30px}.invitation-qr img{width:76px;height:76px}.validation-board{padding:23px}.validation-row{grid-template-columns:1fr auto;gap:10px;margin:22px 0;font-size:12px}.validation-row>div{grid-row:2;grid-column:1/-1}.validation-row strong{font-size:12px}.case-conclusion{margin-top:62px}.case-conclusion>h2{font-size:30px}.prototype-ending{padding:25px}.prototype-ending strong,.prototype-ending h3{font-size:30px}.next-project{margin-top:25px;padding-top:30px}.next-project>a{grid-template-columns:1fr;gap:28px}.next-project h2{font-size:38px}.next-project img{max-width:100%;width:100%;justify-self:start}.next-project h2 .arrow{width:24px;height:24px;margin-left:5px}.image-dialog,.cinema-v21{padding:57px 15px 22px;max-width:96vw;max-height:93svh}.image-dialog img{max-width:86vw}.image-dialog p{font-size:11px}}
@media(max-width:370px){.media-frame>img,.media-frame>.image-open>img{height:250px}.context-board{grid-template-columns:1fr}.study-stats strong{font-size:25px}.study-stats{padding:20px 15px;gap:13px}.case-heading h1{font-size:12vw}.case-ins .case-heading h1{font-size:8.1vw}}

@media(min-width:721px){.media-phones[style*="--screen-count:4"] .media-frame>img,.media-phones[style*="--screen-count:4"] .media-frame>.image-open>img{height:350px}}

.mesh-focus-row{display:flex;flex-wrap:wrap;gap:15px}.mesh-focus-row>span{font-size:13px;max-width:100%}

/* 25 / A calmer page frame. Project content and original prototypes are preserved. */
.case-heading{padding:calc(var(--header) + 40px) 0 46px;display:grid;grid-template-columns:1.2fr 1fr;gap:0 7%;align-items:end}
.case-topline{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;margin-bottom:44px}.case-topline>.eyebrow{font-size:9px}
.case-heading>.eyebrow{grid-column:1/-1;letter-spacing:.06em;font-size:10px;margin-bottom:15px}
.case-heading h1{grid-column:1;font-size:clamp(63px,7.1vw,116px);letter-spacing:-.063em;line-height:1.1;margin:0;font-weight:400}
.case-heading h1.long-title,.case-ins .case-heading h1{font-size:clamp(49px,6.1vw,98px)}
.case-lede{grid-column:2;font-size:clamp(17px,1.48vw,24px);max-width:37ch;line-height:1.6;letter-spacing:-.02em;padding-bottom:6px;color:#53534e}
.case-cover{aspect-ratio:1.92;max-height:none;background:none}.case-cover>.artwork{aspect-ratio:1.92;width:100%;height:100%}.case-cover img{width:auto;height:auto;object-fit:contain}.case-cover .scene{width:100%;height:100%;object-fit:cover}.case-cover .art-ins .scene{object-fit:contain}
.case-meta{padding:39px 0 54px;margin-left:0;grid-template-columns:1.2fr 1fr;gap:7%}.case-meta h2{font-size:10px;letter-spacing:.08em}.case-meta p{font-size:14px;line-height:1.8;color:#53534e}.case-meta .proof-line{font-size:12px}
.case-layout{display:block}.case-index{position:sticky;top:var(--header);padding:14px 0 15px;max-height:none;overflow:auto;background:rgb(245 243 239 / .97);z-index:20;margin:0 0 62px;scrollbar-width:thin;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.case-index>.eyebrow{display:none}.case-nav{flex-direction:row;gap:28px;width:max-content;max-width:none}.chapter-link{white-space:nowrap;font-size:11px;min-height:30px;padding:5px 0;gap:9px}.chapter-link>span{font-size:9px;min-width:auto}.chapter-link[aria-current=location]{color:var(--case-accent)}
.case-content{max-width:1090px;margin:auto}.case-content .eyebrow{font-size:10px;letter-spacing:.07em}.case-overview{scroll-margin-top:180px}.quick-read-grid{grid-template-columns:1fr 1fr;gap:30px 65px}.quick-read-grid>article>p{font-size:22px;line-height:1.55;letter-spacing:-.03em}.quick-read-grid>article:last-child p{font-size:14px}.decision-overview{margin-top:58px;margin-bottom:92px}.case-decision-grid,.case-conclusion-grid{gap:40px}.case-decision-grid strong{font-size:20px}.case-decision-grid p,.case-conclusion-grid p{font-size:15px}.case-section{margin:110px 0;scroll-margin-top:175px}.case-section:first-of-type{margin-top:82px}.chapter-copy{margin-bottom:36px;max-width:850px}.chapter-copy h2{font-size:clamp(33px,3.5vw,54px);letter-spacing:-.049em;line-height:1.18;max-width:27ch}.chapter-copy>p{font-size:18px;line-height:1.7;max-width:59ch}.case-content p,.case-content li,.case-content dd{color:#4a4a45}.case-content .study-note{color:#63635d;font-size:12px}.case-content .study-sources a{color:var(--case-accent)}.case-content .study-sources a:hover{text-decoration:underline}
details.study-notes{background:#eeece6;padding:0 25px;border-radius:0;margin-top:32px}details.study-notes>summary{font-weight:400;font-size:13px;min-height:64px}.notes-content{padding-top:18px}.notes-content>section+section{margin-top:45px}.notes-content p{font-size:15px}.notes-content h3{font-size:25px;line-height:1.3}.case-content figcaption{font-size:11px!important;line-height:1.6!important;color:#676761}.media-phones{gap:35px 24px}.media-frame>img,.media-frame>.image-open>img{height:440px}.media-duo .media-frame img{height:auto}.media-storyboard{gap:30px}.case-conclusion{scroll-margin-top:180px}.next-project{padding:85px 0 65px;margin:50px 0 0}.next-project>p{font-size:10px;color:var(--muted)}.next-project>a:first-of-type{display:flex;align-items:center;justify-content:space-between;gap:40px;margin-top:22px;color:var(--ink);font-size:clamp(38px,5vw,80px);font-weight:400;letter-spacing:-.055em;line-height:1.15}.next-project>a:first-of-type>.arrow{width:40px;height:40px;transition:transform .45s var(--ease),opacity .3s var(--ease)}.next-project>a:first-of-type:hover{color:var(--ink)}.next-project>a:first-of-type:hover>.arrow{transform:translate(5px,-5px)}.next-project .all-projects{display:inline-flex;font-size:12px;margin-top:26px;min-height:44px;align-items:center;color:var(--muted);letter-spacing:normal}
@media(max-width:1050px){.case-nav{gap:24px}.case-content{max-width:100%}.case-heading h1{font-size:7.6vw}.case-ins .case-heading h1{font-size:6vw}.case-lede{font-size:17px}.case-index{margin-bottom:45px}.case-decision-grid{gap:24px}.case-section{margin-block:82px}}
@media(max-width:720px){.case-heading{display:block;padding-top:calc(var(--header) + 30px);padding-bottom:32px}.case-topline{margin-bottom:31px}.case-topline>.eyebrow{font-size:8px}.case-topline .back-link{font-size:11px}.case-heading>.eyebrow{display:block;font-size:8px;letter-spacing:.045em;margin-bottom:21px}.case-heading h1{font-size:clamp(46px,12.7vw,76px);line-height:1.1}.case-heading h1.long-title,.case-ins .case-heading h1{font-size:clamp(36px,9.2vw,66px)}.case-lede{margin-top:21px;font-size:16px;line-height:1.65;max-width:36ch;padding:0}.case-cover,.case-cover>.artwork{aspect-ratio:1.28}.case-cover .art-72 .device{height:80%;top:10%;left:48%}.case-cover .art-72 .main-device{transform:translateX(-86%)}.case-cover .art-72 .second-device{height:65%;top:18%;transform:translateX(2%)}.case-meta{grid-template-columns:1fr;padding:30px 0 36px;gap:22px}.case-meta h2{font-size:9px;margin-bottom:9px}.case-meta p{font-size:13px;max-width:45ch}.case-index{display:block;top:var(--header);padding:10px 0 12px;max-height:none;margin:0 0 45px}.case-nav{gap:23px}.chapter-link{font-size:10px;min-height:32px}.chapter-link>span{font-size:8px}.quick-read-grid{grid-template-columns:1fr;gap:24px}.quick-read-grid>article:last-child{grid-column:auto}.quick-read-grid>article>p{font-size:20px;line-height:1.55}.case-content .eyebrow{font-size:9px}.case-decision-grid,.case-conclusion-grid{grid-template-columns:1fr;gap:28px}.decision-overview{margin-bottom:66px}.case-decision-grid>article>span{margin-bottom:8px}.case-decision-grid strong{font-size:21px}.case-decision-grid p{font-size:15px}.case-section{margin:72px 0;scroll-margin-top:158px}.chapter-copy h2{font-size:32px;line-height:1.2;max-width:26ch}.chapter-copy>p{font-size:16px;line-height:1.7}.media-frame>img,.media-frame>.image-open>img{height:360px}.media-duo .media-frame img{height:auto}.media-phones{gap:24px 14px}.case-content figcaption{font-size:10px!important}.next-project{padding:60px 0 30px}.next-project>a:first-of-type{font-size:clamp(28px,8vw,45px);gap:18px}.next-project>a:first-of-type>.arrow{width:25px;height:25px}.case-overview{scroll-margin-top:160px}}

.image-dialog{background:var(--paper);color:var(--ink);width:1400px;max-width:95vw}.image-dialog>p{color:var(--muted)}
/* 26 — common shell, consistent cover continuity and quiet interaction states. */
.case-cover{aspect-ratio:1.94;max-height:780px}.case-cover .artwork{width:100%;height:100%;aspect-ratio:auto}.case-heading{padding-top:calc(var(--header) + 45px)}.case-heading h1{font-weight:400}.case-topline{margin-bottom:30px}.case-index{top:124px}.chapter-link{transition:transform .45s var(--ease),opacity .3s var(--ease);padding-left:10px;border-radius:4px}.chapter-link:hover{background:var(--case-soft);transform:translateX(3px)}.chapter-link[aria-current=location]{background:var(--case-soft);color:var(--case-accent)}details.study-notes{background:#eeece7;border-radius:2px;transition:transform .45s var(--ease),opacity .3s var(--ease)}details.study-notes:hover{background:#e7e4df}details.study-notes>summary::after{transition:transform .45s var(--ease),opacity .3s var(--ease)}details.study-notes>summary:hover::after{transform:rotate(90deg)}.case-content :is(button,[role=button]){transition:transform .45s var(--ease),opacity .3s var(--ease)}.case-content :is(button,[role=button]):active{transform:scale(.97)}.case-content .image-open:active{transform:none}
@media(max-width:720px){.case-cover{aspect-ratio:1.25}.case-heading{padding-top:calc(var(--header) + 38px)}.case-meta{margin-left:0}.case-cover .artwork .device{max-width:80%}}

/* About: preserve the full portrait and the original factual content. */
.about-intro { padding-top: 155px; }
.about-title { font-size: clamp(64px, 10.5vw, 182px); letter-spacing: -.04em; font-weight: 400; line-height: 1.05; white-space: nowrap; margin-bottom: 100px; }
.about-columns { display: grid; grid-template-columns: 1fr 1.3fr; gap: 14%; align-items: center; }
.portrait { width: 340px; max-width: 100%; margin-left: 10%; }
.portrait img { width: 100%; height: auto; }
.about-copy { max-width: 560px; }
.about-lede { font-size: clamp(28px, 3.3vw, 54px); letter-spacing: -.035em; line-height: 1.1; margin-bottom: 30px; }
.about-copy p { color: var(--muted); font-size: 16px; line-height: 1.8; max-width: 47ch; }
.about-copy p + p { margin-top: 20px; }

/* Case studies: retained content and functional demos share the new shell. */
.case-main { padding-inline: var(--pad); max-width: var(--max); }
.case-heading { padding-top: 144px; display: grid; grid-template-columns: 1.3fr 1fr; gap: 24px 8%; }
.case-heading h1 { font-size: clamp(58px, 7.7vw, 126px); line-height: .97; font-weight: 400; letter-spacing: -.04em; }
.case-heading h1.long-title, .case-ins .case-heading h1 { font-size: clamp(42px, 6.4vw, 106px); }
.case-lede { font-size: clamp(17px, 1.6vw, 24px); color: var(--muted); line-height: 1.5; }
.case-cover, .case-cover > .artwork { position: relative; aspect-ratio: 8 / 5; width: 100%; height: auto; max-height: none; overflow: hidden; }
.case-cover .case-cover-image { width: 100%; height: 100%; object-fit: cover; }
.case-index { top: var(--header); background: rgb(251 251 250 / .96); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.chapter-link, .chapter-link:hover { border-radius: 0; transform: none; }
.case-section { scroll-margin-top: 185px; }
.project-viz { padding: 45px 0 65px; margin-bottom: 45px; }
.viz-title { display: flex; justify-content: space-between; gap: 35px; align-items: baseline; margin-bottom: 44px; }
.viz-title .micro { color: var(--muted); }
.viz-title h2 { font-size: clamp(28px, 3.1vw, 47px); letter-spacing: -.035em; line-height: 1.1; }
.viz-bars { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 35px; }
.viz-bar > div { display: flex; flex-direction: column; gap: 12px; }
.viz-bar strong { font-size: clamp(38px, 4.5vw, 66px); font-weight: 400; line-height: 1; letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.viz-bar span { font-size: 12px; line-height: 1.5; color: var(--muted); max-width: 25ch; }
.viz-bar i { position: relative; display: block; height: 3px; background: var(--panel); margin-top: 24px; overflow: hidden; }
.viz-bar b { display: block; height: 100%; width: var(--value); background: var(--pink); transform-origin: left; }
.viz-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; list-style: none; margin: 48px 0 0; padding: 0; }
.viz-flow li { display: grid; gap: 10px; }
.viz-flow span { font: 10px var(--mono); color: var(--pink); }
.viz-flow b { font-size: 15px; font-weight: 400; letter-spacing: -.02em; }
.error-page { padding: 190px var(--pad) 70px; min-height: 60svh; }
.error-page h1 { font-size: clamp(60px, 10vw, 160px); letter-spacing: -.04em; }

/* Living case studies: light editorial typography and independent motion layers. */
.case-body .brand,
.case-body .case-main :is(h1, h2, h3, h4, strong, b),
.case-body .case-main .decision-insight { font-weight: 400; }
.case-body :is(.case-lede, .case-meta p, .chapter-copy > p, .quick-read-grid > article > p) { font-weight: 300; }
.case-body .chapter-copy h2 { letter-spacing: -.025em; }
.case-body .case-lede, .case-body .case-meta p { color: #444441; }
.case-introduction { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(0, 2.2fr); gap: clamp(40px, 6vw, 96px); align-items: start; padding: 88px 0 76px; }
.case-introduction .case-heading { grid-column: 2; grid-row: 1; display: block; padding: 0; }
.case-introduction .case-heading > .eyebrow { margin-bottom: 20px; }
.case-body .case-introduction .case-heading h1 { font-weight: 300; font-size: clamp(44px, 5.7vw, 90px); letter-spacing: .02em; line-height: 1.06; margin: 0 0 27px; }
.case-body .case-introduction .case-heading h1.long-title,
.case-body.case-ins .case-introduction .case-heading h1 { font-size: clamp(39px, 4.8vw, 76px); }
.case-introduction .case-lede { max-width: 46ch; font-size: clamp(18px, 1.65vw, 25px); line-height: 1.65; padding: 0; }
.case-introduction .case-meta { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; gap: 36px; padding: 5px 0 0; margin: 0; }
.case-introduction .case-meta h2 { color: var(--muted); margin-bottom: 10px; }


.case-introduction .case-meta p { max-width: 30ch; font-size: 16px; line-height: 1.65; }

.case-process-item { min-width: 0; }
.process-drift { position: relative; }
.process-drift.is-drifting { will-change: transform; }
.process-visual { overflow: hidden; border-radius: 6px; }
.process-visual > img { display: block; width: 100%; height: auto; }
.case-content .case-process-item > figcaption { margin-top: 32px; font-family: var(--mono); font-weight: 400; color: #676762; }
.case-process-pair { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); column-gap: clamp(40px, 7vw, 100px); row-gap: 80px; align-items: start; }
.case-process-pair > .case-process-item:nth-child(even) { margin-top: 160px; }
.case-process-sequence { align-items: start; row-gap: 80px; }
.case-process-sequence > .case-process-item:nth-child(even) { margin-top: 56px; }
@media (hover: hover) and (pointer: fine) {
  .process-visual > img, .process-visual > .media-frame { transition: transform .8s var(--ease); }
  .case-process-item:hover .process-visual > img,
  .case-process-item:hover .process-visual > .media-frame { transform: scale(1.01); }
}
@media (max-width: 1000px) {
  .case-introduction { grid-template-columns: minmax(160px, 1fr) minmax(0, 2fr); gap: 38px; padding: 64px 0 62px; }
  .case-process-pair { column-gap: 40px; }
  .case-process-pair > .case-process-item:nth-child(even) { margin-top: 80px; }
  .case-process-sequence > .case-process-item:nth-child(even) { margin-top: 36px; }
}
@media (max-width: 700px) {
  .case-introduction { display: flex; flex-direction: column; gap: 40px; padding: 44px 0 54px; }
  .case-body .case-introduction .case-heading h1 { font-size: clamp(42px, 11vw, 70px); }
  .case-body .case-introduction .case-heading h1.long-title,
  .case-body.case-ins .case-introduction .case-heading h1 { font-size: clamp(34px, 9vw, 55px); }
  .case-introduction .case-lede { margin-top: 0; font-size: 18px; }
  .case-introduction .case-meta { gap: 24px; width: 100%; }
  .case-introduction .case-meta p { max-width: 48ch; font-size: 15px; }
  .case-process-pair { grid-template-columns: minmax(0, 1fr); gap: 42px; }
  .case-process-pair > .case-process-item:nth-child(n),
  .case-process-sequence > .case-process-item:nth-child(n) { margin-top: 0; }
  .case-process-sequence { row-gap: 38px; }
  .case-content .case-process-item > figcaption { margin-top: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .process-drift, .process-visual, .process-visual > img, .process-visual > .media-frame,
  .case-process-item > figcaption { transform: none !important; clip-path: none !important; opacity: 1 !important; will-change: auto; }
}
@media print {
  [data-reveal], .process-drift, .process-visual, .case-process-item > figcaption { transform: none !important; clip-path: none !important; opacity: 1 !important; }
  .case-process-item { break-inside: avoid; }
}


/* Work — a visible contents list, then six uninterrupted case-study links. */
.work-intro { padding: 156px 0 56px; }
.work-intro > .eyebrow { color: var(--muted); }
.work-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-top: 28px; }
.work-heading h1 { font-size: clamp(62px, 7.3vw, 126px); font-weight: 300; letter-spacing: -.045em; line-height: 1.1; }
.work-heading > p { font-size: 15px; color: var(--muted); line-height: 1.6; margin-bottom: 8px; }
.work-index { margin-top: 48px; }
.work-index ol { list-style: none; display: grid; grid-template-columns: 1.25fr 1fr 1fr; column-gap: 55px; row-gap: 8px; padding: 0; margin: 0; }
.work-index a { display: flex; align-items: center; gap: 20px; min-height: 44px; font-size: 14px; }
.work-index a > :last-child { margin-left: auto; opacity: 0; transition: opacity .4s var(--ease), transform .6s var(--ease); }
.work-index a:hover > :last-child, .work-index a:focus-visible > :last-child { opacity: 1; transform: translate3d(0,3px,0); }
.project-gallery { display: grid; grid-template-columns: minmax(0,1.18fr) minmax(0,1fr); column-gap: clamp(40px, 7vw, 118px); row-gap: 108px; align-items: start; padding-bottom: 25px; }
.project-card { min-width: 0; scroll-margin-top: calc(var(--header) + 30px); }
.project-card:first-child { grid-column: 1 / -1; width: 88%; }
.project-card:nth-child(3), .project-card:nth-child(5) { margin-top: 148px; }
.project-card:last-child { grid-column: 1 / -1; width: 76%; justify-self: end; }
.project-link { display: block; }
.project-window { position: relative; background: var(--panel); }
.window-viewport { position: relative; overflow: hidden; aspect-ratio: 8 / 5; }
.project-image { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.project-caption { display: grid; grid-template-columns: 28px minmax(0, 1fr) 24px; gap: 15px; margin-top: 24px; align-items: start; }
.project-caption .technical-index { padding-top: 8px; }
.project-caption :is(h2,h3) { font-size: clamp(25px, 2.4vw, 38px); font-weight: 300; line-height: 1.18; letter-spacing: -.025em; }
.project-caption p { margin-top: 10px; font-size: 11px; color: var(--muted); }
.project-caption .project-description { font-size: 14px; line-height: 1.55; max-width: 40ch; margin-top: 14px; }
.project-arrow { font-size: 24px; line-height: 1.35; transition: transform .8s var(--ease); }
@media (hover: hover) and (pointer: fine) {
  .project-link:hover .project-image { transform: scale(1.018); }
  .project-link:hover .project-arrow { transform: translate3d(3px,-3px,0); }
}
.project-link:focus-visible .project-arrow { transform: translate3d(3px,-3px,0); }

/* Existing cases keep their evidence, prototypes and clear reading structure. */
.project-hero-expanded { padding-top: calc(var(--header) + 28px); }
.project-hero-expanded .case-topline { margin-bottom: 24px; }
.project-window--hero { width: min(100%, calc(72svh * 1.6)); margin-left: auto; }
.project-window--hero .project-image { transform: none; }
.case-heading h1, .about-title { font-weight: 300; }
.case-index { top: var(--header); background: var(--paper); }
.chapter-link, .chapter-link:hover { transform: none; border-radius: 0; }
.about-intro { padding-top: 156px; }
.about-title { letter-spacing: -.035em; }
.error-page { padding: 190px var(--pad) 70px; min-height: 60svh; }
.error-page h1 { font-size: clamp(60px, 10vw, 160px); letter-spacing: -.04em; }

@media (min-width: 1800px) { .identity-hero { padding-top: 180px; } }
@media (max-width: 1050px) {
  .site-header { column-gap: 24px; }
  .main-nav { gap: 26px; }
  .identity-hero { padding-top: 142px; }
  .identity-note { grid-column: 1 / 6; gap: 14px; }
  .identity-statement, .work-invitation { grid-column: 6 / -1; }
  .work-heading { display: block; }
  .work-heading > p { margin: 25px 0 0; }
  .work-index ol { column-gap: 32px; }
  .project-card:first-child { width: 100%; }
  .project-card:nth-child(3), .project-card:nth-child(5) { margin-top: 90px; }
  .project-caption { gap: 10px; grid-template-columns: 22px minmax(0,1fr) 20px; }
  .project-caption :is(h2,h3) { font-size: 27px; }
  .about-columns { gap: 8%; }
  .portrait { margin-left: 0; }
  .case-heading { grid-template-columns: 1fr; }
  .case-lede { grid-column: 1; max-width: 48ch; }
}
@media (max-width: 700px) {
  :root { --header: 112px; --pad: 22px; }
  .site-header { grid-template-columns: 1fr auto; grid-template-rows: 58px 48px; padding-top: 6px; column-gap: 15px; }
  .brand { font-size: 17px; }
  .language-switch { grid-column: 2; grid-row: 1; }
  .main-nav { grid-column: 1 / -1; grid-row: 2; justify-content: space-between; gap: 20px; }
  .nav-link { font-size: 12px; }
  .identity-hero { padding-top: 161px; padding-bottom: 52px; column-gap: 14px; min-height: auto; }
  .identity-topline { margin-bottom: 30px; font-size: 8px; gap: 20px; }
  .identity-topline > :last-child { text-align: right; max-width: 85px; }
  .identity-name { font-size: 15.65vw; gap: .12em; }
  .identity-note { grid-column: 1 / -1; margin-top: 34px; gap: 15px; }
  .identity-note p { font-size: 12px; }
  .identity-statement { grid-column: 2 / -1; margin-top: 44px; }
  .identity-statement > p { font-size: clamp(29px, 7.9vw, 54px); }
  .identity-statement > span { font-size: 10px; margin-top: 20px; }
  .work-invitation { grid-column: 2 / -1; margin-top: 35px; min-height: 70px; }
  .invitation-label { font-size: 23px; }
  .invitation-label small { font-size: 10px; max-width: 25ch; }
  .invitation-arrow { font-size: 39px; }
  .identity-about { grid-column: 1 / -1; grid-row: auto; margin-top: 26px; font-size: 12px; }
  .work-intro { padding-top: 160px; padding-bottom: 42px; }
  .work-heading { margin-top: 22px; }
  .work-heading h1 { font-size: clamp(42px, 10.5vw, 72px); }
  .work-heading > p { font-size: 14px; margin-top: 24px; }
  .work-index { margin-top: 32px; }
  .work-index ol { grid-template-columns: 1fr 1.25fr; gap: 5px 20px; }
  .work-index a { font-size: 12px; gap: 12px; }
  .work-index a > :last-child { display: none; }
  .project-gallery { display: block; padding: 0; }
  .project-card:nth-child(n) { width: 100%; margin: 0 0 68px; }
  .project-caption { grid-template-columns: 22px minmax(0,1fr) 18px; margin-top: 20px; gap: 9px; }
  .project-caption :is(h2,h3) { font-size: 26px; }
  .project-caption p { font-size: 10px; }
  .project-caption .project-description { font-size: 13px; margin-top: 11px; }
  .project-caption .technical-index { padding-top: 6px; }
  .project-window--hero { width: 100%; }
  .about-intro { padding-top: 160px; }
  .about-title { font-size: 11.5vw; margin-bottom: 52px; }
  .about-columns { display: flex; flex-direction: column; align-items: stretch; gap: 42px; }
  .portrait { width: 310px; max-width: 90%; }
  .about-lede { font-size: 33px; }
  .about-copy p { font-size: 15px; }
  .viz-title { display: block; }
  .viz-title h2 { margin-top: 20px; }
  .viz-bars, .viz-flow { grid-template-columns: 1fr 1fr; gap: 28px 22px; }
  .viz-bar strong { font-size: 40px; }
}
@media (max-width: 360px) {
  :root { --pad: 18px; }
  .identity-topline { font-size: 7px; }
  .work-index ol { column-gap: 12px; }
  .work-index a { gap: 7px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  [data-hero-line], [data-reveal], .name-kinetic, .project-image, .process-drift { transform: none !important; clip-path: none !important; opacity: 1 !important; }
  html.shared-entry::before { display: none; }
}
@media print {
  .site-header, .page-transition, .skip-link, .language-switch { display: none; }
  [data-reveal], [data-hero-line], .name-kinetic { transform: none !important; clip-path: none !important; opacity: 1 !important; }
  .work-intro, .identity-hero { padding-top: 30px; }
  .project-card { break-inside: avoid; }
}

/* Signature, readable links and staggered motion. */
:root { --pink-ink: #ca1e61; --rose-paper: #f13b85; --mono: var(--font); }
.site-header { height: var(--header); background: rgb(251 251 250 / .9); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.brand { font-size: 19px; letter-spacing: -.035em; font-weight: 400; color: var(--pink-ink); }
.main-nav { gap: clamp(28px, 3vw, 48px); }
.nav-link { font-size: 14px; }
.nav-link::after, .text-link::after { content: none; }
.nav-link:hover, .nav-link:focus-visible, .nav-link[aria-current], .language-switch a:hover,
.text-link:hover, .text-link:focus-visible, .quiet-link:hover, .quiet-link:focus-visible { color: var(--pink-ink); }
.language-switch a[aria-current] { text-decoration: none; color: var(--pink-ink); }
.eyebrow, .micro { font-family: var(--font); letter-spacing: .035em; font-size: 11px; }
.section-kicker { font-size: 13px; line-height: 1.5; }
.quiet-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; }

[data-drift] { transform-origin: center; }


/* Text remains semantic. One shared Canvas surface follows the active title. */
[data-liquid] { position: relative; }
.liquid-canvas { position: absolute; display: block; pointer-events: none; z-index: 4; max-width: none; }
.is-liquid > .liquid-ink { opacity: 0; }
.liquid-ink { display: inline; }
.word-mask { display: inline-block; overflow: hidden; vertical-align: bottom; padding: .11em .02em .13em; margin: -.11em -.02em -.13em; }
.word-rise { display: inline-block; }

/* Work: rhythm in media size; titles stay adjacent to their images. */
.work-intro { padding-top: 160px; padding-bottom: 70px; }
.work-heading h1 { font-size: clamp(52px,7vw,108px); letter-spacing: -.05em; }
.work-index { margin-top: 35px; }
.work-index ol { display: flex; flex-wrap: wrap; gap: 5px 30px; }
.work-index a { font-size: 13px; }
.work-index a > :last-child { margin: 0; opacity: 1; transform: none; }
.work-index a:hover, .work-index a:focus-visible { color: var(--pink-ink); }
.project-caption { display: flex; gap: 22px; margin-top: 23px; justify-content: space-between; }
.project-caption > div { min-width: 0; }
.project-caption :is(h2,h3) { font-size: clamp(26px,2.5vw,39px); letter-spacing: -.04em; line-height: 1.25; }
.project-caption p { font-size: 12px; }
.project-caption .project-description { margin-top: 8px; }
.project-gallery { row-gap: 105px; column-gap: 7%; }
.project-card:first-child { width: 92%; }
.project-card:last-child { width: 83%; }
.project-arrow { color: var(--pink-ink); flex: 0 0 auto; }
.project-window { overflow: visible; background: none; }
.project-link { position: relative; isolation: isolate; }

/* About: the original portrait, with room for the colour already in it. */
.about-title { font-size: clamp(52px,7.3vw,112px); line-height: 1.2; margin-bottom: 78px; }
.about-columns { grid-template-columns: 1fr 1.35fr; gap: 10%; }
.portrait { position: relative; isolation: isolate; margin-left: 5%; padding: 0; width: 340px; }
.about-copy { padding-bottom: 20px; }
.about-lede { font-size: clamp(31px,3.4vw,49px); line-height: 1.3; }

/* Case studies: stable reading column, grouped metadata and aligned media. */
.case-introduction { max-width: 1180px; margin: auto; display: block; padding: 68px 0 60px; }
.case-body .case-introduction .case-heading h1 { font-size: clamp(42px,5.4vw,80px); letter-spacing: -.035em; max-width: 20ch; }
.case-introduction .case-lede { max-width: 60ch; line-height: 1.65; font-size: clamp(17px,1.6vw,23px); }
.case-introduction .case-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 7%; padding-top: 40px; }
.case-introduction .case-meta p { max-width: 50ch; font-size: 14px; }
.case-introduction .case-meta h2 { color: var(--pink-ink); }
.case-layout { display: grid; grid-template-columns: minmax(140px,.23fr) minmax(0,1fr); gap: 6%; align-items: start; }
.case-index { position: sticky; top: calc(var(--header) + 20px); display: block; padding: 0; margin: 0; background: transparent; max-height: calc(100svh - var(--header) - 40px); }
.case-nav { display: flex; flex-direction: column; gap: 5px; overflow: visible; }
.chapter-link { min-height: 38px; padding: 8px 10px; white-space: normal; font-size: 12px; }
.chapter-link:hover, .chapter-link[aria-current=location] { background: var(--rose-paper); color: var(--ink); }
.case-content { width: 100%; max-width: 1050px; margin: 0; }
.case-section { margin-block: 75px; }
.chapter-copy { margin-bottom: 28px; }
.chapter-copy h2 { font-size: clamp(29px,3vw,43px); letter-spacing: -.035em; line-height: 1.3; }
.chapter-copy > p { margin-top: 21px; font-size: 16px; max-width: 62ch; }
.case-process-pair > .case-process-item:nth-child(n), .case-process-sequence > .case-process-item:nth-child(n) { margin-top: 0; }
.case-process-pair, .case-process-sequence { gap: 35px 25px; }
.case-content .case-process-item > figcaption { margin-top: 14px; font-family: var(--font); }
.case-process-pair { grid-template-columns: 1fr 1fr; }
.case-decision-grid, .case-conclusion-grid { gap: 28px; }
.case-overview { scroll-margin-top: calc(var(--header) + 25px); }


@media (max-width: 1050px) {
  .case-layout { grid-template-columns: 155px minmax(0,1fr); gap: 25px; }
  .case-decision-grid, .case-conclusion-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .brand { font-size: 18px; }
  .nav-link { font-size: 13px; }
  .main-nav { gap: 20px; }
  .work-intro { padding-top: 150px; padding-bottom: 38px; }
  .work-heading h1 { font-size: clamp(39px,9.6vw,68px); }
  .work-index ol { gap: 0 24px; }
  .work-index a > :last-child { display: block; }
  .project-caption { margin-top: 19px; }
  .project-caption :is(h2,h3) { font-size: 26px; }
  .project-card:nth-child(n) { width: 100%; margin-bottom: 70px; }
  .about-title { font-size: 10.7vw; margin-bottom: 50px; }
  .about-columns { display: flex; gap: 65px; }
  .portrait { width: 76%; max-width: 340px; margin: 0; }
  .about-lede { font-size: 31px; }
  .case-introduction { padding-block: 40px; }
  .case-introduction .case-meta { grid-template-columns: 1fr; gap: 22px; }
  .case-layout { display: block; }
  .case-index { top: var(--header); z-index: 20; background: var(--paper); padding: 8px 0; margin-bottom: 38px; overflow: visible; max-height: none; }
  .case-index > .eyebrow { display: none; }
  .case-nav { flex-direction: row; gap: 10px; overflow-x: auto; scrollbar-width: thin; }
  .chapter-link { flex: 0 0 auto; white-space: nowrap; font-size: 11px; }
  .case-process-pair { grid-template-columns: 1fr; }
  .case-section { margin-block: 60px; }
  .chapter-copy h2 { font-size: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .liquid-canvas { display: none !important; }
  .is-liquid > .liquid-ink { opacity: 1 !important; }
  .word-rise, [data-drift], [data-reveal], [data-hero-line] { transform: none !important; opacity: 1 !important; clip-path: none !important; }
}
@media print {
  .liquid-canvas { display: none !important; }
  .is-liquid > .liquid-ink { opacity: 1 !important; }
  .word-rise, [data-drift] { transform: none !important; }
}

/* V42: saturated raspberry, centered typographic stage, visual film interlude. */
:root { --pink: #f13b85; --pink-ink: #ca1e61; --rose-paper: #f13b85; --paper: #fbfbfa; }
.site-header { background: rgb(251 251 250 / .94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.nav-link:hover, .nav-link:focus-visible, .nav-link[aria-current] { color: var(--pink-ink); }
.studio-hero { padding: 148px var(--pad) 90px; margin: auto; max-width: 1800px; text-align: center; }
.studio-intro { font-size: 16px; margin-bottom: 33px; }
.studio-title { font-size: clamp(64px,9.3vw,152px); line-height: 1.04; font-weight: 400; letter-spacing: .015em; }
.studio-title > .hero-line { padding: .12em .42em .24em; margin: -.12em -.42em -.24em; }
.studio-title > .hero-line + .hero-line { margin-top: .07em; color: var(--pink); }
.studio-title [data-liquid] { display: inline-block; }
.studio-profession { display: block; font-size: clamp(14px,1.3vw,20px); letter-spacing: .075em; margin-top: 28px; }
.studio-bottom { display: grid; grid-template-columns: 1fr 240px 1fr; align-items: center; gap: 7%; max-width: 1100px; margin: 52px auto 0; }
.studio-caption { justify-self: start; text-align: left; font-size: 12px; line-height: 1.9; }
.studio-portrait { width: 158px; justify-self: center; }
.studio-portrait img { width: 100%; height: auto; }
.studio-portrait figcaption { font-size: 10px; line-height: 1.6; margin: 14px -30px 0; }
.studio-scroll { display: flex; align-items: center; gap: 18px; justify-self: end; font-size: 12px; min-height: 44px; }
.studio-scroll span { font-size: 25px; color: var(--pink-ink); }
.studio-scroll:hover { color: var(--pink-ink); }

.motion-feature { max-width: 1800px; margin: auto; padding: 64px var(--pad) 0; }
.motion-feature-top { display: flex; justify-content: space-between; gap: 35px; align-items: end; margin-bottom: 35px; }
.motion-feature-top > p { font-size: 13px; margin-bottom: 10px; }
.motion-feature h2 { font-size: clamp(46px,6.5vw,110px); letter-spacing: .02em; font-weight: 400; line-height: 1.1; }
.motion-film { width: 100%; }
.film-aperture { overflow: hidden; transform-origin: center center; }
.motion-film video { width: 100%; height: auto; aspect-ratio: 848/480; object-fit: contain; background: #000; }
.motion-film figcaption { display: flex; align-items: center; justify-content: space-between; gap: 25px; font-size: 11px; margin-top: 12px; color: var(--muted); }
.motion-film button { border: 0; background: transparent; padding: 12px 0 12px 20px; min-height: 44px; font-size: 11px; color: var(--pink-ink); }

.studio-about { padding: 148px var(--pad) 128px; max-width: 1500px; margin: auto; }
.studio-about > .section-kicker { margin-bottom: 42px; }
.studio-about h2 { font-size: clamp(38px,5.5vw,84px); letter-spacing: -.035em; line-height: 1.24; font-weight: 300; }
.studio-about h2 > span { display: block; }
.pink-phrase { color: var(--pink-ink); }
.studio-about-foot { display: flex; align-items: end; justify-content: space-between; gap: 12%; margin-top: 42px; }
.studio-about-foot > p { max-width: 40ch; font-size: 15px; line-height: 1.75; }
.studio-about-foot > a { flex: 0 0 auto; }

.studio-work { padding: 98px var(--pad) 94px; background: var(--ink); color: var(--paper); }
.studio-work > .section-kicker { color: var(--pink); }
.studio-work-link { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin: 37px 0 38px; }
.studio-work h2 { font-weight: 400; font-size: clamp(62px,12.5vw,202px); line-height: 1.1; letter-spacing: .02em; }
.studio-work-link > span { font-size: clamp(40px,7vw,90px); color: var(--pink); }
.studio-work-foot { display: flex; justify-content: space-between; gap: 30px; align-items: end; }
.studio-work-foot > p { font-size: 14px; max-width: 32ch; }
.studio-work-foot > span { font-size: 10px; color: var(--pink); }
.work-heading h1 { font-weight: 400; letter-spacing: .02em; font-size: clamp(64px,10.5vw,156px); }
.project-caption :is(h2,h3) { font-weight: 400; }
.chapter-link:hover, .chapter-link[aria-current=location] { background: var(--pink); color: var(--ink); }
.liquid-canvas { pointer-events: none; }
.liquid-glyph { display: inline-block; white-space: pre; transform-origin: center; }
.is-liquid-dom > .liquid-ink { opacity: 1; }
/* A selected heading remains available to assistive technology as normal text. */
[data-liquid] { touch-action: pan-y; }

@media (max-width: 1050px) {
 .studio-title { font-size: 9.15vw; }
 .studio-bottom { grid-template-columns: 1fr 190px 1fr; gap: 5%; }
 .studio-caption { font-size: 11px; }
 .studio-portrait { width: 145px; }
 .studio-about { padding-block: 105px; }
}
@media (max-width: 700px) {
 .studio-hero { padding: 154px 18px 56px; }
 .studio-intro { font-size: 13px; margin-bottom: 30px; }
 .studio-title { font-size: 9.5vw; letter-spacing: .008em; line-height: 1.2; }
 .studio-title > .hero-line { padding-inline: .15em; margin-inline: -.15em; }
 .studio-title > .hero-line + .hero-line { margin-top: .08em; }
 .studio-profession { font-size: 12px; margin-top: 22px; }
 .studio-bottom { grid-template-columns: 1fr 1fr; gap: 28px 14px; margin-top: 38px; }
 .studio-portrait { grid-column: 1 / -1; grid-row: 1; width: 146px; }
 .studio-portrait figcaption { font-size: 10px; margin-top: 12px; }
 .studio-caption { grid-column: 1; grid-row: 2; font-size: 10px; }
 .studio-scroll { grid-column: 2; grid-row: 2; font-size: 10px; gap: 12px; }
 .motion-feature { padding-top: 32px; }
 .motion-feature-top { display: block; margin-bottom: 24px; }
 .motion-feature-top > p { font-size: 11px; margin-bottom: 24px; }
 .motion-feature h2 { font-size: 10vw; letter-spacing: .01em; }
 .motion-film { width: calc(100% + var(--pad)*2); margin-inline: calc(-1*var(--pad)); }
 .motion-film figcaption { padding-inline: var(--pad); gap: 15px; font-size: 9px; }
 .motion-film button { font-size: 10px; padding-left: 0; white-space: nowrap; }
 .studio-about { padding-block: 80px; }
 .studio-about > .section-kicker { font-size: 11px; margin-bottom: 30px; }
 .studio-about h2 { font-size: 8.3vw; line-height: 1.35; }
 .studio-about-foot { display: block; margin-top: 30px; }
 .studio-about-foot > p { font-size: 14px; }
 .studio-about-foot > a { margin-top: 19px; }
 .studio-work { padding-block: 66px; }
 .studio-work-link { gap: 10px; margin-block: 30px; }
 .studio-work h2 { font-size: 12vw; letter-spacing: .01em; }
 .studio-work-link > span { font-size: 31px; }
 .studio-work-foot { display: block; }
 .studio-work-foot > p { font-size: 13px; }
 .studio-work-foot > span { display: block; margin-top: 27px; font-size: 9px; }
 .work-heading h1 { font-size: 12vw; }
}
@media (prefers-reduced-motion: reduce) {
 .liquid-glyph { transform: none !important; }
 .is-liquid-dom > .liquid-ink { opacity: 1 !important; }
}
/* Scroll choreography: each scene follows the position of the page. */
.scroll-portrait,.scroll-copy-ink { display: block; }
.scroll-copy-mask { display: block; overflow: hidden; padding: .08em .02em .13em; margin: -.08em -.02em -.13em; }
.studio-hero { overflow: clip; }
.motion-feature.is-scroll-enhanced { height: 185svh; padding-top: 48px; }
.motion-feature.is-scroll-enhanced .motion-sticky { position: sticky; top: calc(var(--header) + 18px); }
.motion-feature.is-scroll-enhanced .motion-feature-top { margin-bottom: 24px; }
.motion-feature.is-scroll-enhanced h2 { font-size: clamp(40px,5vw,76px); }
.motion-feature.is-scroll-enhanced .motion-film { width: 100%; margin: 0; }
.motion-feature.is-scroll-enhanced .film-aperture { background: #000; transform-origin: center center; }
.motion-feature.is-scroll-enhanced video { height: 54svh; max-height: 610px; width: 100%; aspect-ratio: auto; object-fit: contain; }
.motion-feature.is-scroll-enhanced .motion-film figcaption { margin-top: 16px; }
.studio-about { padding-block: 118px; }
.studio-work { overflow: clip; }

/* Visual case studies: meaning, media and evidence sit together. */
.visual-case .case-main { --pink: var(--case-accent); --pink-ink: var(--case-accent); }
.visual-case .case-layout { grid-template-columns: 132px minmax(0,1fr); gap: 46px; }
.visual-case .case-content { max-width: 1200px; }
.visual-case .case-introduction { max-width: none; padding: 45px 0 42px; display: grid; grid-template-columns: 1.5fr 1fr; gap: 55px; }
.visual-case .case-introduction .case-heading { grid-column: 1; grid-row: 1; }
.case-body.visual-case .case-introduction .case-heading h1,
.case-body.visual-case .case-introduction .case-heading h1.long-title { font-size: clamp(38px,4.4vw,68px); margin-bottom: 20px; }
.visual-case .case-introduction .case-lede { font-size: 18px; max-width: 48ch; line-height: 1.6; }
.visual-case .case-introduction .case-meta { grid-column: 2; grid-row: 1; display: grid; grid-template-columns: 1fr; gap: 22px; padding-top: 5px; }
.visual-case .case-meta p { font-size: 12px; line-height: 1.6; }
.visual-case .case-index { padding-top: 6px; }
.visual-case .chapter-link { font-size: 11px; white-space: normal; padding: 8px 6px; border-radius: 0; }
.visual-case .chapter-link:hover,.visual-case .chapter-link[aria-current=location] { background: var(--case-soft); color: var(--case-dark); }
.visual-case .case-section { margin-block: 80px; }
.visual-case .case-section--visual { display: grid; grid-template-columns: minmax(190px,.65fr) minmax(0,1.9fr); column-gap: 34px; align-items: start; }
.visual-case .case-section--visual > .chapter-copy { grid-column: 1; grid-row: 1 / span 8; margin: 0; }
.visual-case .case-section--visual > :not(.chapter-copy) { grid-column: 2; min-width: 0; }
.visual-case .case-section--visual > .chapter-visual { margin-top: 0; }
.visual-case .chapter-copy > .eyebrow { margin-bottom: 15px; font-size: 9px; }
.visual-case .chapter-copy h2 { font-size: clamp(27px,2.3vw,37px); line-height: 1.2; letter-spacing: -.025em; }
.visual-case .chapter-copy > p { font-size: 14px; line-height: 1.65; margin-top: 20px; }
.visual-case .case-content details.study-notes { background: transparent; padding: 0; margin-top: 25px; }
.visual-case .case-content details.study-notes > summary { min-height: 46px; color: var(--case-accent); font-size: 12px; }
.visual-case .notes-content { padding: 20px 0 28px; }
.visual-case .notes-content .decision-overview { margin-block: 30px; }
.visual-case .notes-content .quick-read-grid { display: block; }
.visual-case .notes-content .quick-read-grid > article + article { margin-top: 20px; }
.visual-case .notes-content .quick-read-grid > article > p { font-size: 16px; }
.visual-case .notes-content .case-decision-grid { grid-template-columns: 1fr; gap: 22px; }
.visual-case .notes-content .case-decision-grid p { font-size: 14px; }

/* Accessible process maps use each project's own palette. */
.experience-map { padding: 26px 26px 30px; background: var(--case-soft); color: var(--case-dark); }
.visual-case .experience-map .map-heading { font-size: 12px !important; color: var(--case-accent); margin: 0 0 28px; }
.flow-track { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); list-style: none; padding: 0; margin: 0; gap: 25px; position: relative; }
.flow-track::before { content: ''; height: 1px; position: absolute; top: 27px; left: 28px; right: 28px; background: currentColor; opacity: .24; }
.flow-track > li { position: relative; min-width: 0; }
.flow-icon { width: 52px; height: 55px; padding: 4px 7px; background: var(--case-soft); color: var(--case-accent); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.visual-case .flow-track h3 { font-size: 18px; margin: 17px 0 8px; font-weight: 400; letter-spacing: -.025em; }
.visual-case .flow-track p { font-size: 12px; line-height: 1.5; color: var(--case-dark); }
.visual-case .experience-map .map-caption { font-size: 12px; line-height: 1.6; margin-top: 24px; }
.case-evidence-strip { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; padding: 26px 0 5px; }
.case-evidence-strip > div { display: flex; flex-direction: column-reverse; align-self: start; gap: 8px; }
.case-evidence-strip dd { font-size: 22px; color: var(--case-accent); line-height: 1.2; letter-spacing: -.02em; }
.case-evidence-strip dt { font-size: 11px; color: var(--muted); line-height: 1.5; }
.visual-case .mapping-diagram .flow-track { grid-template-columns: repeat(3,minmax(0,1fr)); }
.visual-case .chapter-visual .flow-track { grid-template-columns: repeat(2,minmax(0,1fr)); row-gap: 28px; }
.visual-case .chapter-visual .flow-track::before { display: none; }
.visual-case .chapter-visual.experience-map { padding: 24px; }

/* ALÇAR: insight → spatial response, a six-moment atlas, and real test values. */
.visual-case .decision-map { gap: 24px; }
.visual-case .decision-map > div { display: grid; grid-template-columns: 1fr 24px 1fr; gap: 12px; padding: 22px; background: var(--case-soft); }
.decision-map .decision-number { display: none; }
.decision-map .decision-insight { grid-column: 1; font-size: 13px; color: var(--case-accent); }
.decision-map .decision-connector { grid-column: 2; transform: rotate(-90deg); }
.visual-case .decision-map h3 { grid-column: 3; font-size: 19px; }
.visual-case .decision-map p { grid-column: 3; font-size: 12px; margin: 0; }
.journey-atlas > ol { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; list-style: none; padding: 0; margin: 0; }
.journey-atlas li { min-width: 0; }
.journey-atlas img { display: block; width: 100%; height: 150px; object-fit: contain; background: var(--case-dark); }
.visual-case .journey-atlas h3 { font-size: 19px; margin: 13px 0 5px; }
.visual-case .journey-atlas li p { font-size: 12px; line-height: 1.5; }
.journey-atlas > .study-note { margin-top: 22px; }
.visual-case .validation-board { padding: 26px; }
.visual-case .validation-label > p { margin-top: 12px; font-size: 22px; line-height: 1.25; }
.visual-case .validation-row,.task-time { display: grid; grid-template-columns: minmax(100px,1.3fr) minmax(70px,1.6fr) 55px; gap: 15px; align-items: center; margin-block: 24px; }
.visual-case .validation-row > span:first-child,.task-time > span:first-child { font-size: 12px; line-height: 1.4; }
.rating-track { display: block; height: 9px; background: var(--paper); overflow: hidden; }
.rating-track > i { display: block; width: 100%; height: 100%; background: var(--case-accent); transform: scaleX(var(--ratio)); transform-origin: left; }
.visual-case .validation-row strong,.task-time strong { font-weight: 400; font-size: 13px; color: var(--case-dark); text-align: right; }
.validation-row strong small { font-size: 10px; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }
.visual-case .task-times { margin-top: 40px; }
.visual-case .task-times > figcaption { color: var(--case-accent); font-size: 12px !important; }
.visual-case .task-times .study-note { font-size: 10px; line-height: 1.5; }
.visual-case .proportion-bar,.visual-case .chart-axis { background: var(--case-soft); }
.visual-case .proportion-bar span,.visual-case .chart-bar { background: var(--case-accent); }
.visual-case .engagement-chart { grid-template-columns: 1fr; padding: 26px; }
.visual-case .engagement-chart > div:first-child > p { font-size: 25px; }
.visual-case .co-design-board { padding: 26px; }
.co-design-board > div { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-block: 28px; }
.co-design-board > div > span { max-width: 18ch; font-size: 17px; line-height: 1.3; }
.co-design-board > ul { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; padding: 0; }
.co-design-board > ul > li { background: var(--paper); padding: 8px 12px; font-size: 11px; }
.visual-case .visual-journey,.visual-case .touch-sequence,.visual-case .mesh-flow,.visual-case .making-sequence { padding: 22px; background: var(--case-soft); grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.visual-case :is(.visual-journey,.touch-sequence,.mesh-flow,.making-sequence) strong,
.visual-case :is(.visual-journey,.touch-sequence,.mesh-flow,.making-sequence) h3 { font-size: 19px; }

/* Respect source resolution and prevent idle image transforms from softening it. */
.visual-case .media-phones { grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 30px 18px; align-items: start; }
.visual-case .media-frame > img,.visual-case .media-frame > .image-open > img { width: auto; max-width: 100%; height: auto; max-height: 410px; object-fit: contain; }
.visual-case .case-process-item:hover .process-visual > img,
.visual-case .case-process-item:hover .process-visual > .media-frame,
.visual-case .image-open:hover img { transform: none; }
.visual-case .process-visual img { filter: none; }
.visual-case .source-small { width: min(100%,var(--source-cap)) !important; height: auto !important; max-height: none !important; margin-inline: auto; }
.visual-case .v48-apart-flow { gap: 22px; }
.visual-case .media-identity-separated { grid-template-columns: .55fr 1.45fr; }
.visual-case .media-identity-separated .media-frame { height: auto; min-height: 215px; padding: 22px; }
.visual-case .media-identity-separated .identity-symbol .media-frame { min-height: 215px; }
.visual-case .media-identity-separated img { width: auto; max-height: 430px; }
.visual-case .study-media.media-photo img,.visual-case .media-setup img { max-height: 490px; }
.visual-case .invitation-editorial { padding: 22px; gap: 22px; }
.visual-case .invitation-guide h3 { font-size: 29px; }
.visual-case .word-wall { grid-template-columns: 1fr; padding: 22px; }
.visual-case .word-wall-stage { min-height: 275px; }
.visual-case .case-conclusion { margin-top: 75px; }
.visual-case .case-conclusion > h2 { font-size: 30px; max-width: 30ch; }

/* About: each discipline opens a real piece of work. */

@media(max-width:1100px){
 .visual-case .case-layout { grid-template-columns: 115px minmax(0,1fr); gap: 28px; }
 .visual-case .case-section--visual { display: block; }
 .visual-case .case-section--visual > .chapter-copy { max-width: 650px; margin-bottom: 27px; }
 .visual-case .chapter-copy h2 { font-size: 34px; }
 .visual-case .chapter-copy > p { max-width: 50ch; }
 .visual-case .chapter-visual .flow-track { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@media(max-width:799px){
 .motion-feature.is-scroll-enhanced { height: auto; padding-top: 35px; }
 .motion-feature.is-scroll-enhanced .motion-sticky { position: static; }
 .motion-feature.is-scroll-enhanced video { height: auto; max-height: none; aspect-ratio: 848/480; }
 .studio-about { padding-block: 84px; }
 .visual-case .case-introduction { display: block; padding-block: 35px; }
 .visual-case .case-introduction .case-meta { grid-template-columns: 1fr 1fr; padding-top: 28px; }
 .visual-case .case-layout { display: block; }
 .visual-case .case-index { position: static; max-height: none; padding: 0; margin-bottom: 28px; }
 .visual-case .case-nav { display: flex; flex-direction: row; overflow-x: auto; gap: 12px; padding-bottom: 10px; }
 .visual-case .chapter-link { white-space: nowrap; }
 .visual-case .case-section { margin-block: 64px; }
 .visual-case .flow-track,.visual-case .chapter-visual .flow-track,.visual-case .mapping-diagram .flow-track { display: block; }
 .flow-track::before { top: 20px; bottom: 20px; left: 26px; width: 1px; height: auto; right: auto; }
 .flow-track > li { display: grid; grid-template-columns: 55px 1fr; gap: 20px; align-items: center; }
 .flow-track > li + li { margin-top: 27px; }
 .visual-case .flow-track h3 { margin-top: 0; }
 .visual-case .chapter-visual .flow-track::before { display: block; }
 .case-evidence-strip { gap: 18px; }
 .case-evidence-strip dd { font-size: 18px; }
 .case-evidence-strip dt { font-size: 10px; }
 .visual-case .case-introduction .case-lede { font-size: 17px; }
 .visual-case .validation-row,.task-time { grid-template-columns: minmax(95px,1.2fr) minmax(60px,1.4fr) 48px; gap: 10px; }
 .visual-case .validation-row > .rating-track { grid-column: auto; grid-row: auto; }
 .journey-atlas img { height: 130px; }
 .visual-case .decision-map > div { display: block; }
 .visual-case .decision-map .decision-insight { display: block; margin-bottom: 14px; }
 .visual-case .decision-map .decision-connector { display: none; }
 .visual-case .decision-map h3 { font-size: 21px; }
 .visual-case .decision-map p { margin-top: 9px; }
 .visual-case .case-conclusion-grid { grid-template-columns: 1fr; }
 .visual-case .v48-apart-flow { grid-template-columns: 1fr; gap: 30px; }
 .visual-case .v48-apart-flow > figure { max-width: 260px; margin-inline: auto; }
}
@media(prefers-reduced-motion:reduce){
 [data-scroll-line],[data-scroll-layer] { transform: none !important; }
 .motion-feature.is-scroll-enhanced { height: auto; }
 .motion-feature.is-scroll-enhanced .motion-sticky { position: static; }
}
@media print{
 .motion-feature.is-scroll-enhanced { height: auto; }
 .motion-feature.is-scroll-enhanced .motion-sticky { position: static; }
 [data-scroll-line],[data-scroll-layer] { transform: none !important; }
}
/* V45: a personal introduction, then a pinned composition of real project assets. */
.home-introduction { display: grid; grid-template-columns: .65fr 2fr; gap: 9%; padding: 90px var(--pad) 155px; max-width: 1600px; margin: auto; scroll-margin-top: calc(var(--header) + 25px); }
.intro-kicker { font-size: 10px; letter-spacing: .04em; color: var(--muted); padding-top: 14px; }
.intro-body h2 { font-size: clamp(35px,4.4vw,70px); line-height: 1.2; font-weight: 300; letter-spacing: -.035em; }
.intro-name { color: var(--pink-ink); }
.intro-foot { max-width: 600px; display: grid; grid-template-columns: 1fr auto; gap: 42px; align-items: end; margin-top: 42px; }
.intro-foot > p { font-size: 14px; line-height: 1.8; max-width: 43ch; color: var(--muted); }
.intro-foot > a { white-space: nowrap; font-size: 12px; }

/* The covers contain their own composition: preserve the complete artwork. */
.project-cover { display: block; width: 100%; height: 100%; }
.project-cover > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.project-link:hover .project-cover > .project-image { transform: none; }
.next-project > a > .project-cover { max-width: 410px; justify-self: end; height: auto; aspect-ratio: 8/5; }
.next-project .project-cover > img { max-width: none; aspect-ratio: auto; }
@media(max-width:1050px){
 .home-introduction { grid-template-columns: .35fr 2fr; gap: 5%; padding-bottom: 105px; }
 .intro-body h2 { font-size: clamp(33px,4.8vw,54px); }
}
@media(max-width:700px){
 .home-introduction { display: block; padding: 70px var(--pad) 105px; }
 .intro-kicker { padding-top: 0; margin-bottom: 26px; font-size: 9px; }
 .intro-body h2 { font-size: clamp(27px,6.9vw,44px); line-height: 1.28; letter-spacing: -.035em; }
 .intro-foot { display: block; margin-top: 30px; }
 .intro-foot > p { font-size: 13px; max-width: 40ch; }
 .intro-foot > a { display: inline-flex; align-items: center; min-height: 44px; margin-top: 18px; }
 .window-viewport { aspect-ratio: 4/5; }
 .next-project > a > .project-cover { max-width: none; aspect-ratio: 4/5; }
}









/* All six projects form one sequence; native horizontal scrolling is the baseline. */
.screen-space { position: relative; }
.sequence-heading { padding: 80px var(--pad) 48px; text-align: center; }
.sequence-heading h2 { font-size: clamp(54px,11.4vw,176px); font-weight: 300; line-height: 1.15; letter-spacing: .025em; }
.sequence-heading h2 > span { display: inline-block; }
.sequence-authorship { margin-top: 20px; font-size: 12px; color: var(--pink-ink); }
.project-sequence { --preview-width: min(1040px,82vw); --preview-gap: clamp(22px,4vw,64px); scroll-margin-top: var(--header); }
.sequence-room { position: relative; }
.sequence-index { display: flex; justify-content: center; flex-wrap: wrap; gap: 0 28px; padding: 10px var(--pad); }
.sequence-index a { display: inline-flex; align-items: center; min-height: 44px; font-size: 12px; }
.sequence-index a:hover,.sequence-index a:focus-visible,.sequence-index a[aria-current] { color: var(--pink-ink); }
.sequence-viewport { overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scroll-padding-inline: calc((100% - var(--preview-width))/2); scrollbar-width: thin; scrollbar-color: var(--pink-ink) transparent; }
.sequence-track { display: flex; align-items: start; gap: var(--preview-gap); width: max-content; padding: 32px calc((100vw - var(--preview-width))/2) 24px; }
.sequence-card { flex: 0 0 var(--preview-width); width: var(--preview-width); margin: 0; scroll-snap-align: center; scroll-margin-block-start: calc(var(--header) + 80px); }
.sequence-media { width: 100%; aspect-ratio: 8/5; background: var(--panel); }
.sequence-media picture,.sequence-media img,.sequence-media video { display: block; width: 100%; height: 100%; object-fit: contain; }
.sequence-media:has(video) { background: #000; }
.sequence-card figcaption { display: flex; justify-content: space-between; align-items: start; gap: 16px; padding-top: 16px; }
.sequence-card h3 { font-size: clamp(16px,1.5vw,23px); font-weight: 400; line-height: 1.25; }
.sequence-card figcaption p { margin-top: 5px; font-size: 11px; color: var(--muted); }
.sequence-card button { border: 0; padding: 0 0 0 12px; min-height: 44px; flex-shrink: 0; background: transparent; font-size: 11px; color: var(--pink-ink); }
.sequence-controls { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 8px var(--pad) 20px; }
.sequence-controls p,.sequence-controls a { font-size: 11px; }
.sequence-controls p { color: var(--muted); }
.sequence-controls a { display: inline-flex; align-items: center; min-height: 44px; gap: 14px; color: var(--pink-ink); }
.sequence-instruction-desktop { display: none; }
@media screen and (min-width:1000px) and (min-height:600px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .project-sequence.is-sequenced { height: calc(600svh - var(--header)); --preview-width: min(1000px,76vw,calc((100svh - var(--header) - 240px)*1.6)); }
 .is-sequenced .sequence-room { position: sticky; top: var(--header); height: calc(100svh - var(--header)); display: flex; flex-direction: column; overflow: clip; }
 .is-sequenced .sequence-index { flex-shrink: 0; z-index: 2; }
 .is-sequenced .sequence-viewport { position: relative; flex: 1; min-height: 0; overflow: clip; scroll-snap-type: none; }
 .is-sequenced .sequence-track { position: absolute; top: 50%; left: 50%; padding: 0; transform: translate3d(calc(var(--preview-width)/-2),-50%,0); }
 .is-sequenced .sequence-card { transform-origin: center; backface-visibility: hidden; }
 .is-sequenced .sequence-controls { flex-shrink: 0; }
 .is-sequenced .sequence-instruction-desktop { display: block; }
 .is-sequenced .sequence-instruction-touch { display: none; }
 .is-sequence-active .sequence-track,.is-sequence-active .sequence-card { will-change: transform; }
}
@media(max-width:700px){
 .sequence-heading { padding: 48px var(--pad) 24px; }
 .sequence-authorship { font-size: 11px; }
 .sequence-index { gap: 0 20px; }
 .sequence-index a { font-size: 11px; }
 .project-sequence { --preview-width: 84vw; --preview-gap: 20px; }
 .sequence-media { aspect-ratio: 1638/2048; }
 .sequence-track { align-items: center; }
 .sequence-media:has(video) { aspect-ratio: 848/480; }
 .sequence-card h3 { font-size: 17px; }
 .sequence-card figcaption p { font-size: 10px; }
 .sequence-controls { padding-top: 0; }
}
@media(prefers-reduced-motion:reduce){
 .sequence-viewport { scroll-behavior: auto; scroll-snap-type: none; }
}
@media print{
 .sequence-index,.sequence-controls,.sequence-card button { display: none !important; }
 .sequence-viewport { overflow: visible; }
 .sequence-track { display: block; width: auto; padding: 0; }
 .sequence-card { width: 100%; break-inside: avoid; margin-bottom: 24px; }
 .sequence-media { aspect-ratio: 8/5; }
}

/* Tools are readable immediately, grouped by how they are used. */
.about-tools { display: grid; grid-template-columns: .8fr 1.7fr; gap: 9%; margin: 110px 0 115px; align-items: start; }
.about-tools-heading h2 { font-size: clamp(40px,4.2vw,65px); line-height: 1.15; letter-spacing: -.035em; font-weight: 300; }
.about-tools-heading p { margin-top: 20px; max-width: 24ch; font-size: 13px; color: var(--muted); line-height: 1.7; }
.tool-groups { display: grid; gap: 36px; }
.tool-group h3 { font-size: 11px; font-weight: 400; color: var(--pink-ink); line-height: 1.6; letter-spacing: .01em; margin-bottom: 9px; }
.tool-group ul { display: flex; flex-wrap: wrap; column-gap: 23px; row-gap: 5px; list-style: none; padding: 0; margin: 0; }
.tool-group li { font-size: clamp(19px,2vw,28px); font-weight: 300; line-height: 1.6; letter-spacing: -.025em; }
@media(max-width:700px){
 .about-tools { display: block; margin-block: 75px; }
 .about-tools-heading { margin-bottom: 40px; }
 .about-tools-heading h2 { font-size: 44px; }
 .about-tools-heading p { max-width: 30ch; margin-top: 16px; }
 .tool-groups { gap: 30px; }
 .tool-group ul { column-gap: 19px; }
 .tool-group li { font-size: 21px; }
}
@media print{
 .about-tools { display: block; }
 .tool-group { break-inside: avoid; }
}

/* Project hover: full covers and an elastic pointer response. */
.project-window { box-shadow: none; }
.project-window::before,.portrait::before { content: none !important; }
.project-cover,.project-cover > img { transform: none !important; }
.project-hover-label { position: absolute; left: 50%; bottom: 20px; display: flex; justify-content: space-between; align-items: center; gap: 16px; min-width: 140px; height: 38px; padding: 0 13px; font-size: 11px; background: var(--paper); color: var(--ink); opacity: 0; transform: translate3d(-50%,6px,0); pointer-events: none; transition: opacity .25s var(--ease); z-index: 2; }
.project-hover-label > span { color: var(--pink-ink); font-size: 19px; }
.project-link.is-pointer-following .project-hover-label,.project-link:focus-visible .project-hover-label { opacity: 1; }
.project-link:focus-visible .project-hover-label { transform: translate3d(-50%,0,0); }
.project-link.is-pointer-following .project-window { will-change: transform; }
.project-link:hover .project-caption :is(h2,h3),.project-link:focus-visible .project-caption :is(h2,h3) { color: var(--pink-ink); }
.project-link:hover .project-arrow { transform: translate3d(5px,-5px,0); }

.about-title { font-size: clamp(52px,8.3vw,132px); font-weight: 300; margin-bottom: 55px; }
.about-columns { grid-template-columns: minmax(0,1fr) minmax(0,1.12fr); gap: 12%; align-items: start; }
.portrait { width: min(100%,460px); margin: 30px 0 0; padding: 0; background: none; box-shadow: none; isolation: auto; }
.portrait-frame { overflow: hidden; }
.about-copy { padding-top: 0; }
.about-copy .about-lede { font-size: clamp(30px,3.3vw,50px); line-height: 1.3; max-width: 19ch; margin-bottom: 36px; }
.about-copy p { max-width: 43ch; }
.about-tools { grid-template-columns: .65fr 2fr; gap: 9%; margin-top: 130px; }
.about-tools-heading h2 { font-size: clamp(42px,5vw,72px); }
.tool-groups { gap: 38px; }
.tool-group { display: grid; grid-template-columns: minmax(120px,.8fr) minmax(0,2fr); gap: 24px; align-items: baseline; }
.tool-group h3 { max-width: 18ch; margin: 0; }
.tool-group ul { transition: transform .8s var(--ease); }
.tool-group li { font-size: clamp(20px,2vw,29px); }
@media(hover:hover) and (pointer:fine){
 .tool-group:hover ul { transform: translate3d(6px,0,0); }
 .tool-group:hover li { color: var(--pink-ink); }
}

.contact.contact-editorial { max-width: none; min-height: calc(100svh - var(--header)); scroll-margin-top: -24px; margin: 0; padding: clamp(60px,10svh,110px) var(--pad) 30px; display: flex; flex-direction: column; background: var(--paper); color: var(--ink); }
.contact-notes { width: min(100%,clamp(300px,24vw,490px)); margin: 0 0 clamp(70px,13svh,160px) auto; }
.contact-notes p { font-size: clamp(24px,2.5vw,40px); font-weight: 300; line-height: 1.25; letter-spacing: -.025em; }
.contact-notes p + p { margin-top: clamp(28px,4svh,45px); }
.contact-bottom { display: grid; grid-template-columns: 2fr 1.15fr .7fr .9fr; gap: 4.5%; align-items: end; margin-top: auto; }
.contact.contact-editorial h2 { margin: 0 0 22px; font-size: clamp(42px,5.3vw,78px); font-weight: 300; line-height: 1.06; letter-spacing: -.05em; color: var(--pink); }
.contact-invitation p,.contact-location,.contact-editorial .colophon { font-size: clamp(13px,.95vw,18px); line-height: 1.5; }
.contact-location { display: flex; flex-direction: column; gap: 5px; }
.contact-editorial .socials { display: flex; flex-direction: column; gap: 0; align-items: start; padding: 0; }
.contact-editorial .text-link { min-height: 36px; font-size: clamp(13px,.95vw,18px); gap: 13px; }
.contact-editorial .text-link::after { display: none; }
.contact-editorial a:hover,.contact-editorial a:focus-visible { color: var(--pink-ink); }
.contact-editorial .colophon { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; margin: 0; color: var(--muted); }
.contact-editorial .colophon a { display: inline-flex; align-items: center; min-height: 36px; font-size: inherit; margin: 0; }
[data-chart-fill] { transform-origin: left center; }
.chart-is-playing { will-change: transform; }
.evidence-mark { border-radius: 0; height: 2px; width: 12px; margin-top: 10px; }
@media(max-width:1050px){
 .about-columns { gap: 7%; }
 .about-tools { grid-template-columns: .6fr 1.6fr; gap: 7%; }
 .tool-group { display: block; }
 .tool-group h3 { max-width: none; margin-bottom: 10px; }
 .contact-bottom { gap: 4%; }
}
@media(max-width:700px){
 .about-title { font-size: clamp(41px,9.2vw,65px); margin-bottom: 35px; }
 .about-columns { display: flex; flex-direction: column; gap: 45px; }
 .portrait { width: 87%; max-width: 360px; padding: 0; margin-top: 0; }
 .about-copy { margin-left: 7%; }
 .about-copy .about-lede { font-size: 30px; margin-bottom: 26px; }
 .about-tools { display: block; margin-top: 85px; }
 .about-tools-heading { margin-bottom: 38px; }
 .about-tools-heading h2 { font-size: 46px; }
 .tool-groups { gap: 32px; }
 .tool-group li { font-size: 22px; }
 .contact.contact-editorial { min-height: calc(100svh - var(--header)); padding-top: 75px; padding-bottom: 25px; }
 .contact-notes { width: 77%; margin-bottom: 100px; }
 .contact-notes p { font-size: clamp(22px,6vw,28px); }
 .contact-bottom { grid-template-columns: 1.2fr 1fr; gap: 30px 25px; align-items: start; }
 .contact-invitation { grid-column: 1/-1; grid-row: 1; }
 .contact.contact-editorial h2 { font-size: clamp(48px,12vw,66px); }
 .contact-location { grid-column: 1; grid-row: 2; }
 .contact-editorial .socials { grid-column: 2; grid-row: 2; }
 .contact-editorial .colophon { grid-column: 1/-1; grid-row: 3; flex-direction: row; align-items: center; justify-content: space-between; }
 .contact-invitation p,.contact-location,.contact-editorial .colophon { font-size: 12px; }
}
@media(prefers-reduced-motion:reduce){
 .project-hover-label { transition: none; }
 .tool-group ul { transition: none; transform: none !important; }
 .chart-is-playing { will-change: auto; }
}
@media print{
 .project-hover-label { display: none; }
 .project-window,.tool-group ul { transform: none !important; }
 .contact.contact-editorial { min-height: 0; padding-top: 45px; }
 .contact-notes { margin-bottom: 45px; }
}
/* The Portuguese label is longer; keep it clear of the tools column. */
html[lang^="pt"] .about-tools-heading h2 { font-size: clamp(34px,3.5vw,56px); }
@media(max-width:700px){ html[lang^="pt"] .about-tools-heading h2 { font-size: 46px; } }

/* One project per spread. Image and copy alternate; source covers stay intact. */
.project-list { display: grid; grid-template-columns: minmax(0,1fr); gap: clamp(100px,12vw,190px); padding-bottom: 60px; }
.project-list .project-card:nth-child(n) { width: 100%; margin: 0; grid-column: auto; justify-self: stretch; }
.project-list .project-link { display: grid; grid-template-columns: minmax(0,1.85fr) minmax(0,1fr); align-items: center; gap: 8%; }
.project-list .project-caption { min-width: 0; margin: 0; gap: 18px; display: block; }
.project-list .project-caption :is(h2,h3) { font-size: clamp(28px,2.8vw,46px); line-height: 1.17; letter-spacing: -.035em; }
.project-list .project-caption p { margin-top: 24px; font-size: 11px; }
.project-list .project-description { margin-top: 12px !important; font-size: 14px !important; max-width: 32ch; }
.project-list .project-arrow { display: inline-block; margin-top: 28px; font-size: 29px; }
.project-list .project-card:nth-child(even) .project-link { grid-template-columns: minmax(0,1fr) minmax(0,1.85fr); }
.project-list .project-card:nth-child(even) .project-window { grid-column: 2; grid-row: 1; }
.project-list .project-card:nth-child(even) .project-caption { grid-column: 1; grid-row: 1; }
.studio-intro,.about-title,.intro-name,.intro-body h2 > .scroll-copy-mask:first-child { color: var(--pink-ink); }
#contact:focus { outline: none; }
@media(max-width:900px){
 .project-list { gap: 90px; padding-bottom: 30px; }
 .project-list .project-card:nth-child(n) .project-link { display: block; }
 .project-list .project-caption { display: flex; margin-top: 24px; gap: 26px; }
 .project-list .project-caption :is(h2,h3) { font-size: clamp(28px,4vw,38px); }
 .project-list .project-caption p { margin-top: 12px; }
 .project-list .project-description { max-width: 42ch; }
 .project-list .project-arrow { margin-top: 0; }
}

/* First-paint fallback is paper. The head watchdog removes the gate on failure. */
html.intro-pending:not(.intro-mounted)::after { content: ''; position: fixed; inset: 0; z-index: 290; background: var(--paper); pointer-events: none; }
.opening-loader { display: none; }
.intro-pending .opening-loader { position: fixed; inset: 0; z-index: 310; display: grid; place-items: center; background: var(--paper); }
.opening-counter { position: relative; width: 3ch; text-align: center; font-size: clamp(108px,18vw,240px); font-weight: 300; line-height: 1.15; letter-spacing: 0; font-variant-numeric: tabular-nums; color: var(--pink); }
.opening-ink { display: block; width: 100%; }
.opening-counter.has-pull .opening-ink { opacity: 0; }
.opening-pull { position: absolute; pointer-events: none; max-width: none; }
.opening-skip { position: absolute; right: var(--pad); bottom: 28px; min-height: 44px; padding: 10px; border: 0; background: none; font-size: 12px; }
@media(prefers-reduced-motion:reduce){
 html.intro-pending::after,.intro-pending .opening-loader { display: none; }
}
@media print{
 html.intro-pending::after,.intro-pending .opening-loader { display: none !important; }
 .project-list .project-card { break-inside: avoid; }
}

@media (pointer:coarse){
 .contact-editorial .text-link,.contact-editorial .colophon a { min-height: 44px; }
}

/* Root scroll padding already accounts for the fixed header. */
.home-introduction,.project-card,.case-overview,.case-section { scroll-margin-top: 0; }
@media(max-width:700px){
 .case-nav .chapter-link { min-height: 44px; }
}

/* Curated work: three lead cases, then a quieter supporting collection. */
.home-work-invitation { padding: 52px var(--pad) 28px; text-align: center; }
.home-work-invitation .quiet-link { min-height: 44px; font-size: clamp(20px,2.2vw,32px); font-weight: 300; color: var(--pink-ink); gap: 18px; }
.collection-heading { display: flex; justify-content: space-between; gap: 30px; align-items: baseline; margin-bottom: 50px; }
.collection-heading h2 { font-size: 15px; font-weight: 400; color: var(--pink-ink); }
.collection-heading p { font-size: 12px; max-width: 36ch; color: var(--muted); }
.work-secondary { margin-top: 90px; }
.project-list .project-caption .project-evidence { margin-top: 22px; color: var(--pink-ink); font-size: 11px; line-height: 1.7; max-width: 38ch; }
.work-secondary .project-list { gap: 64px; }
.work-secondary .project-card:nth-child(n) .project-link { grid-template-columns: minmax(0,.85fr) minmax(0,1.45fr); gap: 8%; }
.work-secondary .project-card:nth-child(n) .project-window { grid-column: 1; grid-row: 1; }
.work-secondary .project-card:nth-child(n) .project-caption { grid-column: 2; grid-row: 1; }
.work-secondary .project-caption h3 { font-size: clamp(26px,2.2vw,36px); }
.work-secondary .project-caption .project-arrow { margin-top: 15px; }
.case-resource-bar { margin-top: 22px; }
.case-resource-link { display: inline-flex; align-items: center; gap: 24px; min-height: 44px; color: var(--case-accent); font-size: 13px; }
.case-resource-link:hover { color: var(--ink); }

/* Decisions remain near their evidence, in each case's own palette. */
.decision-edit,.decision-revisions,.test-followup { margin-top: 36px; }
.case-content :is(.decision-edit,.decision-revisions) > figcaption { margin: 0 0 20px; }
.case-content :is(.decision-edit,.decision-revisions,.test-followup) h3 { font-size: clamp(21px,2vw,29px); color: var(--case-dark); margin-top: 10px; }
.case-content .revision-label { display: block; margin-bottom: 12px; font-size: 11px; line-height: 1.5; color: var(--case-accent); }
.hierarchy-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.hierarchy-comparison > div { padding: 22px; background: var(--case-soft); min-width: 0; }
.hierarchy-schematic { display: flex; flex-direction: column; gap: 18px; min-height: 180px; justify-content: center; }
.hierarchy-large { font-size: clamp(23px,2.5vw,35px); line-height: 1.2; font-weight: 300; color: var(--case-dark); }
.hierarchy-small { font-size: 12px; line-height: 1.5; color: var(--muted); }
.hierarchy-after .hierarchy-large { color: var(--case-accent); }
.hierarchy-source { color: var(--case-accent); }
.case-content .decision-edit > .study-note,.case-content .decision-revisions > .study-note { margin-top: 18px; }
.test-followup > header { margin-bottom: 22px; }
.case-content .test-followup header .study-note { margin-top: 14px; }
.followup-rows { display: grid; gap: 16px; }
.followup-rows article { display: grid; grid-template-columns: .8fr 1.3fr 1.3fr; gap: 22px; background: var(--case-soft); padding: 24px; }
.case-content .followup-rows h4,.case-content .revision-row h4 { font-size: 16px; font-weight: 400; line-height: 1.4; color: var(--case-dark); }
.case-content .followup-rows p,.case-content .revision-row p { font-size: 13px; line-height: 1.65; }
.revision-row { display: grid; grid-template-columns: .8fr 1.4fr 20px 1.4fr; align-items: start; gap: 20px; padding: 24px; background: var(--case-soft); margin-top: 14px; }
.revision-arrow { color: var(--case-accent); align-self: center; }
.decision-tradeoff { display: grid; gap: 16px; padding: 24px; background: var(--case-soft); }
.decision-tradeoff > div { display: grid; grid-template-columns: .8fr 2fr; gap: 24px; }
.decision-tradeoff dt { font-size: 11px; color: var(--case-accent); }
.case-content .decision-tradeoff dd { font-size: 13px; line-height: 1.6; }

/* Source-sized image inspection: the underlying anchor works without JavaScript. */
.asset-zoom { position: relative; display: flex; justify-content: center; max-width: 100%; cursor: zoom-in; }
.visual-case .media-frame > .asset-zoom > img { width: auto; max-width: 100%; height: auto; max-height: 410px; object-fit: contain; }
.asset-zoom-hint { position: absolute; right: 7px; bottom: 7px; width: 30px; height: 30px; display: grid; place-items: center; background: var(--paper); color: var(--ink); font-size: 18px; opacity: 0; transition: opacity .25s var(--ease); }
.asset-zoom:hover .asset-zoom-hint,.asset-zoom:focus-visible .asset-zoom-hint { opacity: 1; }
.image-viewer { border: 0; padding: 0; width: min(1200px,94vw); height: 90svh; max-width: 94vw; max-height: 90svh; margin: auto; background: var(--paper); color: var(--ink); }
.image-viewer::backdrop { background: rgb(26 26 26 / .82); }
.image-viewer[open] { display: grid; grid-template-rows: auto minmax(0,1fr); }
.image-view-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px 24px; padding: 15px 24px; }
.image-view-toolbar h2 { font-size: 13px; line-height: 1.5; flex: 1 1 220px; }
.image-view-actions { display: flex; gap: 20px; }
.image-view-actions button { border: 0; background: transparent; min-height: 44px; font-size: 12px; padding: 8px 0; }
.image-view-actions button[aria-pressed=true] { color: var(--pink-ink); }
.image-view-stage { overflow: auto; display: grid; place-items: center; min-height: 0; padding: 20px; }
.image-view-stage img { display: block; width: auto; height: auto; max-width: 100%; max-height: calc(90svh - 125px); margin: auto; }
.image-viewer.is-original .image-view-stage { display: block; }
.image-viewer.is-original .image-view-stage img { max-width: none; max-height: none; }
@media(max-width:900px){
 .collection-heading { display: block; margin-bottom: 30px; }
 .collection-heading p { margin-top: 10px; }
 .work-secondary { margin-top: 55px; }
 .work-secondary .project-card:nth-child(n) .project-link { display: block; }
 .work-secondary .project-caption h3 { font-size: 28px; }
}
@media(max-width:700px){
 .home-work-invitation { padding-top: 30px; }
 .hierarchy-comparison,.followup-rows article,.revision-row { grid-template-columns: 1fr; }
 .hierarchy-schematic { min-height: 140px; }
 .revision-arrow { display: none; }
 .followup-rows article,.revision-row { gap: 18px; padding: 20px; }
 .case-content .revision-label { margin-bottom: 6px; }
 .decision-tradeoff > div { grid-template-columns: 1fr; gap: 5px; }
 .asset-zoom-hint { opacity: 1; }
 .image-view-toolbar { padding: 10px 16px; gap: 8px; }
 .image-view-toolbar h2 { flex-basis: 100%; }
 .image-view-actions { width: 100%; justify-content: space-between; }
 .image-view-stage { padding: 12px; }
 .image-view-stage img { max-height: calc(90svh - 185px); }
}
@media(prefers-reduced-motion:reduce){.asset-zoom-hint { transition: none; }}
@media print{
 .asset-zoom-hint,.image-viewer { display: none !important; }
 .work-secondary,.collection-heading { break-inside: avoid; }
}

/* Home is a personal introduction. Its composition follows the native scroll. */
.portrait-image { transform-origin: 50% 100%; }
.studio-portrait figcaption > span { display: block; }
.studio-hero.is-scroll-active [data-scroll-layer],.home-introduction.is-scroll-active [data-scroll-line] { will-change: transform; }
.page-home .home-introduction { padding-bottom: 64px; }
.page-home .home-work-invitation { padding-block: 32px 90px; }

/* Work owns the six-project sequence; every cover is a real case-study link. */
.page-work .work-page { max-width: none; padding-inline: 0; }
.page-work .work-intro { max-width: var(--max); margin-inline: auto; padding-inline: var(--pad); padding-bottom: 38px; }
.work-sequence .sequence-card:nth-child(n) { width: var(--preview-width); margin: 0; grid-column: auto; justify-self: auto; }
.work-sequence .project-link { display: block; }
.work-sequence .project-caption { display: flex; margin-top: 18px; gap: 18px; }
.work-sequence .project-caption :is(h2,h3) { font-size: clamp(20px,1.7vw,26px); line-height: 1.2; font-weight: 400; }
.work-sequence .project-caption p { margin-top: 6px; font-size: 11px; line-height: 1.5; }
.work-sequence .project-caption .project-description { max-width: 62ch; font-size: 12px; }
.work-sequence .project-caption .project-evidence { color: var(--pink-ink); font-size: 11px; }
.work-sequence .project-arrow { font-size: 24px; flex-shrink: 0; }
.work-sequence .sequence-track { align-items: start; }
.work-sequence [data-liquid] { touch-action: auto; }
.work-sequence .project-link:focus-visible { outline-offset: 4px; }
@media screen and (min-width:1000px) and (min-height:720px) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .work-sequence.is-sequenced { --preview-width: min(1000px,76vw,calc((100svh - var(--header) - 360px)*1.6)); }
}
@media(max-width:700px){
 .page-home .home-introduction { padding-bottom: 36px; }
 .page-home .home-work-invitation { padding-block: 18px 48px; }
 .work-sequence .project-caption :is(h2,h3) { font-size: 20px; }
 .work-sequence .sequence-controls { align-items: start; }
 .work-sequence .sequence-controls p { max-width: 24ch; padding-top: 12px; }
}
@media(prefers-reduced-motion:reduce){
 .studio-hero [data-scroll-layer],.home-introduction [data-scroll-line] { will-change: auto; }
}
@media print{
 .page-home .home-introduction,.page-home .home-work-invitation { padding-block: 24px; }
 .work-sequence .sequence-card:nth-child(n) { width: 100%; margin-bottom: 32px; }
 .studio-hero [data-scroll-layer],.home-introduction [data-scroll-line] { will-change: auto; }
}


/* Readable supporting text, with the existing title hierarchy preserved. */
:root { --text-note: .8125rem; --text-caption: .875rem; }
.work-sequence .project-caption p,
.work-sequence .project-caption .project-evidence { font-size: var(--text-note); line-height: 1.55; }
.work-sequence .project-caption .project-description { font-size: var(--text-caption); line-height: 1.6; }
.work-sequence .sequence-index a,
.work-sequence .sequence-controls p,
.work-sequence .sequence-controls a { font-size: var(--text-note); }
.studio-caption,.studio-scroll,.studio-portrait figcaption { font-size: var(--text-note); line-height: 1.55; }
.tool-group h3 { font-size: var(--text-note); }
.visual-case .case-content figcaption,
.visual-case .case-content .study-note,
.visual-case .case-content .task-times > figcaption { font-size: var(--text-note) !important; line-height: 1.65 !important; }
.visual-case .chapter-link,
.visual-case .case-evidence-strip dt,
.visual-case .case-content .study-sources li,
.visual-case .case-content .study-sources a,
.visual-case .case-content .notes-table th,
.visual-case .case-content .notes-table td,
.visual-case .case-content .flow-track p,
.visual-case .case-content .experience-map .map-caption,
.visual-case .case-content .journey-atlas li p,
.visual-case .case-content .decision-map p,
.visual-case .case-content .study-stats span,
.visual-case .case-content .validation-row > span:first-child,
.visual-case .case-content .task-time > span:first-child { font-size: var(--text-note); line-height: 1.6; }
.visual-case .case-evidence-strip dt { overflow-wrap: anywhere; }
.visual-case .study-notes > summary { font-size: var(--text-caption) !important; }

/* Contact actions keep the email concealed until a manual copy is needed. */
.contact-editorial button.text-link { border: 0; background: transparent; padding: 0; text-align: left; min-height: 44px; }
.contact-editorial .contact-copy [data-copy-label] { transform: none; }
.contact-editorial .contact-copy[aria-busy="true"] { cursor: progress; }
.contact-copy-manual { max-width: 100%; padding-top: 10px; }
.contact-copy-manual label { display: block; font-size: var(--text-note); line-height: 1.5; }
.contact-copy-manual input { display: block; width: 100%; min-width: 0; min-height: 44px; margin-top: 8px; padding: 8px; border: 1px solid currentColor; border-radius: 0; background: var(--paper); font-size: 16px; }
.contact-copy-manual button { margin-top: 4px; }
@media(max-width:700px){
 .work-sequence .sequence-index { gap: 0 18px; }
 .work-sequence .sequence-controls { flex-wrap: wrap; gap: 4px 20px; }
 .work-sequence .sequence-controls p { max-width: 30ch; }
}
@media print { .contact-copy,.contact-copy-manual,[data-copy-status] { display: none !important; } }

/* Inline vectors cannot switch to a platform emoji font on touch devices. */
svg.inline-arrow {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  vertical-align: -.125em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}