html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
}
button {
  cursor: pointer;
}
#collage-stage {
  transform: translateX(-50%) scale(var(--collage-scale, 1)) !important;
}
#mobile-home {
  display: none;
}
.collage-drag-surface {
  pointer-events: none;
  outline: none;
}
.collage-drag-surface:focus-visible {
  outline: 1px dashed #777;
  outline-offset: 4px;
}
.collage-hit-area image {
  pointer-events: visiblePainted;
}
.collage-drag-surface.is-dragging {
  cursor: grabbing;
}
.collage-drag-surface.icon-hover::after {
  content: "";
  position: absolute;
  inset: -4px;
  border: 2px solid #E11B0C;
  border-radius: 3px;
  pointer-events: none;
}
[data-collage] {
  will-change: transform;
}
[data-project].awaiting-reveal {
  opacity: 0;
  transform: translateY(12px);
}
aside [data-scroll] > span:first-child {
  transform: scaleX(0);
  opacity: 0;
}
aside [data-scroll].is-active > span:first-child {
  transform: scaleX(1) rotate(-0.6deg);
  opacity: 1;
}
aside [data-scroll] > span:last-child {
  color: rgb(0 0 0 / 0.42);
}
aside [data-scroll].is-active > span:last-child {
  color: #1a1a1a;
}
.cursor-note {
  position: fixed;
  z-index: 9999;
  pointer-events: none;
  padding: 2px;
  background: #E11B0C;
  border: 1px solid #0000001a;
  border-radius: 1px;
  color: #000;
  box-shadow: 0 2px 8px #0000001f;
}
.cursor-note[hidden] {
  display: none;
}
#reset-collage {
  transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}
#reset-collage:hover {
  transform: rotate(1deg) scale(1.04) !important;
}
.project-dialog {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.project-dialog .backdrop {
  position: absolute;
  inset: 0;
  background: #1a1a1a2e;
  backdrop-filter: blur(2px);
  border: 0;
}
.project-dialog .project-window-panel {
  position: relative;
  width: 80vw;
  height: 82vh;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #0000001f;
  background:
    linear-gradient(#efece4c7, #efece4c7),
    url("/assets/paper-background.webp") center/cover;
}
.project-dialog header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 24px;
  border-bottom: 1px solid #0000001a;
  font:
    700 13.68px/1.35 alteHaas,
    sans-serif;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.project-dialog header button {
  border: 0;
  background: none;
  font: 700 18.4px/1 alteHaas;
  color: #0007;
}
.project-body {
  overflow: auto;
  flex: 1;
  padding: 48px;
}
.project-body h1 {
  font:
    700 clamp(26px, 3.2vw, 44px)/1.05 alteHaas,
    sans-serif;
  letter-spacing: 0.02em;
  max-width: 700px;
  text-transform: uppercase;
}
.project-body p {
  margin-top: 24px;
  font:
    700 16px/1.55 alteHaas,
    sans-serif;
  color: #0009;
}
.project-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin-top: 40px;
}
.project-gallery img {
  width: 100%;
  height: auto;
  max-height: 65vh;
  object-fit: contain;
}
.project-gallery img:only-child {
  grid-column: 1/-1;
}
@media (max-width: 1439px) and (min-width: 768px) {
  #home {
    height: calc(945px * var(--collage-scale)) !important;
  }
}
@media (max-width: 767px) {
  #home,
  #home + div {
    display: none;
  }
  #mobile-home {
    display: block;
  }
  .project-dialog {
    padding: 12px;
  }
  .project-dialog .project-window-panel {
    width: 94vw;
    height: 90vh;
  }
  .project-dialog header {
    padding: 12px 16px;
  }
  .project-body {
    padding: 24px;
  }
  .project-gallery {
    gap: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}


