/* Approved 578c160: cascade order is intentional. */
@font-face {
  font-family:Switzer;
  src:url('images/switzer-regular.woff2') format('woff2');
  font-weight:400;
  font-display:swap}

@font-face {
  font-family:Switzer;
  src:url('images/switzer-italic.woff2') format('woff2');
  font-weight:400;
  font-style:italic;
  font-display:swap}

:root:where(:has(body.lucrezia-approved)) {
  --ink:#493450;
  --lilac:#dfd0ec;
  --cream:#f8f4e9;
  --apricot:#efba93;
  --plum:var(--ink);
  --gutter:clamp(22px,4.2vw,72px);
  --scene:100vh;
  --line:rgba(73,52,80,.3)}
@supports(height:100svh) {
  :root:where(:has(body.lucrezia-approved)) { --scene:100svh; }
}

:where(#approved-main), :where(#approved-main) * {
  box-sizing:border-box}
html:where(:has(body.lucrezia-approved)) {
  scroll-padding-top:24px;
  scrollbar-color:var(--ink) var(--lilac)}
body:where(.lucrezia-approved) {
  margin:0;
  color:var(--ink);
  background:var(--cream);
  font:400 17px/1.55 Switzer,Arial,sans-serif}
:where(#approved-main) ::selection {
  background:var(--ink);
  color:var(--cream)}
:where(#approved-main) a {
  color:inherit;
  text-decoration:none}
:where(#approved-main) button {
  font:inherit;
  color:inherit;
  cursor:pointer}
:where(#approved-main) a, :where(#approved-main) button, :where(#approved-main) summary {
  -webkit-tap-highlight-color:transparent}
:where(#approved-main) a:focus-visible, :where(#approved-main) button:focus-visible, :where(#approved-main) summary:focus-visible {
  outline:2px solid currentColor;
  outline-offset:6px}
:where(#approved-main) h1, :where(#approved-main) h2, :where(#approved-main) h3, :where(#approved-main) p {
  margin:0}
:where(#approved-main) h1, :where(#approved-main) h2, :where(#approved-main) h3 {
  font-weight:400}
:where(#approved-main) h1, :where(#approved-main) h2 {
  letter-spacing:-.04em;
  line-height:.98}
:where(#approved-main) img {
  display:block;
  max-width:100%}
:where(#approved-main) p {
  max-width:65ch}
:where(#approved-main) button {
  border:0}
:where(#approved-main) a, :where(#approved-main) summary, :where(#approved-main) button {
  touch-action:manipulation}
:where(#approved-main) section {
  scroll-margin-top:20px}

:where(#approved-main) .hero {
  background:var(--lilac);
  position:relative}
:where(#approved-main) .hero-stage {
  height:var(--scene);
  min-height:700px;
  position:relative;
  overflow:hidden;
  isolation:isolate}
:where(#approved-main) .camera {
  position:absolute;
  width:1200px;
  height:800px;
  left:74%;
  top:66%;
  transform:translate(-50%,-50%) rotate(-14deg);
  z-index:-1;
  pointer-events:none}
:where(#approved-main) .plate {
  width:100%;
  height:100%;
  object-fit:contain}
:where(#approved-main) .hero-intro {
  position:absolute;
  top:clamp(140px,18vh,190px);
  left:var(--gutter);
  width:55%}
:where(#approved-main) h1 {
  font-size:clamp(66px,7.5vw,116px);
  max-width:8.7em}
:where(#approved-main) .intro-bottom {
  display:flex;
  gap:clamp(40px,5vw,100px);
  align-items:center;
  margin-top:38px}
:where(#approved-main) .intro-bottom p {
  font-size:17px;
  line-height:1.5}
:where(#approved-main) .round-link {
  width:112px;
  height:112px;
  border:1px solid var(--ink);
  border-radius:50%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  font-size:14px;
  line-height:1.2;
  text-align:center;
  transition:color .2s,background .2s}
:where(#approved-main) .round-link:hover {
  background:var(--ink);
  color:var(--cream)}
:where(#approved-main) .arrow {
  font-size:25px;
  margin-top:7px}
:where(#approved-main) .hero-foot {
  position:absolute;
  bottom:26px;
  left:var(--gutter);
  right:var(--gutter);
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  font-size:12px;
  line-height:1.4}
:where(#approved-main) .hero-foot p {
  letter-spacing:.02em}
:where(#approved-main) .skip-story {
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:0;
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  padding:0;
  border-radius:0 24px 0 24px;
  color:var(--cream);
  background:var(--ink);
  border:1px solid var(--ink)}
:where(#approved-main) .skip-story svg {
  display:block;
  width:28px;
  height:36px}
