.about-page {
  color: #342f28;
  background: #eee8dc;
}

.about-page .site-header {
  color: #28251f;
  background: linear-gradient(180deg, rgba(247, 243, 235, .96), rgba(247, 243, 235, .78));
  border-bottom: 1px solid rgba(60, 52, 42, .08);
  backdrop-filter: blur(14px);
}

.about-page .site-header.scrolled {
  color: #28251f;
  background: rgba(244, 240, 232, .94);
}

.about-page.menu-open .site-header {
  color: var(--white);
  background: transparent;
  border-color: transparent;
}

.about-portfolio-journal {
  --journal-hand: "Selected Ampersand", "Caveat", "Segoe Print", cursive;
  --journal-serif: "Selected Ampersand", "Playfair Display", Georgia, serif;
  --journal-book-width: min(82vw, 1600px, calc((100svh - 225px) * 2.08));
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 100svh;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  padding: clamp(7.2rem, 9vw, 8.8rem) var(--pad) clamp(2.4rem, 4vw, 3.6rem);
  background-color: #eee8dc;
  background-image:
    radial-gradient(ellipse at 15% 15%, rgba(255, 255, 255, .72), transparent 38%),
    radial-gradient(ellipse at 86% 82%, rgba(164, 124, 84, .08), transparent 38%),
    url("assets/about/sketchbook-surround.svg"),
    url("assets/about/paper-fibre.svg");
  background-position: center, center, center, center;
  background-size: auto, auto, cover, 320px 320px;
}

.about-portfolio-journal::before,
.about-portfolio-journal::after {
  position: absolute;
  z-index: -1;
  width: 28rem;
  height: 22rem;
  border-radius: 50%;
  content: "";
  pointer-events: none;
  filter: blur(20px);
}

.about-portfolio-journal::before {
  top: 8%;
  left: -14rem;
  background: rgba(126, 139, 103, .055);
}

.about-portfolio-journal::after {
  right: -13rem;
  bottom: -4rem;
  background: rgba(174, 128, 88, .06);
}

.about-journal-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  width: var(--journal-book-width);
  margin: 0 auto clamp(.8rem, 1.7vw, 1.35rem);
}

.about-journal-heading h1 {
  margin: 0;
  font: 400 clamp(1.45rem, 2vw, 2rem)/1.1 var(--journal-serif);
  letter-spacing: -.025em;
}

.about-journal-heading p {
  margin: 0;
  color: rgba(52, 47, 40, .56);
  font-size: clamp(.7rem, .85vw, .82rem);
  letter-spacing: .035em;
}

.home-journal-stage {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: clamp(2.2rem, 4vw, 4.5rem) minmax(0, 1fr) clamp(2.2rem, 4vw, 4.5rem);
  grid-template-rows: auto auto;
  align-items: center;
  width: min(94vw, 1640px);
  margin: 0 auto;
}

.home-journal-book-frame {
  --book-zoom: 1;
  --book-drag-x: 0px;
  --book-tilt-x: 0deg;
  --book-tilt-y: 0deg;
  --book-hover-y: 0px;
  position: relative;
  grid-column: 2;
  grid-row: 1;
  width: var(--journal-book-width);
  aspect-ratio: 2.08;
  margin: auto;
  outline: 0;
  perspective: 2200px;
  cursor: grab;
  touch-action: pan-y;
}