html, body { background-color: #EFECE4; }


[data-collage="nameCard"] { width: 39%; top: 7%; }
.paper-copy {
  position: absolute;
  z-index: 1;
  left: 16%;
  top: 48%;
  width: 76%;
  color: #1a1a1a;
  font-family: var(--font-alte-haas), Arial, sans-serif;
  pointer-events: none;
  transform: rotate(5deg);
}
.paper-copy h1 { margin: 0; font-size: 4.7cqw; font-weight: 700; line-height: 1.25; letter-spacing: -0.025em; }
.paper-copy h1 span { white-space: nowrap; }
.paper-subtitle { margin-top: 1.5em; font-size: 3cqw; line-height: 1.6; font-weight: 400; }
.paper-subtitle p { margin: 0; }
#mobile-home .paper-copy { top: 48%; }


@font-face {
  font-family: 'Hepta Slab';
  src: url('/assets/HeptaSlab-Regular.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
:root { --portfolio-body: 'SF Pro Text', 'SF Pro Display', -apple-system, BlinkMacSystemFont, sans-serif; }
body, body * { font-family: var(--portfolio-body) !important; }
h1, h2, h3, h1 *, h2 *, h3 *, .project-dialog-title {
  font-family: 'Hepta Slab', serif !important;
  font-weight: 400 !important;
}
.paper-copy { left: 13%; width: 84%; }
.paper-copy h1 { font-size: 5.6cqw; line-height: 1.3; letter-spacing: -0.045em; }

.paper-copy h1 { font-size: 50px; }


[data-collage="nameCard"] { width: 43%; top: -4%; }
.paper-copy { left: 18%; top: 28%; width: calc(64% - 24px); transform-origin: top left; }
.paper-copy h1 { font-size: 50px; line-height: 1.08; letter-spacing: -0.065em; }
.paper-copy h1 span { white-space: normal; }
.paper-subtitle { margin-top: 32px; font-size: 20px; line-height: 1.5; }
.paper-subtitle p { display: grid; grid-template-columns: 1fr 1.2fr; gap: 16px; margin-top: 16px; }
#mobile-home .paper-copy { top: 28%; left: calc(14% + 24px); width: calc(70% - 48px); }
#mobile-home .paper-copy h1 { font-size: clamp(22px, 7.5cqw, 50px); }
#mobile-home .paper-subtitle { font-size: 3.5cqw; margin-top: 18px; }
#mobile-home .paper-subtitle p { gap: 6px; margin-top: 8px; }

[data-collage="iconDrawpaint"] { left: 14%; top: 33%; }
[data-collage="iconWood"] { left: 16%; top: 51%; }


:root { --portfolio-ink: #623521; }
body, body * { color: var(--portfolio-ink) !important; }
.paper-copy h1 { line-height: 1.18; letter-spacing: -0.055em; }
.paper-subtitle { margin-top: 40px; line-height: 1.55; }
.paper-subtitle p { margin-top: 0; align-items: baseline; }
.paper-subtitle p + p { margin-top: 20px; }
#mobile-home .paper-subtitle { margin-top: 24px; }
#mobile-home .paper-subtitle p { margin-top: 0; }
#mobile-home .paper-subtitle p + p { margin-top: 12px; }


.paper-subtitle p { display: block; white-space: nowrap; }
.paper-subtitle p + p { margin-top: 8px; }
#mobile-home .paper-subtitle p + p { margin-top: 6px; }


[data-collage="portrait1"] { width: 17%; }
[data-collage="workingPortrait"] { width: 21%; }
#mobile-home img[src="/assets/my-work-blank.png.webp"] { width: 130%; max-width: none; }


[data-collage="emailBookmark"] { width: 28%; }


[data-collage="emailBookmark"] { width: 21%; top: -2%; }


#home > [aria-hidden="true"]::after,
#mobile-home > [aria-hidden="true"]::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: clamp(90px, 16vh, 150px);
  background: linear-gradient(to bottom, rgb(239 236 228 / 0) 0%, rgb(239 236 228 / .08) 20%, rgb(239 236 228 / .3) 45%, rgb(239 236 228 / .67) 72%, #efece4 100%);
  pointer-events: none;
}


.paper-keychain {
  position: absolute;
  left: -18%;
  bottom: 4%;
  width: 100%;
  height: auto;
  z-index: 3;
  pointer-events: none;
  transform: rotate(-7deg);
  filter: drop-shadow(0 10px 12px rgb(0 0 0 / .2));
}


[data-collage="patternTexture"],
[data-collage="pages"],
#mobile-home .absolute:has(> .relative > img[src="/assets/pages.1nxkzaxgocxbs.webp"]),
#mobile-home .absolute:has(> .relative > img[src="/assets/pattern-texture.0v_mc6ahkw7pp.webp"]) {
  display: none;
}


.paper-copy { left: calc(18% + 20px); }
#mobile-home .paper-copy { left: calc(14% + 44px); }


[data-collage="portrait1"] .collage-drag-surface,
[data-collage="workingPortrait"] .collage-drag-surface {
  pointer-events: auto;
  touch-action: none;
}
[data-collage="portrait1"] .collage-hit-area,
[data-collage="portrait1"] .collage-hit-area image,
[data-collage="workingPortrait"] .collage-hit-area,
[data-collage="workingPortrait"] .collage-hit-area image {
  pointer-events: none;
}

[data-collage="angelaTag"] .collage-drag-surface { pointer-events: auto; filter: drop-shadow(0 10px 12px rgb(0 0 0 / .2)); }


[data-collage="nameCard"] .collage-drag-surface > .relative,
[data-collage="emailBookmark"] .collage-drag-surface > .relative {
  scale: .9;
  transform-origin: top left;
}


[data-collage="nameCard"] { left: 25%; top: 2%; width: 38%; }
[data-collage="emailBookmark"] { left: 48%; top: -8%; width: 22%; }
[data-collage="portrait1"] { left: 61%; top: 7%; width: 22.4%; }
[data-collage="workingPortrait"] { left: 60%; top: 45%; width: 22%; }
[data-collage="angelaTag"] { left: 8% !important; top: 45% !important; width: 41% !important; }
[data-collage^="icon"] { display: none; }
[data-collage="nameCard"] { width: 43%; }
[data-collage="nameCard"] .collage-drag-surface > .relative { scale: .8; }


[data-collage] .collage-drag-surface { pointer-events: none !important; touch-action: none; }
[data-collage] .collage-drag-surface img {
  pointer-events: auto !important;
  cursor: grab !important;
  touch-action: none;
  user-select: none;
  -webkit-user-drag: none;
}
[data-collage] .collage-hit-area,
[data-collage] .collage-hit-area image { pointer-events: none !important; }
[data-collage] .is-pressed img,
[data-collage] .is-dragging img { cursor: grabbing !important; }
[data-collage="emailBookmark"] img { clip-path: polygon(16% 11%, 75% 11%, 88% 91%, 28% 91%); }
[data-collage="nameCard"] img { clip-path: polygon(8% 9%, 99% 14%, 91% 88%, 1% 84%); }
[data-collage] .collage-drag-surface { cursor: grab !important; }
[data-collage] .collage-drag-surface.is-pressed,
[data-collage] .collage-drag-surface.is-dragging { cursor: grabbing !important; }

[data-collage="nameCard"] img { clip-path: none; }


[data-collage] { pointer-events: none; }


:root { --portfolio-accent: #E11B0C; }
body [class*="text-[#E11B0C]"]:not([class*="hover:"]),
body [class*="hover:text-[#E11B0C]"]:hover {
  color: var(--portfolio-accent) !important;
}
#reset-collage img { filter: sepia(1) saturate(8) hue-rotate(315deg) brightness(.78) contrast(1.3); }
::selection { background: #E11B0C; color: #fff; }

body .work-category-label { color: #F8ADCB !important; }


body { font-size: 1rem; line-height: 1.6; }
body p:not(.paper-copy p):not(header p):not(.metadata):not(.label) {
  font-size: 1.125rem !important;
  line-height: 1.65 !important;
}
body :is(.metadata, .label, figcaption, small) { font-size: 1rem !important; line-height: 1.5; }
body :is(button, input, textarea, select) { font-size: max(1rem, 1em); }
aside [data-scroll] { min-height: 44px; }
.paper-subtitle { font-size: 1.5rem; line-height: 1.55; }
.paper-subtitle p { font-size: inherit !important; line-height: inherit; white-space: normal; }
#mobile-home .paper-subtitle { font-size: 1rem; }
.project-window-panel { overflow-wrap: break-word; }
.project-window-panel p { max-width: 70ch; }


#reset-collage { width: 160px; }
#reset-collage img { filter: none; }
@media (max-width: 767px) { #reset-collage { width: 120px; } }


body #selected-works aside h1 {
  font-size: clamp(1rem, 1.35vw, 1.15rem);
}
body #selected-works aside p {
  font-size: clamp(.72rem, .92vw, .84rem) !important;
  line-height: 1.55 !important;
  color: #898989 !important;
}
body #selected-works aside [data-scroll],
body #selected-works aside [data-scroll] span {
  font-size: clamp(.72rem, .92vw, .84rem) !important;
  line-height: 1.35;
}
body #selected-works aside [data-scroll] { min-height: 0; }
body #selected-works aside [data-scroll] > span:last-child,
body #selected-works aside [data-scroll] > span:last-child * {
  color: #898989 !important;
}
body #selected-works aside [data-scroll]:hover > span:last-child,
body #selected-works aside [data-scroll]:hover > span:last-child * {
  color: #666 !important;
}
body #selected-works aside [data-scroll].is-active > span:last-child,
body #selected-works aside [data-scroll].is-active > span:last-child * {
  color: #623521 !important;
}
body #selected-works [data-project] p:not(.metadata) {
  font-size: clamp(.78rem, .98vw, .9rem) !important;
  line-height: 1.55 !important;
  color: #898989 !important;
}
body #selected-works [data-project] .metadata {
  font-size: clamp(.62rem, .82vw, .74rem) !important;
  color: #898989 !important;
}
@media (max-width: 767px) {
  body #selected-works aside p,
  body #selected-works aside [data-scroll],
  body #selected-works aside [data-scroll] span,
  body #selected-works [data-project] p:not(.metadata) { font-size: .875rem !important; }
}



