/* A working atlas: paper, ink, evidence, and connections. */
.portfolio-home,.case-page { --bg:#f3f0e8; --ink:#242e29; --accent:#ac3924; --muted:#62695f; --paper:#f3f0e8; --line:#c7cbc0; background:var(--bg); color:var(--ink); color-scheme:light; font-size:16px; }
.portfolio-home .universe-header,.case-page .universe-header { background:#f3f0e8f5; border-color:var(--line); color:var(--ink); }
.portfolio-home .universe-contact,.case-page .universe-contact { border-color:#9ba596; }
.folio-pad { padding-inline:clamp(24px,5vw,90px); }
.folio-label { font:12px/1.5 monospace; letter-spacing:.09em; }
.portfolio-home h1,.portfolio-home h2,.case-page h1,.case-page h2 { font-family:var(--display); font-weight:600; letter-spacing:-.065em; }
.portfolio-home h2,.case-page h2 { font-size:clamp(38px,5vw,72px); line-height:1.07; }
.portfolio-home em,.case-page em { font-family:Georgia,serif; font-weight:400; letter-spacing:-.065em; }
.atlas-hero { position:relative; padding-top:34px; }
.atlas-top,.atlas-bottom { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.atlas-top { color:#5e675c; }
.atlas-layout { display:grid; grid-template-columns:1.07fr 1fr; gap:2vw; align-items:center; padding:65px 0 38px; }
.role-line { font-size:16px; margin-bottom:22px; }
.atlas-copy h1 { font-size:clamp(53px,6.6vw,105px); line-height:1.06; white-space:nowrap; }
.atlas-copy h1 em { color:var(--accent); }
.atlas-intro { font-size:17px; max-width:460px; margin-top:30px; line-height:1.7; }
.atlas-actions { display:flex; align-items:center; flex-wrap:wrap; gap:25px; margin-top:30px; }
.folio-button { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; padding:17px 22px; font-size:14px; background:var(--ink); color:var(--paper); border:1px solid var(--ink); transition:background .2s,color .2s; }
.folio-button:hover { background:var(--accent); border-color:var(--accent); }
.folio-text-link { padding:8px 0; border-bottom:1px solid currentColor; font-size:14px; }
.current-line { margin-top:32px; color:#666e62; font-size:12px; line-height:1.8; }
.atlas-bottom { padding:24px 0; border-top:1px solid var(--line); font:11px/1.5 monospace; letter-spacing:.06em; }
.atlas-bottom .motion-toggle { margin-left:auto; color:#5d685c; border-color:#9da794; font-size:12px; }
.connection-atlas { position:relative; width:100%; aspect-ratio:600/590; min-width:0; }
.atlas-caption { display:flex; justify-content:space-between; margin:0 0 10px; padding-inline:10px; }
.atlas-coordinate { font:12px monospace; color:#798372; }
.atlas-lines { position:absolute; top:24px; width:100%; height:auto; overflow:visible; }
.atlas-orbit { fill:none; stroke:#b4bbae; stroke-width:1; }
.orbit-inner { stroke-dasharray:2 7; }
.atlas-route { fill:none; stroke:#a5ad9d; stroke-width:1; transition:stroke .3s; }
.has-focus .atlas-route { stroke:var(--accent); }
.atlas-ticks { stroke:#7e8975; fill:none; }
.travel-dot { fill:var(--accent); }
.atlas-center { position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); display:grid; justify-items:center; gap:8px; background:var(--paper); padding:18px; }
.atlas-center span { font:10px monospace; letter-spacing:.08em; }
.atlas-center b { font:48px Georgia,serif; color:var(--accent); line-height:1; }
.atlas-node { position:absolute; padding:14px 17px; border:1px solid #aab3a1; background:var(--paper); min-width:137px; box-shadow:4px 4px 0 #d9ddcf; transition:transform .25s,box-shadow .25s,border-color .25s; }
.atlas-node:hover,.atlas-node:focus-visible { transform:translateY(-5px); border-color:var(--accent); box-shadow:4px 9px 0 #d9ddcf; }
.atlas-node small { display:block; font:10px monospace; letter-spacing:.06em; color:#66735e; margin-bottom:8px; }
.atlas-node strong { display:flex; gap:19px; align-items:center; justify-content:space-between; font:600 18px var(--display); letter-spacing:-.04em; }
.atlas-node strong span { color:var(--accent); }
.node-ai { top:14%; left:1%; transform:rotate(-4deg); }
.node-audio { top:8%; right:1%; transform:rotate(3deg); }
.node-research { top:58%; left:0; transform:rotate(2deg); }
.node-baby { top:52%; right:0; transform:rotate(-3deg); }
.node-craft { top:75%; left:43%; display:flex; gap:12px; align-items:center; padding:10px; }
.node-craft img { width:64px; height:50px; object-fit:cover; }
.node-craft small { font-size:9px; }
.node-craft strong { font-size:15px; }
.mini-wave { display:flex; align-items:center; justify-content:space-between; height:36px; margin-top:9px; }
.mini-wave i { width:3px; background:#839c7a; height:14px; animation:wave-note 2s ease-in-out infinite alternate; }
.mini-wave i:nth-child(3n) { height:28px; animation-delay:-.6s; }.mini-wave i:nth-child(2n) { height:21px; animation-delay:-1.1s; }
.atlas-note { position:absolute; bottom:0; left:10px; right:10px; min-height:48px; font-size:12px; line-height:1.6; color:#586451; border-left:2px solid var(--accent); padding-left:13px; }
.atlas-note span { color:#6e7868; }
@keyframes wave-note { from { transform:scaleY(.65); } to { transform:scaleY(1); } }
.evidence-strip { display:grid; grid-template-columns:repeat(3,1fr); background:#e6e9df; border-block:1px solid #c5cdbd; }
.evidence-strip>a { position:relative; padding:28px 26px 28px 0; border-right:1px solid #c5cdbd; }
.evidence-strip>a+a { padding-left:30px; }.evidence-strip>a:last-child { border:0; }
.evidence-strip strong { font:600 clamp(22px,2.5vw,36px) var(--display); display:block; letter-spacing:-.05em; }
.evidence-strip span { display:block; margin-top:7px; font-size:13px; color:#5c6755; }.evidence-strip b { position:absolute; top:30px; right:18px; font-weight:400; }
.evidence-strip>a:hover strong { color:var(--accent); }
.selected-work,.beyond-section { padding-block:100px; scroll-margin-top:90px; }
.folio-heading>.folio-label { margin-bottom:30px; color:#616b58; }
.folio-heading>div { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; }
.folio-heading>div>p { max-width:360px; color:#5f6858; font-size:16px; }
.work-filter { display:flex; align-items:center; gap:8px; padding:28px 0; margin-top:30px; border-top:1px solid var(--line); flex-wrap:wrap; }
.work-filter button { background:transparent; border:1px solid #aab29f; padding:11px 16px; font-size:13px; color:var(--ink); }
.work-filter button[aria-pressed="true"] { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.work-filter button:hover { border-color:var(--accent); }.work-filter button span { opacity:.7; font:10px monospace; margin-left:8px; }
#work-count { margin-left:auto; font:12px monospace; color:#626c59; }
.evidence-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:70px 40px; }
.evidence-project:nth-child(even) { padding-top:70px; }
.evidence-grid:has([hidden]) .evidence-project { padding-top:0; }
.evidence-visual { display:block; position:relative; overflow:hidden; aspect-ratio:3/2; background:#d7dfd3; }
.evidence-visual>img { width:100%; height:100%; object-fit:cover; transition:transform .65s cubic-bezier(.2,.7,.2,1); }
.evidence-visual:hover>img { transform:scale(1.035); }
.project-open { position:absolute; bottom:18px; right:18px; background:var(--paper); color:var(--ink); padding:12px 15px; font-size:12px; transition:background .2s; }.evidence-visual:hover .project-open { background:#fff; }
.project-index { display:flex; justify-content:space-between; gap:14px; margin:20px 0 14px; color:#626b5a; font:10px/1.6 monospace; letter-spacing:.04em; }
.evidence-project h3 { font-size:clamp(26px,2.8vw,42px); line-height:1.15; letter-spacing:-.05em; }
.evidence-project h3 a:hover { color:var(--accent); }
.evidence-project>p { font-size:15px; color:#626b5a; margin-top:16px; max-width:510px; }
.evidence-outcome { display:flex; gap:12px; justify-content:space-between; border-top:1px solid var(--line); margin-top:23px; padding-top:16px; font-size:12px; }
.evidence-outcome strong { font-weight:600; }.evidence-outcome span { color:#616c59; text-align:right; }
.baby-visual { background:#dce3ea; display:flex; align-items:flex-start; justify-content:flex-end; padding:25px 36px 0; }
.baby-visual>img { width:43%; height:auto; object-fit:contain; box-shadow:0 12px 30px #22344828; border-radius:14px; transform:rotate(6deg); }
.baby-visual:hover>img { transform:rotate(2deg) translateY(-5px); }
.baby-annotation { position:absolute; left:28px; top:35%; font:600 clamp(13px,1.4vw,21px)/1.4 var(--display); color:#3e5770; letter-spacing:-.03em; }
.evidence-source { margin-top:35px; font-size:12px; color:#646f5c; }.evidence-source a { text-decoration:underline; text-underline-offset:4px; }
.approach-section { display:grid; grid-template-columns:1fr 1fr; gap:9vw; padding-block:90px; background:#26352d; color:#edf0e4; scroll-margin-top:80px; }
.approach-intro>.folio-label { color:#b9c9ac; margin-bottom:28px; }.approach-intro h2 { font-size:clamp(38px,4.2vw,64px); }.approach-intro h2 em { color:#c3d4a5; }
.approach-intro>p:not(.folio-label) { max-width:470px; font-size:16px; margin:30px 0 20px; color:#c7d0bf; }.approach-intro .folio-text-link { display:inline-block; }
.approach-notes article { border-top:1px solid #62705b; padding:24px 0 30px; }.approach-notes article>span { font:11px monospace; color:#b9c9ac; }.approach-notes h3 { margin-top:15px; font-size:25px; line-height:1.25; letter-spacing:-.04em; }.approach-notes p { font-size:15px; color:#c7d0bf; margin-top:14px; }.approach-notes a { display:inline-block; margin-top:14px; color:#d2ddb9; font-size:13px; border-bottom:1px solid #62705b; padding-bottom:4px; }
.personal-pair { display:grid; grid-template-columns:1.1fr 1fr; gap:50px; margin-top:50px; align-items:start; }.personal-world:nth-child(2) { padding-top:75px; }
.personal-world>div { overflow:hidden; }.personal-world img { width:100%; height:350px; object-fit:cover; transition:transform .6s; }.personal-world:nth-child(2) img { object-fit:contain; background:#1c211c; }.personal-world:hover img { transform:scale(1.035); }
.personal-world>p { display:flex; justify-content:space-between; margin:18px 0; font:12px monospace; color:#626b59; }.personal-world h3 { font-size:clamp(27px,2.8vw,40px); line-height:1.15; letter-spacing:-.05em; }.personal-world>span { display:block; margin-top:15px; color:#606b59; font-size:14px; }
.archive-links { display:flex; gap:18px 32px; flex-wrap:wrap; border-top:1px solid var(--line); margin-top:50px; padding-top:25px; font-size:14px; }.archive-links a:hover { color:var(--accent); }
.folio-contact { padding-block:85px 75px; background:#e5e9dc; border-top:1px solid #c6cebb; }.folio-contact>.folio-label { margin-bottom:25px; }.folio-contact h2 { font-size:clamp(52px,7vw,105px); }.folio-contact h2 em { color:var(--accent); }.contact-options { display:flex; align-items:center; flex-wrap:wrap; gap:25px; margin-top:35px; }.contact-email { display:inline-block; font-size:14px; margin-top:25px; }
.folio-footer { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:25px; border-top:1px solid var(--line); font-size:12px; }.folio-footer nav { display:flex; gap:24px; }
/* Project briefs use the same editorial language. */
.case-main { max-width:1440px; margin-inline:auto; }.case-hero { padding-block:45px 55px; }.case-breadcrumb { font-size:13px; margin-bottom:45px; color:#65705d; }.case-hero>.folio-label { color:var(--accent); margin-bottom:22px; }.case-hero h1 { font-size:clamp(48px,6.2vw,92px); max-width:1050px; line-height:1.05; }.case-lede { font-size:20px; max-width:750px; margin-top:27px; color:#5b6855; }.case-facts { display:grid; grid-template-columns:2fr 1fr 1fr; gap:24px; border-top:1px solid var(--line); padding-top:25px; margin-top:40px; }.case-facts dt { font:11px monospace; color:#64705c; margin-bottom:8px; }.case-facts dd { margin:0; font-size:14px; line-height:1.6; }.case-cover { display:block; width:100%; height:auto; object-fit:contain; }.case-cover-phone { height:530px; max-height:70svh; object-fit:contain; background:#dde4eb; padding:35px; }
.case-body { display:grid; grid-template-columns:210px 1fr; gap:6vw; padding-block:65px; }.case-aside { align-self:start; position:sticky; top:120px; }.case-aside a { display:block; padding:10px 0; font-size:13px; border-bottom:1px solid var(--line); }.case-section { margin-bottom:55px; scroll-margin-top:110px; }.case-section h2 { font-size:38px; margin-bottom:22px; }.case-section>p { font-size:17px; line-height:1.8; max-width:780px; color:#53634c; }.case-steps { counter-reset:steps; padding:0; list-style:none; }.case-steps li { counter-increment:steps; display:grid; grid-template-columns:32px 1fr; gap:15px; padding:20px 0; border-top:1px solid var(--line); }.case-steps li:before { content:'0' counter(steps); font:12px monospace; color:var(--accent); }.case-steps h3 { font-size:21px; letter-spacing:-.035em; }.case-steps p { margin-top:10px; font-size:16px; color:#53634c; }.case-results { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:25px 0; }.case-results>div { border-top:2px solid #6f8063; padding-top:20px; }.case-results strong { display:block; font:600 35px var(--display); letter-spacing:-.045em; }.case-results span { display:block; font-size:13px; margin-top:8px; color:#52604b; line-height:1.6; }.case-sources { border-top:1px solid var(--line); padding-top:25px; }.case-sources p { font-size:13px; color:#5c6853; }.case-sources ul { padding-left:20px; }.case-sources li { padding:7px 0; font-size:14px; }.case-sources a { text-decoration:underline; text-underline-offset:4px; }.case-next { display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--line); padding-block:35px; }.case-next a { font-size:18px; }.case-next span { font:12px monospace; }
@media(min-width:1600px) { .atlas-layout { padding-block:70px; }.connection-atlas { max-width:640px; justify-self:end; } }
@media(max-width:1050px) { .atlas-layout { gap:25px; grid-template-columns:1fr 1fr; padding-top:48px; }.atlas-copy h1 { font-size:6.5vw; }.atlas-intro { font-size:15px; }.atlas-node { min-width:110px; padding:10px; }.atlas-node strong { font-size:15px; gap:8px; }.atlas-node small { font-size:8px; }.atlas-note { font-size:11px; }.node-craft { left:38%; }.node-craft img { width:42px; height:40px; }.atlas-center { padding:10px; }.atlas-center span { font-size:8px; }.folio-heading>div>p { max-width:290px; font-size:15px; }.evidence-grid { gap:50px 28px; }.project-index { flex-direction:column; gap:3px; }.evidence-outcome { flex-direction:column; }.evidence-outcome span { text-align:left; }.personal-pair { gap:28px; }.personal-world img { height:280px; }.case-body { grid-template-columns:150px 1fr; gap:30px; } }
@media(max-width:760px) { .atlas-top { gap:12px; }.atlas-top .folio-label { font-size:10px; }.atlas-layout { grid-template-columns:1fr; gap:35px; padding:40px 0 20px; }.atlas-copy h1 { font-size:clamp(48px,9.6vw,72px); white-space:normal; }.atlas-intro { font-size:16px; }.atlas-copy { max-width:620px; }.current-line { margin-top:22px; }.connection-atlas { max-width:530px; margin:0 auto; }.atlas-node strong { font-size:18px; }.atlas-node small { font-size:10px; }.atlas-node { padding:12px; min-width:135px; }.node-craft { left:40%; }.node-craft img { width:58px; height:46px; }.atlas-note { font-size:12px; }.atlas-bottom { flex-wrap:wrap; font-size:10px; }.atlas-bottom>a { display:none; }.atlas-bottom .motion-toggle { font-size:11px; }.evidence-strip { grid-template-columns:1fr; }.evidence-strip>a,.evidence-strip>a+a { padding:20px 25px 20px 0; border-right:0; border-bottom:1px solid #c5cdbd; }.evidence-strip strong { font-size:26px; }.evidence-strip span { font-size:13px; }.evidence-strip b { top:25px; right:0; }.selected-work,.beyond-section { padding-block:65px; }.folio-heading>div { display:block; }.folio-heading>div>p { max-width:100%; margin-top:24px; }.folio-heading>.folio-label { font-size:11px; }.work-filter { gap:8px; margin-top:25px; padding:22px 0; }.work-filter button { font-size:12px; padding:10px 12px; }#work-count { width:100%; margin:7px 0 0; }.evidence-grid { grid-template-columns:1fr; gap:45px; }.evidence-project:nth-child(even) { padding-top:0; }.project-index { flex-direction:row; }.evidence-project h3 { font-size:32px; }.evidence-outcome { flex-direction:row; }.evidence-outcome span { text-align:right; }.baby-annotation { font-size:20px; }.approach-section { grid-template-columns:1fr; gap:40px; padding-block:65px; }.approach-intro h2 { font-size:48px; }.personal-pair { grid-template-columns:1fr; gap:45px; margin-top:35px; }.personal-world:nth-child(2) { padding-top:0; }.personal-world img { height:auto; max-height:370px; }.personal-world h3 { font-size:32px; }.folio-contact { padding-block:60px; }.folio-contact h2 { font-size:clamp(44px,10vw,72px); }.contact-options { gap:20px; }.folio-footer { align-items:flex-start; flex-direction:column; gap:20px; }.case-facts { grid-template-columns:1fr 1fr; }.case-facts>div:first-child { grid-column:1/-1; }.case-lede { font-size:18px; }.case-body { grid-template-columns:1fr; padding-block:35px; }.case-aside { position:static; display:flex; gap:25px; overflow:auto; }.case-aside a { flex:0 0 auto; }.case-results { gap:12px; }.case-results strong { font-size:28px; }.case-results span { font-size:12px; }.case-hero h1 { font-size:49px; }.case-section h2 { font-size:34px; } }
@media(max-width:390px) { .folio-pad { padding-inline:20px; }.atlas-top>span { display:none; }.atlas-node { min-width:115px; padding:10px; }.atlas-node strong { font-size:16px; }.atlas-node small { font-size:8px; }.node-craft { left:36%; }.node-craft img { width:42px; height:38px; }.atlas-center span { font-size:7px; }.atlas-note { font-size:11px; bottom:-8px; }.project-index { flex-direction:column; }.evidence-outcome { flex-direction:column; }.evidence-outcome span { text-align:left; }.baby-annotation { font-size:16px; left:20px; }.case-results { grid-template-columns:1fr; } }
.is-paused .mini-wave i { animation-play-state:paused; }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.portfolio-home *, .case-page * { animation:none!important; transition:none!important; }.travel-dot { display:none; } }
/* Leave dedicated space for changing map annotations on narrow screens. */
@media(max-width:1050px) {
  .connection-atlas { margin-bottom:75px; }
  .atlas-note { top:100%; bottom:auto; margin-top:14px; }
}

/* Product briefs expose the live product alongside role, period, and scope. */
.case-facts-with-website { grid-template-columns:1.4fr .8fr 1.6fr 1fr; }
.case-facts-with-website a { text-decoration:underline; text-underline-offset:4px; overflow-wrap:anywhere; }
.case-facts-with-website a:hover { color:var(--accent); }
@media(max-width:760px) {
  .case-facts-with-website { grid-template-columns:1fr 1fr; }
  .case-facts-with-website>div:first-child { grid-column:auto; }
}
@media(max-width:420px) { .case-facts-with-website { grid-template-columns:1fr; } }