.home-journal-book-frame::before {
  position: absolute;
  z-index: -3;
  inset: .28rem -.28rem -.72rem;
  border-radius: 26px 26px 31px 31px;
  background:
    linear-gradient(90deg, #e0d6c7 0 .7%, #f3ece1 1.1% 48.8%, #d4c7b5 50%, #f3ece1 51.2% 98.9%, #ded2c1 99.3%),
    #eee5d8;
  box-shadow: 0 42px 74px rgba(68, 51, 33, .17), 0 14px 28px rgba(68, 51, 33, .1);
  content: "";
  transform: perspective(900px) rotateX(1.8deg);
}

.home-journal-book-frame::after {
  position: absolute;
  z-index: -2;
  right: .45rem;
  bottom: -.42rem;
  left: .45rem;
  height: .5rem;
  border-radius: 0 0 19px 19px;
  background: repeating-linear-gradient(180deg, #f7f1e8 0 1px, #d9cebf 1.2px 1.8px, #f8f2e9 2px 3px);
  box-shadow: 0 5px 9px rgba(67, 50, 33, .11);
  content: "";
  transform: perspective(700px) rotateX(-18deg);
  transform-origin: top;
}

.home-journal-book-frame:focus-visible {
  outline: 1px solid rgba(52, 47, 40, .32);
  outline-offset: .8rem;
}

.home-journal-book-frame.is-dragging { cursor: grabbing; }

.home-journal-book {
  position: absolute;
  inset: 0;
  transform: translate3d(var(--book-drag-x), var(--book-hover-y), 0) scale(var(--book-zoom)) rotateX(calc(1.3deg + var(--book-tilt-x))) rotateY(var(--book-tilt-y));
  transform-style: preserve-3d;
  filter: drop-shadow(0 24px 24px rgba(66, 50, 34, .1));
  transition: transform .58s cubic-bezier(.2, .72, .18, 1);
  will-change: transform;
}

.home-journal-book-frame.is-dragging .home-journal-book { transition: transform .08s linear; }

.home-journal-book::before {
  position: absolute;
  z-index: 20;
  top: .3%;
  bottom: .3%;
  left: 50%;
  width: 3.6%;
  background:
    linear-gradient(90deg,
      transparent 0,
      rgba(63, 49, 33, .035) 12%,
      rgba(51, 39, 26, .13) 39%,
      rgba(43, 32, 21, .22) 47%,
      rgba(255, 255, 255, .72) 50%,
      rgba(66, 49, 32, .15) 55%,
      rgba(52, 39, 25, .045) 79%,
      transparent 100%);
  content: "";
  pointer-events: none;
  transform: translateX(-50%) translateZ(12px);
  filter: blur(.2px);
}

.home-journal-book::after {
  position: absolute;
  z-index: 30;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
  border-radius: 2px 16px 16px 2px;
  background: #f8f3e9 url("assets/about/book-paper-natural.webp") center / 720px 720px;
  box-shadow: -16px 1px 22px rgba(56, 42, 28, .2);
  content: "";
  opacity: 0;
  transform-origin: left center;
  backface-visibility: hidden;
  pointer-events: none;
}

.home-journal-book.is-turning-forward::after { animation: journal-turn-forward .76s cubic-bezier(.3, .02, .2, 1); }
.home-journal-book.is-turning-back::after {
  right: auto;
  left: 0;
  border-radius: 16px 2px 2px 16px;
  box-shadow: 16px 1px 22px rgba(56, 42, 28, .2);
  transform-origin: right center;
  animation: journal-turn-back .76s cubic-bezier(.3, .02, .2, 1);
}

@keyframes journal-turn-forward {
  0% { opacity: 0; transform: rotateY(0); }
  12% { opacity: .97; }
  55% { opacity: .92; box-shadow: -34px 2px 32px rgba(56, 42, 28, .23); }
  100% { opacity: 0; transform: rotateY(-179deg); }
}

@keyframes journal-turn-back {
  0% { opacity: 0; transform: rotateY(0); }
  12% { opacity: .97; }
  55% { opacity: .92; box-shadow: 34px 2px 32px rgba(56, 42, 28, .23); }
  100% { opacity: 0; transform: rotateY(179deg); }
}

.home-journal-spread {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  opacity: 0;
  transform: scale(.996) translateX(1%);
  transform-style: preserve-3d;
  pointer-events: none;
  transition: opacity .34s ease .12s, transform .65s cubic-bezier(.2, .72, .18, 1);
}

.home-journal-spread.is-active { z-index: 2; opacity: 1; transform: none; pointer-events: auto; }
.home-journal-spread.is-leaving { z-index: 3; opacity: 0; transform: scale(.994) translateX(-1%); transition: opacity .18s ease, transform .45s cubic-bezier(.2, .72, .18, 1); }
.home-journal-book[data-direction="back"] .home-journal-spread.is-leaving { transform: scale(.994) translateX(1%); }

.home-journal-page {
  position: relative;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background-color: #faf7f0;
  background-image:
    radial-gradient(ellipse at 42% 26%, rgba(255, 255, 255, .72), transparent 58%),
    url("assets/about/book-paper-natural.webp");
  background-size: auto, 720px 720px;
  border: 1px solid rgba(104, 81, 54, .045);
}

.home-journal-page::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  box-shadow: inset 0 1px rgba(255, 255, 255, .92), inset 0 -1px rgba(104, 81, 54, .07);
  content: "";
  pointer-events: none;
}

.home-journal-page-left {
  border-radius: 25px 3px 4px 25px;
  box-shadow: inset -29px 0 38px rgba(59, 43, 26, .09), inset -3px 0 4px rgba(59, 43, 26, .055), inset 0 1px rgba(255, 255, 255, .94);
  transform: perspective(1500px) rotateY(.65deg);
  transform-origin: right center;
}

.home-journal-page-right {
  border-radius: 3px 25px 25px 4px;
  box-shadow: inset 29px 0 38px rgba(59, 43, 26, .09), inset 3px 0 4px rgba(59, 43, 26, .055), inset 0 1px rgba(255, 255, 255, .94);
  transform: perspective(1500px) rotateY(-.65deg);
  transform-origin: left center;
}

.home-journal-photo {
  position: absolute;
  z-index: 7;
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  margin: 0;
  transform: translateZ(5px);
}

.home-journal-photo img {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: saturate(.9) contrast(.985) brightness(1.01);
}

.home-journal-photo::after {
  position: absolute;
  inset: 0;
  background-image: url("assets/about/paper-fibre.svg");
  background-size: 250px 250px;
  content: "";
  opacity: .085;
  pointer-events: none;
  mix-blend-mode: multiply;
}

.home-journal-photo-wide { top: 8.5%; bottom: 8.5%; left: 5.5%; width: 66%; }
.home-journal-photo-wide::before {
  position: absolute;
  z-index: 3;
  top: 0;
  bottom: 0;
  left: 67.4%;
  width: 2.8%;
  background: linear-gradient(90deg, transparent, rgba(36, 28, 19, .11) 44%, rgba(255, 255, 255, .16) 52%, rgba(35, 26, 18, .07) 61%, transparent);
  content: "";
  transform: translateX(-50%);
  pointer-events: none;
}

.home-journal-photo-left, .home-journal-photo-right { top: 8.5%; width: 34%; height: 67%; }
.home-journal-photo-left { left: 8%; }
.home-journal-photo-right { right: 8%; }
.home-journal-spread-pair .home-journal-photo-left,
.home-journal-spread-pair .home-journal-photo-right { height: 60%; }

.home-journal-page-copy {
  position: absolute;
  z-index: 15;
  top: 17%;
  right: 5.5%;
  width: 20%;
  color: #473c31;
  transform: rotate(-1.2deg) translateZ(16px);
}

.home-journal-page-copy p { margin: 0 0 .2rem; color: rgba(71, 60, 49, .64); font: 500 clamp(.85rem, 1.25vw, 1.22rem)/1.05 var(--journal-hand); }
.home-journal-page-copy h2 { margin: 0; font: 500 clamp(1.25rem, 2.05vw, 2.1rem)/.98 var(--journal-hand); letter-spacing: -.01em; }
.home-journal-page-copy a { display: inline-block; margin-top: .65rem; padding-bottom: .08rem; color: rgba(71, 60, 49, .72); border-bottom: 1px solid rgba(71, 60, 49, .34); font: 500 clamp(.76rem, 1.05vw, 1rem)/1 var(--journal-hand); }
.home-journal-spread-pair .home-journal-page-copy { top: auto; right: 24%; bottom: 6%; width: 25%; }

.home-journal-corsage {
  position: absolute;
  z-index: 16;
  right: 7%;
  bottom: 17%;
  width: clamp(78px, 12.5%, 170px);
  height: auto;
  pointer-events: none;
  filter: drop-shadow(0 12px 8px rgba(54, 42, 29, .19)) drop-shadow(0 2px 1px rgba(54, 42, 29, .12));
  transform: rotate(7deg) translateZ(20px);
}

.home-journal-spread:nth-child(2) .home-journal-corsage { right: 6%; bottom: 3%; width: clamp(72px, 9.5%, 145px); transform: rotate(-8deg) translateZ(20px); }
.home-journal-spread:nth-child(3) .home-journal-corsage { right: 8%; bottom: 16%; transform: rotate(4deg) translateZ(20px); }
.home-journal-spread:nth-child(4) .home-journal-corsage { right: 6%; bottom: 17%; transform: rotate(-5deg) translateZ(20px); }
.home-journal-spread:nth-child(5) .home-journal-corsage { right: 8%; bottom: 15%; transform: rotate(9deg) translateZ(20px); }

.home-journal-play {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 50%;
  width: clamp(2rem, 3.8vw, 3.6rem);
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  background: rgba(30, 27, 23, .25);
  transform: translate(-50%, -50%);
  backdrop-filter: blur(5px);
}

.home-journal-play::after {
  position: absolute;
  top: 50%;
  left: 54%;
  width: 0;
  height: 0;
  border-top: .3rem solid transparent;
  border-bottom: .3rem solid transparent;
  border-left: .48rem solid rgba(255, 255, 255, .92);
  content: "";
  transform: translate(-50%, -50%);
}

.home-journal-arrow {
  grid-row: 1;
  display: grid;
  width: clamp(2rem, 3.4vw, 3.4rem);
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  opacity: .48;
  cursor: pointer;
  transition: opacity .25s, transform .3s;
}

.home-journal-arrow-prev { grid-column: 1; justify-self: start; }
.home-journal-arrow-next { grid-column: 3; justify-self: end; }
.home-journal-arrow svg { width: 100%; overflow: visible; fill: none; stroke: #756e64; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 5px 4px rgba(61, 49, 35, .16)); }
.home-journal-arrow:hover, .home-journal-arrow:focus-visible { opacity: .86; }
.home-journal-arrow-prev:hover { transform: translateX(-4px); }
.home-journal-arrow-next:hover { transform: translateX(4px); }

.home-journal-floating-controls {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  justify-content: flex-end;
  gap: .35rem;
  width: var(--journal-book-width);
  margin: .65rem auto 0;
}

.home-journal-floating-controls button { display: grid; width: 1.65rem; aspect-ratio: 1; place-items: center; padding: 0; color: rgba(52, 47, 40, .54); border: 0; border-radius: 50%; background: rgba(255, 255, 255, .38); cursor: pointer; }
.home-journal-floating-controls button:disabled { opacity: .26; }

.home-journal-index {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: clamp(1.5rem, 4vw, 4.5rem);
  width: var(--journal-book-width);
  margin: .2rem auto 0;
}

.home-journal-index button { padding: .35rem 0; color: rgba(52, 47, 40, .34); border: 0; background: transparent; font: 400 clamp(.75rem, .92vw, .88rem)/1 var(--journal-serif); cursor: pointer; transition: color .25s, transform .25s; }
.home-journal-index button:hover, .home-journal-index button:focus-visible, .home-journal-index button.is-active { color: #342f28; transform: translateY(-2px); }

.about-profile {
  display: grid;
  min-height: 88svh;
  grid-template-columns: minmax(240px, .75fr) minmax(0, 1.5fr);
  align-content: center;
  gap: clamp(3rem, 8vw, 9rem);
  padding: clamp(6.5rem, 10vw, 9rem) var(--pad);
  color: #38342c;
  background: #f5f1e8 url("assets/about/paper-fibre.svg") center / 320px 320px;
}

.about-overline { margin: 0 0 1.2rem; color: rgba(56, 52, 44, .48); font-size: .67rem; letter-spacing: .18em; text-transform: uppercase; }
.about-profile-heading h1, .about-profile-heading h2, .practice-intro h2, .about-close h2 { margin: 0; font: 400 clamp(2.1rem, 3.5vw, 3.65rem)/1.06 "Selected Ampersand", "Playfair Display", Georgia, serif; letter-spacing: -.035em; }
.about-profile-copy { max-width: 850px; }
.about-lead { margin: 0 0 2.4rem; font: 400 clamp(1.35rem, 2.25vw, 2.25rem)/1.35 "Selected Ampersand", "Playfair Display", Georgia, serif; letter-spacing: -.018em; }
.about-copy-columns { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.8rem, 4vw, 4rem); color: rgba(56, 52, 44, .7); font-size: .95rem; line-height: 1.8; }
.about-copy-columns p { margin: 0; }
.about-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin: 3.4rem 0 0; }
.about-facts dt { margin: 0 0 .55rem; color: rgba(56, 52, 44, .46); font-size: .61rem; letter-spacing: .13em; text-transform: uppercase; }
.about-facts dd { margin: 0; font: 400 .96rem/1.4 "Selected Ampersand", "Playfair Display", Georgia, serif; }

.about-practice {
  display: grid;
  min-height: 92svh;
  align-content: center;
  grid-template-columns: minmax(250px, .72fr) minmax(0, 1.55fr);
  gap: clamp(3rem, 8vw, 9rem);
  padding: clamp(6.5rem, 10vw, 9rem) var(--pad);
  background: #ece6da url("assets/about/paper-fibre.svg") center / 320px 320px;
}

.practice-intro h2 { font-size: clamp(2rem, 3.2vw, 3.35rem); }
.practice-intro > p:last-child { max-width: 420px; margin: 1.6rem 0 0; color: rgba(56, 52, 44, .62); line-height: 1.75; }
.practice-list { display: grid; gap: .65rem; }
.practice-list a { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(210px, .65fr); align-items: center; gap: 2rem; min-height: clamp(5.4rem, 9vh, 7.5rem); padding: 1.4rem clamp(1.2rem, 2vw, 2rem); background: rgba(255, 253, 248, .34); transition: background .3s, transform .3s, box-shadow .3s; }
.practice-list a:hover, .practice-list a:focus-visible { background: rgba(255, 253, 248, .72); box-shadow: 0 14px 30px rgba(71, 55, 37, .07); transform: translateX(.4rem); }
.practice-list span { font: 400 clamp(1.4rem, 2.5vw, 2.65rem)/1.05 "Selected Ampersand", "Playfair Display", Georgia, serif; letter-spacing: -.025em; }
.practice-list small { color: rgba(56, 52, 44, .53); font-size: .7rem; letter-spacing: .04em; line-height: 1.5; }

.about-close { display: grid; min-height: 58svh; place-content: center; padding: clamp(5rem, 8vw, 7rem) var(--pad); color: #f7f1e8; background: #27352a; text-align: center; }
.about-close > p { margin: 0 0 1.4rem; color: rgba(247, 241, 232, .65); font-size: .73rem; letter-spacing: .08em; }
.about-close h2 { max-width: 850px; font-size: clamp(2rem, 3.5vw, 3.45rem); }
.about-close-links { display: flex; align-items: center; justify-content: center; gap: 2rem; margin-top: 2.5rem; }
.button-link { display: inline-flex; align-items: center; justify-content: center; min-height: 3.1rem; padding: .85rem 1.45rem; border: 1px solid currentColor; font-size: .67rem; letter-spacing: .12em; text-transform: uppercase; transition: color .3s, background .3s; }
.about-close .button-link { color: #27352a; background: #f7f1e8; }
.about-close .button-link:hover { color: #f7f1e8; background: transparent; }
.about-close-links > a:last-child { padding: .7rem 0; border-bottom: 1px solid rgba(247, 241, 232, .45); font-size: .68rem; letter-spacing: .08em; }

@media (max-width: 980px) {
  .about-profile, .about-practice { grid-template-columns: 1fr; align-content: center; gap: 3rem; }
  .about-profile-heading, .practice-intro { max-width: 650px; }
  .about-profile-heading h2 { max-width: 560px; }
}

@media (max-width: 760px) {
  .about-portfolio-journal { --journal-book-width: calc(100vw - 4.25rem); min-height: 58svh; justify-content: flex-start; padding-top: 6.5rem; padding-right: .45rem; padding-left: .45rem; }
  .about-journal-heading { width: calc(100% - 2rem); margin-bottom: 1.6rem; }
  .about-journal-heading h1 { font-size: 1.35rem; }
  .about-journal-heading p { max-width: 47%; text-align: right; line-height: 1.4; }
  .home-journal-stage { grid-template-columns: 1.6rem minmax(0, 1fr) 1.6rem; width: 100%; }
  .home-journal-book-frame, .home-journal-floating-controls { width: var(--journal-book-width); }
  .home-journal-book-frame { aspect-ratio: 1.72; }
  .home-journal-book-frame::before { inset: .32rem -.18rem -.55rem; border-radius: 9px 9px 12px 12px; }
  .home-journal-book-frame::after { bottom: -.34rem; height: .4rem; }
  .home-journal-page-left { border-radius: 8px 1px 1px 8px; }
  .home-journal-page-right { border-radius: 1px 8px 8px 1px; }
  .home-journal-photo-wide { top: 9%; bottom: 9%; left: 4%; width: 68%; }
  .home-journal-photo-left, .home-journal-photo-right { top: 9%; width: 36%; height: 65%; }
  .home-journal-spread-pair .home-journal-photo-left,
  .home-journal-spread-pair .home-journal-photo-right { height: 58%; }
  .home-journal-photo-left { left: 6.5%; }
  .home-journal-photo-right { right: 6.5%; }
  .home-journal-page-copy { top: 13%; right: 4%; width: 21%; }
  .home-journal-page-copy p { font-size: clamp(.43rem, 2vw, .62rem); }
  .home-journal-page-copy h2 { font-size: clamp(.58rem, 3vw, .88rem); }
  .home-journal-page-copy a { margin-top: .25rem; font-size: clamp(.42rem, 1.8vw, .58rem); }
  .home-journal-spread-pair .home-journal-page-copy { right: 23%; bottom: 4%; width: 27%; }
  .home-journal-corsage { right: 5%; bottom: 15%; width: 12%; min-width: 42px; }
  .home-journal-spread:nth-child(2) .home-journal-corsage { bottom: 3%; }
  .home-journal-arrow { width: 1.25rem; }
  .home-journal-arrow svg { stroke-width: 2.8; }
  .home-journal-floating-controls { margin-top: .45rem; }
  .home-journal-floating-controls button { width: 1.45rem; }
  .home-journal-index { justify-content: flex-start; width: calc(100% - 2rem); gap: 1.6rem; margin-top: .25rem; overflow-x: auto; scrollbar-width: none; }
  .home-journal-index::-webkit-scrollbar { display: none; }
  .home-journal-index button { flex: 0 0 auto; font-size: .78rem; }
  .about-profile, .about-practice { min-height: auto; padding-top: 6rem; padding-bottom: 6rem; }
  .about-profile-heading h1, .about-profile-heading h2, .practice-intro h2 { font-size: clamp(2.1rem, 10vw, 3.1rem); }
  .about-lead { font-size: 1.35rem; }
  .about-copy-columns, .about-facts { grid-template-columns: 1fr; }
  .about-copy-columns { gap: 1.25rem; }
  .about-facts { gap: 1.2rem; margin-top: 2.6rem; }
  .practice-list a { grid-template-columns: 1fr; gap: .65rem; min-height: 0; padding: 1.35rem 1rem; }
  .practice-list span { font-size: clamp(1.45rem, 7vw, 2rem); }
  .about-close { min-height: 54svh; }
  .about-close-links { flex-direction: column; gap: 1.1rem; }
}

@media (prefers-reduced-motion: reduce) {
  .home-journal-book, .home-journal-spread { transition: none; }
  .home-journal-book::after { display: none; }
}

/* Soft paper renderer. Printed content is part of the moving sheet itself. */
[data-journal-engine] .home-journal-book-frame {
  width: calc(var(--journal-book-width) * var(--book-zoom));
  transform: none;
}
[data-journal-engine] .home-journal-book {
  transform: none;
  filter: none;
  transition: none;
  will-change: auto;
}
[data-journal-engine] .home-journal-book::before,
[data-journal-engine] .home-journal-book::after { display: none; }
[data-journal-engine] .stf__parent { min-width: 0 !important; }
[data-journal-engine] .stf__wrapper { padding-bottom: 0 !important; width: 100%; height: 100%; }
[data-journal-engine] .stf__block { width: 100%; height: 100%; }
.journal-leaf {
  overflow: hidden;
  background: #faf7f0 url("assets/about/book-paper-natural.webp") center / 720px 720px;
}
.journal-leaf-left { border-radius: 18px 0 0 18px; }
.journal-leaf-right { border-radius: 0 18px 18px 0; }
.journal-leaf::after {
  position: absolute;
  z-index: 25;
  inset: 0;
  content: "";
  pointer-events: none;
  box-shadow: inset 0 1px 0 #ffffffa6, inset 0 -1px 0 #5c483315;
}
.journal-leaf-left::after {
  background: linear-gradient(90deg, transparent 86%, #4d38250a 94%, #3828192e 100%);
}
.journal-leaf-right::after {
  background: linear-gradient(90deg, #38281926, #4d382509 6%, transparent 14%);
}
[data-journal-engine] .journal-print {
  inset: 0 auto 0 0;
  width: 200%;
  height: 100%;
  opacity: 1;
  transform: none;
  transform-style: flat;
  transition: none;
  pointer-events: auto;
}
.journal-leaf-right .journal-print { left: -100%; }
[data-journal-engine] .home-journal-page { transform: none; }
[data-journal-engine] .home-journal-photo { transform: none; }
[data-journal-engine] .home-journal-photo-wide::before { display: none; }
.journal-print[data-composition="1"] .home-journal-corsage { right: 6%; bottom: 3%; width: 9.5%; transform: rotate(-8deg); }
.journal-print[data-composition="2"] .home-journal-corsage { right: 8%; bottom: 16%; transform: rotate(4deg); }
.journal-print[data-composition="3"] .home-journal-corsage { right: 6%; bottom: 17%; transform: rotate(-5deg); }
.journal-print[data-composition="4"] .home-journal-corsage { right: 8%; bottom: 15%; transform: rotate(9deg); }
.home-journal-arrow:disabled { opacity: .18; cursor: default; transform: none; }
.journal-reading-bar {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  width: var(--journal-book-width);
  margin: 1.25rem auto .65rem;
  color: #746c60;
  font-size: .66rem;
  letter-spacing: .045em;
}
.journal-reading-bar p { margin: 0; }
.journal-gesture-hint { font-style: italic; }
@media (max-width: 760px) {
  .journal-reading-bar { flex-direction: column; gap: .45rem; margin-top: 1rem; font-size: .6rem; }
  .journal-leaf-left { border-radius: 8px 0 0 8px; }
  .journal-leaf-right { border-radius: 0 8px 8px 0; }
}
@media (prefers-reduced-motion: reduce) {
  [data-journal-engine] .home-journal-book-frame { transition: none; }
  .journal-gesture-hint { display: none; }
}
[data-journal-engine] .home-journal-book.stf__parent {
  position: absolute;
  width: 100%;
  height: 100%;
}

@media (max-width: 760px) {
  [data-journal-engine] .home-journal-book-frame { aspect-ratio: 2.08; }
}

/* Letterpress handwriting: a dark ink face, a recessed edge and paper highlight. */
@font-face {
  font-family: "Notebook Hand";
  src: url("assets/about/nothing-you-could-do.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
.about-portfolio-journal { --journal-hand: "Selected Ampersand", "Notebook Hand", "Segoe Print", cursive; }
.home-journal-corsage { display: none; }
.home-journal-photo-wide {
  top: 20%; bottom: 20%; left: 5.5%; width: 39%;
}
.home-journal-photo-wide::before { display: none; }
.home-journal-page-copy {
  top: 32%; right: 7%; width: 33%;
  transform: rotate(-1deg);
  color: #5e4c3c;
  text-shadow:
    -.8px -1px .35px rgba(43, 28, 16, .72),
    .7px 1.1px .3px rgba(255, 255, 250, .98),
    1.2px 1.8px .6px rgba(255, 247, 225, .85);
  -webkit-text-stroke: .18px rgba(72, 49, 29, .42);
}
.home-journal-page-copy p {
  margin-bottom: 1.1rem;
  font: 400 clamp(.7rem, 1.02vw, 1rem)/1.5 var(--journal-hand);
  color: #82725f;
}
.home-journal-page-copy h2 {
  font: 400 clamp(1.1rem, 1.8vw, 1.9rem)/1.65 var(--journal-hand);
  letter-spacing: -.035em;
}
.home-journal-page-copy a {
  margin-top: 1.6rem;
  font: 400 clamp(.7rem, .95vw, .95rem)/1.5 var(--journal-hand);
  color: #796957;
}
.home-journal-spread-pair .home-journal-page-copy {
  top: auto; right: 7%; bottom: 6%; width: 35%;
}
.home-journal-spread-pair .home-journal-page-copy p { display: none; }
.home-journal-spread-pair .home-journal-page-copy h2 {
  font-size: clamp(.85rem, 1.25vw, 1.3rem); line-height: 1.5;
}
.home-journal-photo {
  isolation: isolate;
  mix-blend-mode: multiply;
  box-shadow: none;
  border: 0;
}
.home-journal-photo img {
  filter: saturate(.82) contrast(.96) brightness(1.035);
  mix-blend-mode: multiply;
}
.home-journal-photo::after {
  background-image: url("assets/about/book-paper-natural.webp"), url("assets/about/paper-fibre.svg");
  background-size: 420px 420px, 180px 180px;
  opacity: .22;
  mix-blend-mode: multiply;
}
.home-journal-floating-controls .journal-playback {
  margin-right: .45rem;
  font-size: .75rem;
}
@media (max-width: 760px) {
  .home-journal-photo-wide { top: 20%; bottom: 20%; left: 5.5%; width: 39%; }
  .home-journal-page-copy { top: 25%; right: 6%; width: 35%; }
  .home-journal-page-copy p { margin-bottom: .45rem; font-size: clamp(.42rem, 1.8vw, .65rem); }
  .home-journal-page-copy h2 { font-size: clamp(.58rem, 2.35vw, .95rem); line-height: 1.6; }
  .home-journal-page-copy a { margin-top: .6rem; font-size: clamp(.4rem, 1.7vw, .6rem); }
  .home-journal-spread-pair .home-journal-page-copy { right: 6%; bottom: 5%; width: 35%; }
  .home-journal-spread-pair .home-journal-page-copy h2 { font-size: clamp(.48rem, 1.9vw, .7rem); }
}

/* Warm directional light follows the actual soft-page fold, including hover. */
.journal-print::after {
  position: absolute;
  z-index: 24;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(var(--paper-light-angle, 110deg),
      rgba(41, 28, 16, .3), transparent 28%,
      rgba(255, 255, 248, .46) var(--paper-light-position, 50%),
      rgba(255, 252, 234, .1) 65%, rgba(55, 37, 21, .23)),
    linear-gradient(180deg, rgba(255, 255, 248, .12), transparent 40%, rgba(50, 32, 17, .16));
}
.is-lifted .journal-print::after { opacity: var(--paper-lift, 0); }
.journal-leaf.is-lifted {
  filter: drop-shadow(5px 12px 9px rgba(43, 28, 15, .23));
}
.journal-leaf.is-lifted .journal-print {
  box-shadow: inset 0 1.5px rgba(255, 255, 250, .88), inset 0 -1.5px rgba(65, 44, 25, .22);
}
[data-journal-engine] .stf__outerShadow { filter: blur(1.8px); }
[data-journal-engine] .stf__innerShadow { mix-blend-mode: multiply; }
@media (max-width: 760px) {
  .home-journal-page-copy {
    -webkit-text-stroke: .1px rgba(72, 49, 29, .35);
    text-shadow: -.45px -.55px .25px #3020109c, .5px .8px .25px #fffdf4;
  }
}

/* The personal introduction now opens the About page beneath the fixed header. */
.about-page main > .about-profile:first-child {
  min-height: 100svh;
  padding-top: clamp(8rem, 12vw, 11rem);
}

/* Personal work: a quiet contact sheet, ready for the owner's photographs. */
.about-page.page-density .about-personal-work{padding:var(--section-space) var(--pad);background:#f5f1e8 url("assets/about/paper-fibre.svg") center/320px 320px}
.personal-work-heading{display:grid;grid-template-columns:1fr minmax(260px,.8fr);align-items:end;gap:2rem;padding-top:1.6rem;border-top:1px solid #b5aa9666;margin-bottom:2rem}
.personal-work-heading h2{margin:0;font:400 var(--section-title)/1.12 "Selected Ampersand","Playfair Display",Georgia,serif;letter-spacing:-.035em}
.personal-work-intro{max-width:29rem;margin:0;color:var(--about-body-colour,#5e574c);font:400 1rem/1.8 var(--sans)}
.personal-work-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(1rem,2.3vw,2.5rem);align-items:start}
.personal-work-slot{position:relative;min-width:0;overflow:hidden;border:1px solid #c4b9a64d;background:linear-gradient(125deg,#e8e2d7,#e0d8ca);isolation:isolate}
.personal-work-slot::after{content:"";position:absolute;inset:9px;border:1px solid #f5efe455;pointer-events:none}
.personal-work-slot>span{position:absolute;left:1rem;bottom:.85rem;color:#8e8271;font:400 .58rem var(--sans);letter-spacing:.14em}
.personal-work-landscape{grid-column:1/7;aspect-ratio:3/2}
.personal-work-portrait{grid-column:7/10;aspect-ratio:3/4}
.personal-work-square{grid-column:10/13;aspect-ratio:1;margin-top:clamp(1.5rem,4vw,4rem)}
.personal-work-slot img{display:block;width:100%;height:100%;object-fit:contain}
.personal-work-slot button{display:block;width:100%;height:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
.personal-work-slot button:focus-visible{outline:2px solid #876d4d;outline-offset:-4px}
.personal-work-footnote{display:flex;justify-content:space-between;gap:1rem;padding-top:1rem;margin-top:1.3rem;border-top:1px solid #b5aa9640;color:#827563;font:400 .7rem/1.6 var(--sans)}
.personal-work-note{margin:0}
@media(max-width:760px){.personal-work-heading{grid-template-columns:1fr;gap:1rem;margin-bottom:1.5rem;padding-top:1.2rem}.personal-work-intro{font-size:1rem}.personal-work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.personal-work-landscape{grid-column:1/-1}.personal-work-portrait{grid-column:1}.personal-work-square{grid-column:2;margin-top:2rem}.personal-work-footnote{flex-direction:column;gap:.25rem}}