.project-dialog.reference-dialog { padding: 0; }
.reference-dialog .project-window-panel {
  width: 100vw !important; height: 100dvh !important;
  max-width: none !important; max-height: none !important;
  border: 0; border-radius: 0; background-color: #EFECE4;
}
.case-layout { position: relative; z-index: 1; display: grid; grid-template-columns: 280px minmax(0, 1fr); flex: 1; min-height: 0; }
.case-sidebar { padding: 36px 24px; overflow-y: auto; border-right: 1px solid rgb(98 53 33 / .15); }
.case-sidebar h2 { margin: 0 0 28px; font-size: clamp(1rem, 1.35vw, 1.15rem); }
.case-sidebar nav { display: flex; flex-direction: column; gap: 8px; }
body .case-sidebar button { padding: 10px 12px; border: 0; background: transparent; text-align: left; color: #898989 !important; font-size: 16px; line-height: 1.5; cursor: pointer; }
body .case-sidebar button.is-active { color: #623521 !important; background: rgb(225 27 12 / .16); }
.case-sidebar button:focus-visible { outline: 2px solid #E11B0C; outline-offset: 2px; }
.case-content { min-width: 0; height: 100%; overscroll-behavior: contain; }
body .case-content h1 { font-size: clamp(1.35rem, 2.4vw, 2rem) !important; line-height: 1.15; }
body .case-content p:not(.metadata):not(.label) { font-size: 18px !important; line-height: 1.65 !important; }

body #selected-works aside p,
body #selected-works aside [data-scroll],
body #selected-works aside [data-scroll] span { font-size: calc(clamp(.72rem, .92vw, .84rem) + 2px) !important; }
body #selected-works [data-project] p:not(.metadata) { font-size: calc(clamp(.78rem, .98vw, .9rem) + 2px) !important; }
@media (max-width: 767px) {
 .case-layout { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0,1fr); }
 .case-sidebar { padding: 12px 16px; border-right: 0; border-bottom: 1px solid rgb(98 53 33 / .15); }
 .case-sidebar h2 { display: none; }
 .case-sidebar nav { flex-direction: row; overflow-x: auto; }
 .case-sidebar button { flex-shrink: 0; max-width: 230px; }
 body #selected-works aside p, body #selected-works aside [data-scroll], body #selected-works aside [data-scroll] span,
 body #selected-works [data-project] p:not(.metadata) { font-size: 16px !important; }
}
.case-content :is(.grid, .flex) > * { min-width: 0; }
.case-content img { max-width: 100%; }


.photo-link-frame { container-type: inline-size; }
body [data-collage] .photo-caption-link {
 position:absolute; z-index:4; display:block; pointer-events:auto !important;
 cursor:pointer !important; transform-origin:center; border-radius:3px;
}
.photo-link-about { left:31%; top:80%; width:52%; height:11%; transform:rotate(10deg); }
.photo-link-work { left:47%; top:77%; width:38%; height:12%; transform:rotate(-7deg); }
.photo-checkbox { position:absolute; left:0; top:50%; transform:translateY(-50%); width:4.4cqw; height:4.4cqw; border:1.4px solid #623521; display:flex; align-items:center; justify-content:center; font-size:4.2cqw; line-height:1; }
body .photo-caption-link .photo-checkbox { color:transparent !important; cursor:pointer !important; }
body .photo-caption-link:hover .photo-checkbox,
body .photo-caption-link:focus-visible .photo-checkbox { color:#623521 !important; }
.photo-caption-link:focus-visible { outline:2px solid #E11B0C; outline-offset:3px; }
.work-page-header { padding:24px 32px; }
.work-page-header a { text-decoration:none; }
.work-page #selected-works { margin-top:0; }
.photo-link-about { left:29%; width:54%; }
.photo-link-work { top:74%; }


.home-site-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px max(4.8vw,24px);background:#f7f7f5;position:relative;z-index:90;}
body .home-site-header .home-wordmark{font-size:28px!important;font-weight:700!important;letter-spacing:-1.5px;color:#623521!important;line-height:1.2;text-decoration:none;}
body .home-site-header .home-wordmark span{color:#E11B0C!important;}
.home-site-header nav{display:flex;gap:32px;align-items:center;}
body .home-site-header nav a{font-size:16px!important;line-height:1.6;color:#623521!important;text-decoration:none;padding:4px 0;border-bottom:2px solid transparent;}
body .home-site-header nav a.is-current,.home-site-header nav a:hover{border-bottom-color:#E11B0C;}
.home-site-header a:focus-visible{outline:2px solid #E11B0C;outline-offset:5px;}
#home>[aria-hidden="true"]>div,#mobile-home>[aria-hidden="true"]>div{background:transparent!important;}
#home>[aria-hidden="true"]>img,#mobile-home>[aria-hidden="true"]>img{object-fit:cover;object-position:center;}
#home>[aria-hidden="true"]::after,#mobile-home>[aria-hidden="true"]::after{height:clamp(130px,22vh,220px);background:linear-gradient(to bottom,rgba(239,236,228,0),#efece4);}
#reset-collage,.cursor-note{display:none!important;}
@media(max-width:650px){.home-site-header{padding:20px 24px;gap:16px;}body .home-site-header .home-wordmark{font-size:24px!important;}.home-site-header nav{gap:20px;}body .home-site-header nav a{font-size:14px!important;}}


.home-site-header{position:absolute;inset:0 0 auto;background:transparent;border:0;box-shadow:none;}
body:has(>.home-site-header) #collage-stage{top:calc(5vh + 72px)!important;}
@media(max-width:767px){body:has(>.home-site-header) #mobile-home{padding-top:72px;}}


#selected-works.work-list{max-width:1120px;margin:0 auto;padding:48px 40px 64px;background:transparent;}
#selected-works .work-list-item{padding:48px 0;border-bottom:1px solid #d3d8d8;opacity:1!important;transform:none!important;scroll-margin-top:24px;}
#selected-works .work-list-item:first-child{padding-top:0;}
#selected-works .work-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:48px;align-items:center;width:100%;padding:0;border:0;background:transparent;text-align:left;}
body #selected-works .work-copy h2{font-family:'Hepta Slab',serif!important;font-weight:400!important;font-size:36px!important;line-height:1.18!important;letter-spacing:-.045em!important;margin:12px 0 24px;text-transform:none;}
body #selected-works .work-copy .work-kind,body #selected-works .work-copy .work-disciplines{font-size:14px!important;font-weight:400!important;line-height:1.6!important;color:#686663!important;margin:0 0 16px;}
body #selected-works .work-copy .work-summary{font-size:17px!important;font-weight:400!important;line-height:1.6!important;color:#64615f!important;margin:0 0 24px;max-width:390px;}
body #selected-works .work-copy .work-disciplines{margin:0 0 28px;}
body #selected-works .work-action{display:inline-block;color:#E11B0C!important;font-size:16px!important;font-weight:400!important;line-height:1.6;border-bottom:1px solid #E11B0C;padding-bottom:3px;}
#selected-works .work-row:focus-visible{outline:2px solid #E11B0C;outline-offset:8px;}
#selected-works .work-visual{min-width:0;}
#selected-works .work-covers{display:flex;gap:10px;}
#selected-works .work-covers img{display:block;width:calc(50% - 5px);aspect-ratio:.72;object-fit:cover;border-radius:5px;}
#selected-works .work-photo{display:block;width:100%;aspect-ratio:1.35;object-fit:cover;border-radius:28px;}
#selected-works .work-amtrak-preview{display:flex;align-items:center;justify-content:center;aspect-ratio:1.35;border-radius:28px;background:radial-gradient(ellipse at 24% 100%,#80abc0,transparent 65%),radial-gradient(ellipse at 75% 15%,#526c82,transparent 64%),linear-gradient(130deg,#00537e,#071f38);}
#selected-works .work-amtrak-preview img{display:block;width:70%;height:auto;filter:brightness(0) invert(1);}
@media(max-width:650px){#selected-works.work-list{padding:32px 24px 40px;}#selected-works .work-row{grid-template-columns:1fr;gap:28px;}#selected-works .work-list-item{padding:36px 0;}body #selected-works .work-copy h2{font-size:30px!important;}#selected-works .work-photo,#selected-works .work-amtrak-preview{border-radius:22px;}}


#selected-works .work-visual> :is(.work-photo,.work-amtrak-preview,.bf-motion-thumbnail){width:100%;height:auto;aspect-ratio:16/9;border-radius:28px;overflow:hidden}
#selected-works .work-list-item:last-child{border-bottom:0}
#selected-works .work-amtrak-preview{position:relative;isolation:isolate;background:#00537e}
#selected-works .work-amtrak-preview>.amtrak-glass-hero{position:absolute;inset:0;width:100%;height:100%;min-height:0;z-index:0;border-radius:inherit}
#selected-works .work-amtrak-preview>img{position:relative;z-index:1}
@media(max-width:650px){#selected-works .work-visual> :is(.work-photo,.work-amtrak-preview,.bf-motion-thumbnail){border-radius:22px}}


#collage-stage [data-collage]:is([data-collage="nameCard"],[data-collage="emailBookmark"],[data-collage="portrait1"],[data-collage="workingPortrait"],[data-collage="angelaTag"]){filter:none!important}
#collage-stage [data-collage]:is([data-collage="nameCard"],[data-collage="emailBookmark"],[data-collage="portrait1"],[data-collage="workingPortrait"],[data-collage="angelaTag"]) .collage-drag-surface{filter:drop-shadow(0 14px 18px rgb(35 43 48 / .16)) drop-shadow(0 3px 4px rgb(35 43 48 / .06))}
.paper-keychain{filter:drop-shadow(0 14px 18px rgb(35 43 48 / .16)) drop-shadow(0 3px 4px rgb(35 43 48 / .06))}

#collage-stage [data-collage="angelaTag"]{left:3%!important;top:57%!important;width:36%!important}
#home{min-height:calc(72px + 5vh + 960px * var(--collage-scale,1))}
#mobile-home .paper-keychain{left:-20%;bottom:-12%;width:82%;transform:rotate(0deg)}

#selected-works .work-list-item{padding-block:80px}
#selected-works .work-list-item:first-child{padding-top:0}
@media(max-width:650px){#selected-works .work-list-item{padding-block:56px}#selected-works .work-list-item:first-child{padding-top:0}}


img[src="/assets/meet-angela-blank.png.webp"]{clip-path:polygon(19.7% 2.8%,96.8% 15.2%,81.4% 98.2%,4% 85.7%)}
img[src="/assets/my-work-blank.png.webp"]{clip-path:polygon(11.6% 13.3%,79% 5%,88.6% 86.6%,20.8% 94.1%)}


body .portfolio-section-title{font-family:'Hepta Slab',serif!important;font-size:20px;font-weight:400;line-height:1.4;letter-spacing:.02em;color:#623521;margin:0 0 48px;}
#selected-works .work-list-item:first-of-type{padding-top:0}
#experiments>.relative{max-width:1120px;margin-inline:auto;padding-inline:40px}
#experiments .portfolio-section-title+div{margin-top:0}
@media(max-width:650px){
 body .portfolio-section-title{font-size:18px;margin-bottom:32px}
 #experiments>.relative{padding-inline:24px}
}


.hero-work-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;align-items:center;gap:12px;border:0;background:transparent;color:#623521;padding:10px 22px;cursor:pointer;font-family:'Hepta Slab',serif;font-size:16px;font-weight:400;letter-spacing:.06em;line-height:1.4;}
.hero-work-cue svg{transition:transform 220ms ease}
.hero-work-cue:hover svg{transform:translateY(5px)}
.hero-work-cue:focus-visible{outline:2px solid #623521;outline-offset:5px;border-radius:3px}
@media(prefers-reduced-motion:reduce){.hero-work-cue svg{transition:none}}
@media(max-width:650px){#mobile-home{padding-bottom:100px}.hero-work-cue{bottom:20px;font-size:14px;gap:8px}}


@media(min-width:768px){
 body #home{height:100svh!important;min-height:0}
 body:has(>.home-site-header) #collage-stage{top:100px!important}
}
body .hero-work-cue{bottom:20px;flex-direction:row;gap:8px;padding:8px 14px;font-family:'Alte Haas Grotesk',Arial,sans-serif;font-size:13px;letter-spacing:0;line-height:20px;color:#756b61}
body .hero-work-cue svg{width:16px;height:16px}
.hero-work-cue:hover svg{transform:translateY(2px)}


.portfolio-cursor{position:fixed;left:0;top:0;z-index:2147483647;pointer-events:none;opacity:0;will-change:transform}
.portfolio-cursor__shape{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:10px;height:10px;transform:translate(-50%,-50%);border:1px solid #e11b0c;border-radius:999px;background:#e11b0c;color:white;white-space:nowrap;font:11px/1.2 Arial,sans-serif;box-shadow:0 3px 14px rgb(225 27 12 / .16);transition:width .18s ease,height .18s ease,background .18s ease,box-shadow .18s ease}
.portfolio-cursor[data-state="link"] .portfolio-cursor__shape{width:24px;height:24px;background:transparent;box-shadow:none}
.portfolio-cursor[data-state="label"] .portfolio-cursor__shape{width:88px;height:28px}
.portfolio-cursor[data-pressed="true"] .portfolio-cursor__shape{scale:.88}
@media(hover:hover) and (pointer:fine){
 html.has-portfolio-cursor,html.has-portfolio-cursor *{cursor:none!important}
}
@media(prefers-reduced-motion:reduce){.portfolio-cursor__shape{transition:none}}


body .portfolio-cursor__shape{color:#fff!important;font-weight:600!important}
.portfolio-cursor[data-state="link"] .portfolio-cursor__shape{width:34px;height:34px}
.portfolio-cursor[data-state="label"] .portfolio-cursor__shape{width:122px;height:30px}



body .portfolio-cursor__shape{font-family:var(--portfolio-body)!important;font-size:16px;line-height:1.6;font-weight:500!important;letter-spacing:normal}
.portfolio-cursor[data-state="label"] .portfolio-cursor__shape{width:156px;height:38px;padding:6px 16px}


.home-wordmark,.canvas-page-nav>a:first-child{display:inline-flex;align-items:center;flex-shrink:0}
.angela-brand-logo{display:block;width:70px;height:51px;object-fit:contain}
@media(max-width:650px){.angela-brand-logo{width:54px;height:40px}.home-site-header nav{gap:16px}}


html{scrollbar-gutter:stable}
#home,#mobile-home{background-color:#efece4}
#home>[aria-hidden="true"],#mobile-home>[aria-hidden="true"]{transform:translateZ(0);backface-visibility:hidden}
body.case-study-open main .amtrak-glass-hero *,main .amtrak-glass-hero.is-paused *{animation-play-state:paused!important}


body #selected-works .home-preview-media{position:relative;display:block;overflow:hidden;border-radius:14px;isolation:isolate}
body #selected-works .home-preview-landscape{width:100%;aspect-ratio:16/9;border-radius:28px}
body #selected-works .home-preview-media>img,body #selected-works .home-preview-media>video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;pointer-events:none}
body #selected-works .home-preview-media>img{z-index:0}
body #selected-works .home-preview-media>video{z-index:1;opacity:0}
body #selected-works .home-preview-media>video.home-preview-playing{opacity:1}
@media(max-width:650px){body #selected-works .home-preview-media{border-radius:9px}body #selected-works .home-preview-landscape{border-radius:22px}}


@media(max-width:750px){
 body .home-site-header nav a{display:inline-flex;align-items:center;min-height:44px;box-sizing:border-box}
}

/* Shared thumbnail canvas, matching the onboarding artwork. */
body #selected-works .work-row .work-visual{width:100%;height:auto!important;min-height:0!important;aspect-ratio:1856/1339!important;box-sizing:border-box;overflow:hidden;border-radius:28px}
body #selected-works .work-row .work-visual:not(.ob-thumbnail)>:is(.work-photo,.work-amtrak-preview,.bf-motion-thumbnail,.bm-work-preview,.ba-home-preview){width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;aspect-ratio:1856/1339!important;box-sizing:border-box}
body .project-dialog :is(.befreed-next-preview,.bf-next-amtrak,.bf-next-marketing,.heller-next-case>a>img,.amtrak-next-case>a>img){aspect-ratio:1856/1339!important;height:auto;object-fit:cover}
@media(max-width:650px){body #selected-works .work-row .work-visual{border-radius:22px}}

/* Hide undecoded collage surfaces; JS reveals them after image/font readiness. */
html.home-assets-pending #home .collage-drag-surface{opacity:0!important}
@media(prefers-reduced-motion:reduce){html.home-assets-pending #home .collage-drag-surface{opacity:1!important}}

/* The same quiet, one-time arrival used by the Amtrak scenes. */
#selected-works.home-reveal-ready .work-row>:is(.work-copy,.work-visual){opacity:0;translate:0 30px;transition:opacity .65s ease,translate .8s cubic-bezier(.2,.7,.2,1)}
#selected-works.home-reveal-ready .work-row .work-visual{transition-delay:.08s}
#selected-works.home-reveal-ready .work-row.is-revealed>:is(.work-copy,.work-visual){opacity:1;translate:0 0}
@media(prefers-reduced-motion:reduce){#selected-works.home-reveal-ready .work-row>:is(.work-copy,.work-visual){opacity:1;translate:none;transition:none}}

body .signature-footer .email-copy-status{position:absolute!important;bottom:72px!important;right:max(4.8vw,24px)!important;left:auto!important;width:auto!important;height:auto!important;clip-path:none!important;overflow:visible!important;margin:0!important;padding:0!important;font:400 12px/1.5 var(--portfolio-body,Arial,sans-serif)!important;letter-spacing:.04em!important;color:#62352199!important;text-align:right!important;pointer-events:none}
.portfolio-cursor[data-state="copy"] .portfolio-cursor__shape{width:124px;height:32px;padding:6px 12px;background:#623521;border-radius:5px;box-shadow:0 4px 14px #62352116}
.portfolio-cursor[data-state="copy"] .portfolio-cursor__label{font-size:12px;font-weight:400;letter-spacing:.015em}

/* Keep inline videos renderable on iOS; their native poster covers loading. */
@media(hover:none) and (pointer:coarse){body #selected-works .home-preview-media>video{opacity:1}}

/* Keep the mobile paper copy inside its own canvas at narrow widths. */
@media(max-width:767px){
 #mobile-home .paper-copy{left:18%;top:27%;width:72%;box-sizing:border-box}
 #mobile-home .paper-copy h1{font-size:clamp(16px,6.8cqw,28px);line-height:1.18;letter-spacing:-.05em}
 #mobile-home .paper-subtitle{font-size:clamp(10px,3.4cqw,14px);line-height:1.5;margin-top:6cqw}
 #mobile-home .paper-subtitle p{font-size:inherit!important;line-height:inherit!important;white-space:normal}
 #mobile-home .paper-subtitle p+p{margin-top:2cqw}
}
@media(max-width:360px){
 .home-site-header{padding:18px 20px;gap:12px}
 .home-site-header .angela-brand-logo{width:46px;height:auto}
 .home-site-header nav{gap:14px}
 body .home-site-header nav a{font-size:12px!important}
}

/* Consistent descriptive tags beneath every selected-work summary. */
body #selected-works .work-copy .work-disciplines{display:flex;flex-wrap:wrap;align-items:center;gap:8px;max-width:100%;margin:0 0 28px}
body #selected-works .work-copy .work-disciplines .work-tag{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;max-width:100%;padding:7px 14px;border:1px solid #62352126;border-radius:999px;background:transparent;color:#686663!important;font:400 12px/1.4 var(--portfolio-body,Arial,sans-serif)!important;letter-spacing:0!important;text-transform:none!important;white-space:nowrap;user-select:none;-webkit-user-select:none}
@media(max-width:650px){body #selected-works .work-copy .work-disciplines{gap:8px;margin-bottom:24px}body #selected-works .work-copy .work-disciplines .work-tag{padding:6px 12px;font-size:12px!important}}
@media(max-width:360px){body #selected-works .work-copy .work-disciplines .work-tag{padding:6px 10px;font-size:11px!important}}

/* Mobile hero: clear portrait placement and readable paper details. */
@media(max-width:767px){
 #mobile-home .mobile-home-photo{top:calc(7% - 34px)!important}
 #mobile-home .mobile-home-photo img{width:100%;height:auto;clip-path:none}
 #mobile-home .paper-keychain{bottom:-8%}
 #mobile-home .paper-copy h1{font-size:clamp(18px,7.2cqw,30px)}
 #mobile-home .paper-subtitle{font-size:clamp(12px,4.2cqw,16px);line-height:1.55}
}

@media(max-width:767px){
 #mobile-home .mobile-home-photo{width:36%!important;top:calc(7% - 56px)!important}
 #mobile-home .paper-subtitle{font-size:clamp(13px,4.6cqw,18px)}
 #mobile-home .paper-subtitle .paper-education{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.35em;align-items:start}
 #mobile-home .paper-schools{display:flex;flex-direction:column;gap:.15em}
 #mobile-home .paper-schools>span{white-space:nowrap}
}