:where(#approved-main) .skip-story:hover {color:var(--cream)}
:where(#approved-main) .skip-story:focus-visible {
  outline-color:var(--ink);
  outline-offset:5px}
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  body:not(.motion-reduced) :where(#approved-main) .skip-story svg {transition:transform .2s ease-out}
  body:not(.motion-reduced) :where(#approved-main) .skip-story:hover svg {transform:translateY(3px)}
}
:where(#approved-main) .scroll-note span {
  margin-left:15px}
:where(#approved-main) .hero-story {
  display:none}
.motion-on :where(#approved-main) .hero-story {
  display:block}
:where(#approved-main) .shot {
  position:absolute;
  left:var(--gutter);
  top:30%;
  font-size:clamp(64px,8vw,122px);
  line-height:1;
  letter-spacing:-.04em;
  opacity:0}
:where(#approved-main) .shot span {
  color:#795485}
:where(#approved-main) .shot-two {
  left:auto;
  right:var(--gutter);
  text-align:right;
  top:34%}
:where(#approved-main) .shot-three {
  top:33%}
:where(#approved-main) .scene-progress {
  position:absolute;
  left:0;
  bottom:0;
  height:2px;
  width:100%;
  transform:scaleX(0);
  transform-origin:left;
  background:var(--ink)}

:where(#approved-main) .about {
  position:relative;
  z-index:3;
  background:var(--cream);
  display:grid;
  grid-template-columns:1fr 1fr;
  padding:90px var(--gutter) 120px;
  gap:clamp(45px,8vw,140px);
  align-items:center}
.motion-on :where(#approved-main) .about {
  margin-top:calc(-1 * var(--scene))}
:where(#approved-main) .portrait-wrap {
  position:relative;
  max-width:570px}
:where(#approved-main) .portrait {
  width:100%;
  aspect-ratio: .79;
  object-fit:cover;
  object-position:50% 48%}
:where(#approved-main) .photo-caption {
  font-size:12px;
  margin-top:15px}
:where(#approved-main) .about-copy h2 {
  font-size:clamp(62px,7.4vw,106px);
  margin-bottom:42px}
:where(#approved-main) .about-copy .lead {
  font-size:clamp(21px,2vw,29px);
  line-height:1.3;
  margin-bottom:28px;
  letter-spacing:-.02em}
:where(#approved-main) .about-copy>p:not(.lead) {
  margin-top:18px;
  max-width:40ch;
  font-size:17px}
:where(#approved-main) .text-link {
  display:inline-flex;
  gap:35px;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid currentColor;
  padding:14px 0 10px;
  margin-top:24px;
  font-size:16px}
:where(#approved-main) .text-link span {
  font-size:25px;
  line-height:1;
  transition:transform .25s}
:where(#approved-main) .text-link:hover span {
  transform:translate(3px,-3px)}

:where(#approved-main) .approach {
  background:var(--plum);
  color:var(--cream);
  padding:110px var(--gutter) 90px}
:where(#approved-main) .approach-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:40px;
  margin-bottom:85px}
:where(#approved-main) .approach h2 {
  font-size:clamp(64px,8vw,116px)}
:where(#approved-main) .approach h2 span {
  color:#d5bbdf}
:where(#approved-main) .approach-heading>p {
  max-width:25ch;
  margin:0 4vw 8px 0;
  font-size:18px}
:where(#approved-main) .principles {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:50px}
:where(#approved-main) .principles article {
  border-top:1px solid #a895ad;
  padding-top:24px}
:where(#approved-main) .principles h3 {
  font-size:25px;
  letter-spacing:-.025em;
  line-height:1.2;
  margin-bottom:22px}
:where(#approved-main) .principles p {
  font-size:16px;
  line-height:1.6;
  max-width:36ch;
  color:#e3d9e5}
:where(#approved-main) details {
  border-bottom:1px solid var(--line)}
:where(#approved-main) summary {
  cursor:pointer;
  list-style:none;
  display:flex;
  justify-content:space-between;
  gap:25px;
  align-items:center;
  padding:30px 0;
  font-size:clamp(30px,4vw,57px);
  line-height:1.04;
  letter-spacing:-.035em}
:where(#approved-main) summary::-webkit-details-marker {
  display:none}
:where(#approved-main) dl {
  margin:0}
:where(#approved-main) dl>div {
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-top:1px solid var(--line);
  padding:18px 0}
:where(#approved-main) dt {
  font-size:17px}
:where(#approved-main) dd {
  font-size:58px;
  letter-spacing:-.04em;
  line-height:1;
  margin:0}
:where(#approved-main) dd span {
  font-size:30px;
  margin-left:5px}

:where(#approved-main) .contact {
  padding:65px var(--gutter) 75px;
  background:var(--lilac)}
:where(#approved-main) .contact-top {
  display:flex;
  justify-content:space-between;
  align-items:start;
  font-size:16px;
  margin-bottom:55px}
:where(#approved-main) .contact h2 {
  font-size:clamp(85px,13.5vw,195px);
  line-height:.91;
  max-width:9ch}
:where(#approved-main) .contact-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:35px;
  margin-top:60px}
:where(#approved-main) .contact-action {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:80px;
  border-bottom:1px solid;
  font-size:40px;
  letter-spacing:-.035em;
  padding-bottom:10px;
  min-width:230px}
:where(#approved-main) .contact-action span {
  transition:transform .25s}
:where(#approved-main) .contact-action:hover span {
  transform:translate(4px,-4px)}
:where(#approved-main) .contact-bottom p {
  font-size:15px}
:where(#approved-main) .email {
  font-size:14px;
  border-bottom:1px solid;
  padding:10px 0}
:where(#approved-main) .footer-name {
  font-size:24px;
  line-height:1.1;
  letter-spacing:-.03em}
:where(#approved-main) .footer-name span {
  display:block;
  font-size:13px;
  margin-top:7px;
  letter-spacing:0}
html:where(:has(body.lucrezia-approved)).lenis.lenis-smooth {
  scroll-behavior:auto!important}
html:where(:has(body.lucrezia-approved)).lenis.lenis-stopped {
  overflow:hidden}

@media(min-width:1600px) {
  :where(#approved-main) .camera {
  width:1500px;
  height:1000px}
:where(#approved-main) .hero-intro {
  top:19vh}
}

@media(max-width:1000px) and (min-width:701px) {
:where(#approved-main) .hero-intro {
  width:65%}
:where(#approved-main) .camera {
  left:85%;
  width:1000px;
  height:667px}
:where(#approved-main) .hero-stage {
  min-height:740px}
:where(#approved-main) .about {
  gap:45px;
  padding-top:70px}
:where(#approved-main) .about-copy h2 {
  font-size:70px}
:where(#approved-main) .principles {
  gap:28px}
:where(#approved-main) .contact-bottom {
  flex-wrap:wrap}
:where(#approved-main) .contact-bottom .email {
  margin-left:auto}
}

@media(max-width:700px) {
  :root:where(:has(body.lucrezia-approved)) {
  --gutter:22px}
:where(#approved-main) .hero-stage {
  min-height:600px;
  height:var(--scene)}
:where(#approved-main) .hero-intro {
  top:114px;
  width:calc(100% - 44px)}
:where(#approved-main) h1 {
  font-size:clamp(49px,12vw,76px);
  line-height:1.01;
  max-width:9em}
:where(#approved-main) .intro-bottom {
  margin-top:25px;
  gap:20px;
  justify-content:space-between;
  align-items:center}
:where(#approved-main) .intro-bottom p {
  font-size:14px;
  line-height:1.5}
:where(#approved-main) .round-link {
  width:85px;
  height:85px;
  font-size:12px;
  flex-shrink:0}
:where(#approved-main) .round-link .arrow {
  font-size:22px;
  margin-top:3px}
:where(#approved-main) .camera {
  width:750px;
  height:500px;
  left:69%;
  top:80%;
  transform:translate(-50%,-50%) rotate(-14deg)}
:where(#approved-main) .hero-foot {
  bottom:20px;
  align-items:center}
:where(#approved-main) .hero-foot>p, :where(#approved-main) .scroll-note {
  display:none}
:where(#approved-main) .skip-story {
  width:56px;
  height:56px;
  border-radius:0 20px 0 20px}
:where(#approved-main) .shot {
  font-size:clamp(50px,13vw,80px);
  top:22%;
  left:22px}
:where(#approved-main) .shot-two {
  left:auto;
  right:22px;
  top:23%}
:where(#approved-main) .shot-three {
  top:22%}
:where(#approved-main) .about {
  padding:28px 22px 70px;
  display:block}
:where(#approved-main) .portrait-wrap {
  width:85%;
  margin:0 0 34px}
:where(#approved-main) .portrait {
  aspect-ratio:.88;
  object-position:center 44%}
:where(#approved-main) .photo-caption {
  font-size:11px;
  margin-top:10px}
:where(#approved-main) .about-copy {
  margin-left:0}
:where(#approved-main) .about-copy h2 {
  font-size:69px;
  margin-bottom:28px}
:where(#approved-main) .about-copy .lead {
  font-size:23px}
:where(#approved-main) .about-copy>p:not(.lead) {
  font-size:16px}
:where(#approved-main) .desktop-break {
  display:none}
:where(#approved-main) .text-link {
  font-size:15px;
  margin-top:20px}
:where(#approved-main) .approach {
  padding:65px 22px}
:where(#approved-main) .approach-heading {
  display:block;
  margin-bottom:42px}
:where(#approved-main) .approach h2 {
  font-size:clamp(52px,13vw,80px);
  line-height:1.02}
:where(#approved-main) .approach-heading>p {
  font-size:16px;
  line-height:1.5;
  margin-top:28px;
  max-width:100%}
:where(#approved-main) .approach-heading>p br {
  display:none}
:where(#approved-main) .principles {
  display:block}
:where(#approved-main) .principles article {
  padding:23px 0 28px}
:where(#approved-main) .principles article:last-child {
  padding-bottom:0}
:where(#approved-main) .principles h3 {
  font-size:25px;
  margin-bottom:13px}
:where(#approved-main) .principles p {
  font-size:15px;
  max-width:42ch}
:where(#approved-main) summary {
  font-size:31px;
  line-height:1.08;
  padding:27px 0;
  gap:10px}
:where(#approved-main) .contact {
  padding:40px 22px 55px}
:where(#approved-main) .contact-top {
  font-size:13px;
  margin-bottom:45px;
  gap:20px}
:where(#approved-main) .contact-top>p:last-child {
  font-size:11px;
  text-align:right;
  max-width:60px}
:where(#approved-main) .contact h2 {
  font-size:clamp(66px,17vw,113px);
  line-height:.94}
:where(#approved-main) .contact-bottom {
  display:block;
  margin-top:40px}
:where(#approved-main) .contact-action {
  font-size:33px;
  width:100%;
  padding-bottom:15px}
:where(#approved-main) .contact-bottom p {
  margin:24px 0 20px;
  font-size:14px}
:where(#approved-main) .email {
  display:inline-block;
  font-size:13px}
:where(#approved-main) .footer-name {
  font-size:23px;
  width:100%}
}

@media(max-width:700px) and (max-height:700px) {
  :where(#approved-main) .hero-stage {
  min-height:570px}
:where(#approved-main) .hero-intro {
  top:101px}
:where(#approved-main) h1 {
  font-size:clamp(45px,12vw,64px)}
:where(#approved-main) .intro-bottom {
  margin-top:20px}
:where(#approved-main) .camera {
  width:650px;
  height:434px;
  top:84%;
  left:73%}
:where(#approved-main) .round-link {
  width:78px;
  height:78px}
:where(#approved-main) .hero-foot {
  bottom:15px}
}

/* A phone scene follows the available viewport, including Safari's bars.
   Keep the original static composition when motion is unavailable. */
@media(max-width:700px) {
  body.motion-available :where(#approved-main) .hero-stage { min-height:0; }
}
@media(max-width:700px) and (max-height:600px) {
  body.motion-available :where(#approved-main) .hero-intro { top:96px; }
  body.motion-available :where(#approved-main) .hero-intro h1 { font-size:clamp(36px,10.5vw,52px); }
  body.motion-available :where(#approved-main) .intro-bottom { margin-top:14px; gap:12px; }
  body.motion-available :where(#approved-main) .round-link { width:72px; height:72px; }
  body.motion-available :where(#approved-main) .camera { width:560px; height:374px; top:86%; }
  body.motion-available :where(#approved-main) .shot { font-size:clamp(40px,12vw,64px); }
}
/* Short landscape screens use the width for copy, leaving room for the photo. */
@media(min-width:500px) and (max-width:1000px) and (max-height:500px) {
  body.motion-available :where(#approved-main) .hero-stage { min-height:0; }
  body.motion-available :where(#approved-main) .hero-intro { top:94px; width:calc(100% - 2 * var(--gutter)); display:flex; align-items:center; gap:24px; }
  body.motion-available :where(#approved-main) .hero-intro h1 { font-size:clamp(30px,5.4vw,44px); flex-shrink:0; }
  body.motion-available :where(#approved-main) .intro-bottom { margin-top:0; gap:14px; }
  body.motion-available :where(#approved-main) .intro-bottom p { font-size:14px; }
  body.motion-available :where(#approved-main) .round-link { width:72px; height:72px; font-size:12px; flex-shrink:0; }
  body.motion-available :where(#approved-main) .camera { width:560px; height:374px; left:78%; top:100%; }
  body.motion-available :where(#approved-main) .shot { font-size:clamp(38px,7vw,64px); top:28%; }
  body.motion-available :where(#approved-main) .hero-foot>p, body.motion-available :where(#approved-main) .scroll-note { display:none; }
  body.motion-available :where(#approved-main) .hero-foot { bottom:15px; }
  body.motion-available :where(#approved-main) .skip-story { width:56px; height:56px; }
}

@media(prefers-reduced-motion:reduce) {
  html:where(:has(body.lucrezia-approved)) {
  scroll-behavior:auto}
:where(#approved-main) .text-link span, :where(#approved-main) .contact-action span {
  transition:none}
}


:where(#approved-main) .icon {
  display:inline-block;
  width:1em;
  height:1em;
  vertical-align:-.12em;
  flex-shrink:0}




:where(#approved-main) .round-link {
  background:var(--lilac)}
@media(max-width:350px) {
  :where(#approved-main) h1 {
  font-size:39px}
:where(#approved-main) .camera {
  top:95%}
:where(#approved-main) .intro-bottom p {
  font-size:13px}
}

:where(#approved-main) .hero-static-story {
  padding:34px var(--gutter) 48px;
  font-size:clamp(24px,4vw,42px);
  line-height:1.3;
  max-width:none}

.motion-on :where(#approved-main) .hero-static-story {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap}


:where(#approved-main) .approach {
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:8vw;
  padding-top:100px;
  padding-bottom:100px;
  align-items:start}

:where(#approved-main) .approach-heading {
  display:block;
  margin:0}
:where(#approved-main) .approach h2 {
  font-size:clamp(58px,6vw,88px);
  line-height:1.02}
:where(#approved-main) .approach-heading>p {
  margin:35px 0 0;
  max-width:26ch;
  font-size:18px}

:where(#approved-main) .principles {
  display:block}
:where(#approved-main) .principles article {
  padding:30px 0 34px}
:where(#approved-main) .principles article:first-child {
  padding-top:24px}
:where(#approved-main) .principles article:last-child {
  padding-bottom:0}
:where(#approved-main) .principles h3 {
  font-size:15px;
  letter-spacing:0;
  margin-bottom:14px;
  color:#d5bbdf}
:where(#approved-main) .principles .principle-meaning {
  font-size:clamp(24px,2.25vw,33px);
  line-height:1.2;
  letter-spacing:-.025em;
  max-width:25ch;
  color:var(--cream);
  margin-bottom:16px}
:where(#approved-main) .principles p:not(.principle-meaning) {
  max-width:48ch}

:where(#approved-main) summary {
  display:grid;
  grid-template-columns:1.1fr .9fr 36px;
  gap:40px;
  padding:32px 0;
  font-size:clamp(30px,3.1vw,46px);
  line-height:1.08}
:where(#approved-main) dd {
  font-variant-numeric:tabular-nums}

:where(#approved-main) .contact-bottom>p {
  max-width:33ch;
  font-size:16px}

:where(#approved-main) .principles .principle-meaning {
  line-height:1.32}

@media(max-width:1100px) and (min-width:701px) {
:where(#approved-main) .approach {
  gap:6vw}
:where(#approved-main) .approach h2 {
  font-size:clamp(45px,5.7vw,64px)}
:where(#approved-main) .principles .principle-meaning {
  font-size:27px}
:where(#approved-main) summary {
  gap:25px}
}

@media(max-width:700px) {

 :where(#approved-main) .hero-static-story {
  font-size:clamp(23px,6.5vw,34px);
  padding:30px 22px 40px}

 :where(#approved-main) .approach {
  display:block;
  padding:62px 22px}
:where(#approved-main) .approach h2 {
  font-size:clamp(43px,11.7vw,72px)}
:where(#approved-main) .approach-heading>p {
  font-size:17px;
  max-width:28ch;
  margin:26px 0 35px}
:where(#approved-main) .principles article {
  padding:25px 0 29px}
:where(#approved-main) .principles h3 {
  font-size:14px;
  margin-bottom:12px}
:where(#approved-main) .principles .principle-meaning {
  font-size:27px;
  max-width:23ch}
:where(#approved-main) .principles p:not(.principle-meaning) {
  font-size:16px}

 :where(#approved-main) summary {
  grid-template-columns:minmax(0,1fr) 28px;
  gap:14px 12px;
  padding:25px 0;
  font-size:clamp(27px,7.6vw,38px)}

 :where(#approved-main) .contact h2 {
  font-size:clamp(51px,16vw,106px)}
:where(#approved-main) .contact-bottom>p {
  font-size:16px;
  max-width:33ch}
:where(#approved-main) .contact-top>p:last-child {
  font-size:12px}
:where(#approved-main) .email {
  font-size:14px}
:where(#approved-main) .photo-caption {
  font-size:12px}
:where(#approved-main) .about-copy h2 {
  font-size:clamp(53px,16vw,78px)}

}

:where(#approved-main) .about {
  --about-pad:clamp(24px,3.6svh,40px);
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:0;
  padding:var(--about-pad) var(--gutter);
  min-height:100svh;
  align-items:stretch;
  scroll-margin-top:-24px}

:where(#approved-main) .portrait-wrap {
  width:100%;
  max-width:none;
  margin:0;
  min-width:0;
  min-height:calc(100svh - var(--about-pad) * 2);
  display:grid;
  grid-template-rows:minmax(420px,1fr) auto}

:where(#approved-main) .portrait-frame {
  position:relative;
  overflow:hidden;
  min-width:0}

:where(#approved-main) .portrait {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  aspect-ratio:auto;
  object-fit:cover;
  object-position:50% 60%}

:where(#approved-main) .photo-caption {
  font-size:12px;
  line-height:1.5;
  margin:14px 0 0}

:where(#approved-main) .about-copy {
  min-width:0;
  align-self:center;
  width:calc(100% - clamp(48px,6vw,128px));
  max-width:440px;
  margin:0 auto;
  padding:32px 0;
  text-align:left}

:where(#approved-main) .about-name {
  font-style:italic;
  font-synthesis:none}

:where(#approved-main) .about-copy h2 {
  font-size:clamp(50px,min(5.5vw,9.2svh),84px);
  line-height:1.02;
  margin-bottom:clamp(24px,4svh,40px)}

:where(#approved-main) .about-copy .lead {
  font-size:clamp(21px,1.3vw,23px);
  line-height:1.45;
  max-width:34ch;
  margin:0 0 26px}

:where(#approved-main) .about-copy>p:not(.lead) {
  font-size:17px;
  line-height:1.6;
  max-width:42ch;
  margin:18px 0 0;
  text-wrap:pretty}

:where(#approved-main) .about-copy .text-link {
  margin-top:30px;
  min-height:44px}

:where(#approved-main) .email {
  display:inline-flex;
  align-items:center;
  min-height:44px}

@media(min-width:901px) and (max-height:720px) {
  
 :where(#approved-main) .about-copy {
  padding-block:0}
:where(#approved-main) .about-copy h2 {
  font-size:clamp(48px,8.5svh,60px);
  margin-bottom:18px}
:where(#approved-main) .about-copy .lead {
  font-size:21px;
  margin-bottom:16px}
:where(#approved-main) .about-copy>p:not(.lead) {
  font-size:16px;
  line-height:1.5;
  margin-top:12px}
:where(#approved-main) .about-copy .text-link {
  margin-top:14px}

}

@media(max-width:900px) {
  
 :where(#approved-main) .about {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:32px;
  min-height:0;
  padding:28px var(--gutter) 64px}

 :where(#approved-main) .portrait-wrap {
  width:100%;
  max-width:560px;
  min-height:0;
  grid-template-rows:auto auto}

 :where(#approved-main) .portrait-frame {
  aspect-ratio:4/5;
  min-height:0}

 :where(#approved-main) .portrait {
  object-position:50% 56%}

 :where(#approved-main) .photo-caption {
  margin-top:12px}

 :where(#approved-main) .about-copy {
  padding:0;
  width:100%;
  max-width:620px;
  margin:0}

 :where(#approved-main) .about-copy h2 {
  font-size:clamp(53px,13.5vw,78px);
  margin-bottom:25px}

 :where(#approved-main) .about-copy .lead {
  font-size:clamp(22px,4.8vw,27px);
  margin-bottom:22px}

 :where(#approved-main) .about-copy>p:not(.lead) {
  font-size:17px;
  line-height:1.6;
  margin-top:16px;
  max-width:46ch}

 :where(#approved-main) .about-copy .desktop-break {
  display:none}

}

:where(#approved-main) section[tabindex="-1"]:focus, :where(#approved-main) main[tabindex="-1"]:focus {
  outline:none}

:where(#approved-main) .paths-index {
  padding:clamp(64px,7vw,110px) var(--gutter) clamp(80px,9vw,140px);
  max-width:1680px;
  margin-inline:auto;
  background:var(--cream)}

:where(#approved-main) .paths-index>h2 {
  font-size:clamp(34px,3.5vw,50px);
  line-height:1.12;
  letter-spacing:-.03em;
  margin-bottom:50px;
  text-wrap:balance}

:where(#approved-main) .service-index {
  list-style:none;
  padding:0;
  margin:0;
  border-top:1px solid var(--line);
  display:grid;
  grid-auto-rows:1fr}

:where(#approved-main) .service-index>li {
  border-bottom:1px solid var(--line);
  display:grid}

:where(#approved-main) .service-row {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr) 44px;
  gap:clamp(24px,4vw,64px);
  align-items:center;
  padding:40px 0;
  isolation:isolate}

:where(#approved-main) .service-row::before {
  content:"";
  position:absolute;
  inset:0 -20px;
  background:var(--lilac);
  z-index:-1;
  transform:scaleY(0);
  transform-origin:bottom;
  transition:transform .3s cubic-bezier(.22,1,.36,1)}

:where(#approved-main) .service-row h3 {
  font-size:clamp(35px,4.1vw,64px);
  line-height:1.08;
  letter-spacing:-.035em;
  text-wrap:balance;
  max-width:22ch;
  transition:transform .3s cubic-bezier(.22,1,.36,1)}

:where(#approved-main) .service-row p {
  font-size:17px;
  line-height:1.55;
  max-width:31ch}

:where(#approved-main) .service-arrow {
  font-size:37px;
  line-height:1;
  transition:transform .3s cubic-bezier(.22,1,.36,1)}

:where(#approved-main) .service-row:focus-visible {
  outline:2px solid var(--ink);
  outline-offset:9px}

:where(#approved-main) .service-row:focus-visible::before {
  transform:scaleY(1)}

@media(hover:hover) and (pointer:fine) {
  :where(#approved-main) .service-row:hover::before {
  transform:scaleY(1)}
:where(#approved-main) .service-row:hover h3 {
  transform:translateX(7px)}
:where(#approved-main) .service-row:hover .service-arrow {
  transform:translate(4px,-4px)}
}

:where(#approved-main) .visit-pause {
  background:var(--apricot);
  padding:0 var(--gutter) 55px;
  text-align:left}

:where(#approved-main) .visit-composition {
  display:grid;
  grid-template-columns:1.12fr 1fr;
  gap:clamp(35px,6vw,100px);
  max-width:1536px;
  margin:0 auto;
  align-items:center}

:where(#approved-main) .visit-copy {
  padding:65px 0}

:where(#approved-main) .visit-pause h2 {
  font-size:clamp(54px,6.2vw,96px);
  line-height:1.02;
  letter-spacing:-.04em;
  margin:0;
  text-wrap:balance}

:where(#approved-main) .visit-pause h2 span {
  display:inline-block}

:where(#approved-main) .visit-description {
  font-size:clamp(18px,1.5vw,21px);
  line-height:1.6;
  max-width:35ch;
  margin:36px 0 0;
  text-wrap:pretty}

:where(#approved-main) .visit-photo {
  margin:-45px 0 0;
  position:relative;
  align-self:stretch;
  min-height:570px}

:where(#approved-main) .visit-photo img {
  width:100%;
  height:100%;
  position:absolute;
  inset:0;
  object-fit:cover;
  object-position:53% 50%}

:where(#approved-main) .visit-strip {
  max-width:1536px;
  margin:45px auto 0;
  border-top:1px solid var(--line);
  padding-top:25px;
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr;
  gap:30px;
  text-align:left}

:where(#approved-main) .visit-strip>div {
  display:block;
  border:0;
  padding:0;
  min-width:0}

:where(#approved-main) .visit-strip dt {
  font-size:15px;
  line-height:1.5;
  margin-bottom:9px}

:where(#approved-main) .visit-strip dd {
  font-size:27px;
  line-height:1.3;
  letter-spacing:-.02em;
  margin:0;
  font-variant-numeric:tabular-nums}

:where(#approved-main) .visit-strip dd span {
  font-size:inherit;
  margin:0}

@media(max-width:1100px) and (min-width:901px) {
  :where(#approved-main) .visit-photo {
  min-height:540px}
:where(#approved-main) .visit-pause h2 {
  font-size:clamp(49px,5.7vw,63px)}
:where(#approved-main) .service-row {
  gap:25px}
}

@media(max-width:900px) {
  
 :where(#approved-main) .visit-pause {
  padding-top:55px;
  padding-bottom:42px}
:where(#approved-main) .visit-composition {
  grid-template-columns:1fr;
  gap:35px}
:where(#approved-main) .visit-copy {
  padding:0}
:where(#approved-main) .visit-pause h2 {
  font-size:clamp(44px,8.8vw,75px)}
:where(#approved-main) .visit-description {
  max-width:43ch;
  margin-top:25px}
:where(#approved-main) .visit-photo {
  width:76%;
  margin:0 0 0 auto;
  min-height:0;
  aspect-ratio:1.25}
:where(#approved-main) .visit-photo img {
  object-position:50% 56%}
:where(#approved-main) .visit-strip {
  margin-top:35px}

}



@media(max-width:700px) {
  
 :where(#approved-main) .paths-index {
  padding:60px var(--gutter) 80px}
:where(#approved-main) .paths-index>h2 {
  font-size:clamp(33px,7.6vw,46px);
  max-width:14ch;
  margin-bottom:30px}

 :where(#approved-main) .service-row {
  grid-template-columns:minmax(0,1fr) 28px;
  gap:16px 18px;
  align-items:start;
  padding:29px 0}
:where(#approved-main) .service-row::before {
  inset:0 -10px}

 :where(#approved-main) .service-row h3 {
  grid-column:1;
  grid-row:1;
  font-size:clamp(29px,7.3vw,44px);
  line-height:1.1;
  max-width:22ch}
:where(#approved-main) .service-row p {
  grid-column:1;
  grid-row:2;
  font-size:16px;
  line-height:1.55;
  max-width:36ch}
:where(#approved-main) .service-arrow {
  grid-column:2;
  grid-row:1;
  font-size:26px;
  padding-top:3px}

 :where(#approved-main) .visit-pause {
  padding:52px var(--gutter) 40px}
:where(#approved-main) .visit-pause h2 {
  font-size:clamp(42px,10.7vw,67px)}
:where(#approved-main) .visit-description {
  font-size:18px}
:where(#approved-main) .visit-photo {
  width:100%;
  aspect-ratio:1;
  margin-top:0}
:where(#approved-main) .visit-photo img {
  object-position:50% 50%}

 :where(#approved-main) .visit-strip {
  display:block;
  margin-top:28px;
  padding-top:22px}
:where(#approved-main) .visit-strip>div {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:baseline;
  gap:18px;
  padding:8px 0}
:where(#approved-main) .visit-strip dt {
  font-size:15px;
  line-height:1.5;
  margin:0}
:where(#approved-main) .visit-strip dd {
  font-size:23px;
  line-height:1.4;
  white-space:nowrap}
:where(#approved-main) .visit-strip>div:first-child {
  display:block;
  margin-bottom:16px;
  padding-top:0}
:where(#approved-main) .visit-strip>div:first-child dt {
  margin-bottom:4px}

}

@media(prefers-reduced-motion:reduce) {
  :where(#approved-main) .service-row::before, :where(#approved-main) .service-row h3, :where(#approved-main) .service-arrow {
  transition:none}
}

:where(#approved-main) .service-row {
  height:100%}

:where(#approved-main) .visit-composition {
  grid-template-columns:1.08fr 1fr;
  gap:clamp(36px,5vw,80px);
  max-width:1440px}

:where(#approved-main) .visit-copy {
  padding:62px 0}

:where(#approved-main) .visit-pause h2 {
  font-size:clamp(52px,5.6vw,84px);
  line-height:1.06}

:where(#approved-main) .visit-description {
  max-width:41ch;
  margin-top:28px;
  font-size:clamp(18px,1.45vw,20px)}

:where(#approved-main) .visit-photo {
  min-height:0;
  width:100%;
  aspect-ratio:3/2;
  margin:-40px 0 0;
  align-self:start;
  overflow:hidden;
  border-radius:0 clamp(32px,4vw,72px) 0 clamp(32px,4vw,72px)}

:where(#approved-main) .visit-photo img {
  object-position:53% 60%}

:where(#approved-main) .visit-strip {
  max-width:1440px;
  grid-template-columns:1.08fr 1fr 1fr;
  gap:0;
  margin-top:36px;
  padding-top:30px;
  align-items:start}

:where(#approved-main) .visit-strip>div {
  padding:0 32px;
  border:0}

:where(#approved-main) .visit-strip>div:first-child {
  padding-left:0}

:where(#approved-main) .visit-strip>div+div {
  border-left:1px solid var(--line)}

:where(#approved-main) .visit-strip dt {
  font-size:16px;
  line-height:1.5;
  min-height:1.5em;
  margin-bottom:12px}

:where(#approved-main) .visit-strip dd {
  font-size:44px;
  line-height:1.15;
  letter-spacing:-.03em}

:where(#approved-main) .visit-strip dd span {
  font-size:25px;
  vertical-align:baseline;
  margin-left:2px}

:where(#approved-main) .visit-strip>div:first-child dd {
  font-size:25px;
  line-height:1.4;
  letter-spacing:-.02em}

@media(max-width:1100px) and (min-width:901px) {
  :where(#approved-main) .visit-pause h2 {
  font-size:clamp(48px,5.3vw,59px)}
:where(#approved-main) .visit-copy {
  padding:48px 0}
:where(#approved-main) .visit-strip>div {
  padding-inline:24px}
}

@media(max-width:900px) {
  :where(#approved-main) .visit-composition {
  grid-template-columns:1fr;
  gap:30px}
:where(#approved-main) .visit-copy {
  padding:0}
:where(#approved-main) .visit-pause h2 {
  font-size:clamp(44px,8.5vw,68px)}
:where(#approved-main) .visit-photo {
  width:100%;
  margin:0;
  aspect-ratio:3/2}
:where(#approved-main) .visit-description {
  max-width:43ch}
:where(#approved-main) .visit-strip {
  margin-top:32px}
}

@media(max-width:700px) {
  
 :where(#approved-main) .service-row {
  align-content:center;
  grid-template-rows:auto auto}

 :where(#approved-main) .visit-pause h2 {
  font-size:clamp(40px,10.2vw,62px)}
:where(#approved-main) .visit-description {
  font-size:17px;
  line-height:1.65;
  margin-top:24px}
:where(#approved-main) .visit-photo {
  width:100%;
  aspect-ratio:4/3;
  margin:0}
:where(#approved-main) .visit-photo img {
  object-position:53% 60%}

 :where(#approved-main) .visit-strip {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:0;
  margin-top:28px;
  padding-top:22px}

 :where(#approved-main) .visit-strip>div {
  display:block;
  padding:0;
  border:0;
  min-width:0}

 :where(#approved-main) .visit-strip>div:first-child {
  grid-column:1/-1;
  margin:0 0 23px;
  padding:0 0 22px;
  border-bottom:1px solid var(--line)}

 :where(#approved-main) .visit-strip>div+div {
  border-left:0}
:where(#approved-main) .visit-strip>div:last-child {
  padding-left:22px;
  border-left:1px solid var(--line)}

 :where(#approved-main) .visit-strip dt {
  font-size:15px;
  line-height:1.45;
  min-height:2.9em;
  margin:0 0 10px}

 :where(#approved-main) .visit-strip dd {
  font-size:40px;
  line-height:1.2;
  white-space:nowrap}
:where(#approved-main) .visit-strip dd span {
  font-size:23px}

 :where(#approved-main) .visit-strip>div:first-child dt {
  min-height:0;
  margin-bottom:5px}
:where(#approved-main) .visit-strip>div:first-child dd {
  font-size:23px}

}


/* The original contact copy occupies the full reading column. */
:where(#approved-main) .contact-top>p:only-child {font-size:18px; text-align:left; max-width:60ch; line-height:1.6}
:where(#approved-main) .contact-kicker {font-size:14px; margin-bottom:20px}

