:root {
  --renova-ground: #dff2ec;
  --renova-ink: #2f2622;
  --renova-blue: #2d5085;
  --renova-lilac: #d0c5e2;
  --renova-paper: #fafcfb;
  --renova-prose: 'Biryani', 'Trebuchet MS', sans-serif;
  --renova-display: 'DM Serif Display', Georgia, serif;
  --renova-gutter: clamp(28px, 4.86vw, 88px);
}
* { box-sizing: border-box; }
html { scroll-padding-top: 30px; }
body { margin: 0; background: var(--renova-ground); color: var(--renova-ink); font-family: var(--renova-prose); font-size: 17px; line-height: 1.85; }
body, h1, h2, h3, p, figure { margin-top: 0; }
img { display: block; max-width: 100%; }
a { color: var(--renova-blue); text-decoration-thickness: 1px; text-underline-offset: 5px; transition: text-decoration-color .18s ease, color .18s ease; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 3px solid var(--renova-blue); outline-offset: 6px; }
::selection { color: var(--renova-ink); background: var(--renova-lilac); }
h1, h2, h3 { font-family: var(--renova-display); font-weight: 400; line-height: 1.08; text-wrap: balance; }
h1 { font-size: clamp(42px, 4.7vw, 72px); letter-spacing: -.025em; }
h2 { font-size: clamp(38px, 3.5vw, 54px); letter-spacing: -.02em; }
h3 { font-size: 27px; }
p { margin-bottom: 22px; }
i[data-lucide], svg.lucide { display: inline-flex; width: 21px; height: 21px; flex: 0 0 21px; color: var(--renova-blue); vertical-align: middle; }
i[data-lucide] svg { width: 100%; height: 100%; }
.renova-skip { position: absolute; z-index: 20; left: 20px; top: -90px; padding: 10px 20px; background: var(--renova-paper); }
.renova-skip:focus { top: 12px; }
.renova-mast { position: relative; padding: 21px var(--renova-gutter) 15px; isolation: isolate; overflow: hidden; background: var(--renova-paper); }
.renova-mast::before { position: absolute; content: ''; z-index: -1; inset: 0; background: var(--renova-ground); clip-path: polygon(0 0, 25% 0, 19% 100%, 0 100%); }
.renova-mast::after { position: absolute; content: ''; z-index: -1; inset: 0; background: var(--renova-lilac); clip-path: polygon(25% 0, 29% 0, 23% 100%, 19% 100%); }
.renova-wordmark { display: block; width: max-content; color: var(--renova-ink); font: 400 108px/.9 var(--renova-display); letter-spacing: -.065em; text-decoration: none; }
.renova-wordmark span { color: var(--renova-blue); }
.renova-wordmark:hover { color: var(--renova-blue); text-decoration: none; }
.renova-editions { display: flex; align-items: center; gap: clamp(40px, 8.5vw, 145px); margin-top: 10px; }
.renova-editions a { position: relative; display: inline-flex; align-items: center; min-height: 37px; gap: 9px; color: var(--renova-ink); font-size: 16px; text-decoration: none; }
.renova-editions a::after { content: ''; position: absolute; bottom: 0; left: 29px; right: 0; height: 3px; background: var(--renova-blue); transform: scaleX(0); transform-origin: left; transition: transform .18s ease; }
.renova-editions a:hover, .renova-editions a:focus-visible { color: var(--renova-blue); }
.renova-editions a:hover::after, .renova-editions a:focus-visible::after { transform: scaleX(1); }
/* A full-width photograph, an opaque piece of ground, and a loose ceramic crop. */
.renova-opening { position: relative; isolation: isolate; min-height: 654px; padding: 35px var(--renova-gutter) 96px; background: var(--renova-ground); }
.renova-opening-copy { position: relative; z-index: 2; width: min(58%, 785px); padding: 33px 43px 30px; background: var(--renova-ground); box-shadow: -12px 12px 0 var(--renova-blue); }
.renova-opening-copy::after { content: ''; position: absolute; top: 0; right: -39px; width: 40px; height: 100%; background: var(--renova-ground); clip-path: polygon(0 0, 100% 0, 0 100%); }
.renova-opening h1 { max-width: 690px; margin-bottom: 20px; font-size: clamp(44px, 4.3vw, 67px); }
.renova-welcome { max-width: 560px; font-size: 17px; line-height: 1.7; margin-bottom: 15px; }
.renova-promise-swath { position: relative; isolation: isolate; width: calc(100% + 34px); padding: 25px 25px 27px; margin: 0 0 0 -16px; font-size: 16px; line-height: 1.65; color: var(--renova-ink); }
.renova-promise-swath::before { position: absolute; z-index: -1; content: ''; inset: 0; background: var(--renova-lilac); clip-path: polygon(1% 7%, 8% 4%, 13% 6%, 23% 2%, 36% 5%, 48% 1%, 62% 4%, 74% 0, 85% 3%, 98% 1%, 100% 18%, 99% 39%, 100% 68%, 98% 96%, 89% 98%, 76% 96%, 64% 100%, 50% 97%, 38% 99%, 24% 96%, 13% 99%, 1% 96%, 2% 77%, 0 58%, 1% 38%, 0 16%); }
.renova-opening-inlay { position: absolute; z-index: -1; inset: 0; margin: 0; background: var(--renova-lilac); overflow: hidden; }
.renova-opening-inlay img { width: 100%; height: 100%; object-fit: cover; object-position: center 59%; }
.renova-fragment { position: absolute; z-index: 3; right: 32%; bottom: -28px; width: 200px; height: 183px; transform: rotate(-9deg); filter: drop-shadow(9px 12px 0 var(--renova-lilac)); pointer-events: none; }
.renova-fragment-cut { width: 100%; height: 100%; overflow: clip; clip-path: polygon(50.5% 8.7%, 98.5% 59.5%, 61.5% 91.8%, 6% 60.1%); }
.renova-fragment img { width: 630%; height: auto; max-width: none; transform: translate(-77.78%, -57.14%); }
.renova-opening-caption { position: absolute; z-index: 4; bottom: 18px; right: var(--renova-gutter); width: 315px; padding: 13px 19px; margin: 0; color: var(--renova-ink); background: var(--renova-paper); font-size: 13px; line-height: 1.6; transform: rotate(2deg); box-shadow: 7px 7px 0 var(--renova-lilac); }
/* Three continuous essays, with the photographs entering from opposite edges. */
.renova-repair-bay { position: relative; isolation: isolate; min-height: 770px; padding: 132px 45% 115px 13%; background: var(--renova-paper); }
.renova-repair-bay::before { content: ''; position: absolute; z-index: 4; top: -28px; left: 0; width: 100%; height: 78px; background: url('joint-first.svg') center/100% 100% no-repeat; pointer-events: none; }
.renova-repair-bay:nth-of-type(3)::before { background-image: url('joint-second.svg'); }
.renova-repair-bay:nth-of-type(4)::before { background-image: url('joint-third.svg'); }
.renova-bay-number { position: absolute; left: var(--renova-gutter); top: 48px; z-index: 0; color: var(--renova-lilac); font: 400 158px/1 var(--renova-display); letter-spacing: -.08em; }
.renova-bay-copy { position: relative; z-index: 2; max-width: 660px; }
.renova-bay-copy h2 { max-width: 520px; margin-bottom: 29px; }
.renova-bay-copy p:first-of-type { font-size: 20px; line-height: 1.7; }
.renova-bay-copy p:last-child { margin-bottom: 0; }
.renova-bay-image { position: absolute; z-index: 1; top: 95px; right: 0; bottom: 100px; width: 37%; margin: 0; filter: drop-shadow(-16px 18px 0 var(--renova-ground)); }
.renova-bay-image img { width: 100%; height: 100%; object-fit: cover; object-position: 59% center; clip-path: polygon(22% 0, 100% 8%, 100% 100%, 0 86%); }
.renova-bay-caption { position: absolute; bottom: -26px; left: 15px; width: 260px; padding: 14px 18px; background: var(--renova-paper); font-size: 14px; line-height: 1.6; color: var(--renova-blue); transform: rotate(-3deg); }
.renova-bay-two { padding-left: 46%; padding-right: 10%; background: var(--renova-ground); }
.renova-bay-two .renova-bay-number { left: auto; right: 6%; color: var(--renova-blue); top: 48px; font-size: 125px; }
.renova-bay-two .renova-bay-image { left: 0; right: auto; width: 36%; top: 135px; bottom: 80px; filter: drop-shadow(19px 15px 0 var(--renova-lilac)); }
.renova-bay-two .renova-bay-image img { clip-path: polygon(0 0, 100% 14%, 78% 100%, 0 91%); }
.renova-bay-two .renova-bay-caption { left: auto; right: -22px; bottom: 7px; transform: rotate(3deg); }
.renova-bay-three { padding-left: 17%; padding-right: 45%; }
.renova-bay-three .renova-bay-number { top: 61px; left: 6%; }
.renova-bay-three .renova-bay-image { top: 133px; width: 35%; bottom: 100px; filter: drop-shadow(-16px 18px 0 var(--renova-lilac)); }
.renova-bay-three .renova-bay-image img { clip-path: polygon(13% 0, 100% 16%, 100% 92%, 0 100%); }
.renova-bay-three .renova-bay-caption { bottom: -20px; left: -30px; }
.renova-bottom { position: relative; background: var(--renova-paper); padding: 64px var(--renova-gutter) 28px; border-top: 12px solid var(--renova-ground); }
.renova-bottom-top { display: flex; justify-content: space-between; gap: 50px; }
.renova-bottom-signature { font: 400 86px/1 var(--renova-display); letter-spacing: -.06em; color: var(--renova-blue); }
.renova-bottom-nav { display: flex; flex-wrap: wrap; gap: 13px 30px; align-content: start; max-width: 620px; }
.renova-bottom-nav a { font-size: 16px; }
.renova-footer-sentence { max-width: 680px; font-size: 15px; line-height: 1.8; margin: 34px 0 22px; }
.renova-copyright { font-size: 14px; margin-bottom: 0; }
.renova-article-cover { position: relative; isolation: isolate; padding: 32px var(--renova-gutter) 36px; background: var(--renova-ground); }
.renova-article-opening { position: relative; padding: 20px 0; }
.renova-crumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 25px; font-size: 13px; line-height: 1.7; }
.renova-crumb span[aria-hidden] { padding: 0 5px; color: var(--renova-blue); }
.renova-article-opening h1 { max-width: 940px; font-size: clamp(40px, 4.2vw, 65px); margin-bottom: 24px; }
.renova-article-lead { max-width: 760px; font-size: 19px; line-height: 1.75; margin-bottom: 0; }
.renova-has-photo { min-height: 500px; padding-top: 44px; padding-bottom: 68px; }
.renova-has-photo .renova-article-opening { z-index: 2; width: 62%; max-width: 850px; padding: 29px 38px 34px; background: var(--renova-ground); box-shadow: -10px 10px 0 var(--renova-lilac); }
.renova-has-photo .renova-article-opening::after { content: ''; position: absolute; top: 0; right: -30px; width: 31px; height: 100%; background: var(--renova-ground); clip-path: polygon(0 0, 100% 0, 0 100%); }
.renova-has-photo .renova-article-opening h1 { font-size: clamp(39px, 3.8vw, 59px); }
.renova-article-photo { position: absolute; z-index: -1; inset: 0; margin: 0; }
.renova-article-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 65% center; }
.renova-article-caption { position: absolute; z-index: 3; bottom: 14px; right: var(--renova-gutter); max-width: 330px; padding: 11px 17px; background: var(--renova-paper); font-size: 13px; line-height: 1.6; transform: rotate(-2deg); }
.renova-essay-body { padding-top: 45px; }
.renova-essay-joint { position: relative; padding: 78px 16% 82px 26%; background: var(--renova-paper); }
.renova-essay-joint::before { content: ''; position: absolute; z-index: 2; inset: -21px 0 auto; height: 59px; background: url('joint-first.svg') center/100% 100% no-repeat; pointer-events: none; }
.renova-essay-joint:nth-child(2n) { padding-left: 18%; padding-right: 24%; background: var(--renova-ground); }
.renova-essay-joint:nth-child(2n)::before { background-image: url('joint-second.svg'); }
.renova-essay-joint:nth-child(3n) { padding-left: 30%; padding-right: 12%; }
.renova-essay-joint:nth-child(3n)::before { background-image: url('joint-third.svg'); }
.renova-essay-inner { position: relative; max-width: 720px; }
.renova-essay-inner h2 { max-width: 620px; margin-bottom: 28px; }
.renova-essay-inner p:last-child { margin-bottom: 0; }
.renova-page-mark { position: absolute; left: -115px; top: 2px; display: grid; place-items: center; width: 66px; height: 72px; background: var(--renova-lilac); clip-path: polygon(20% 0, 100% 12%, 81% 100%, 0 83%); }
.renova-page-mark i[data-lucide], .renova-page-mark svg.lucide { width: 29px; height: 29px; }
.renova-next-reading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 14px 24px; padding: 54px var(--renova-gutter); background: var(--renova-lilac); }
.renova-next-reading p { margin: 0; font: 400 32px/1.2 var(--renova-display); }
.renova-next-reading a { padding: 12px 0; border-bottom: 3px solid var(--renova-blue); text-decoration: none; transition: padding .18s ease; }
.renova-next-reading a:hover { padding-left: 13px; padding-right: 13px; }
.renova-reference-strip { position: relative; padding: 70px 20%; background: var(--renova-paper); }
.renova-reference-strip::before { content: ''; position: absolute; inset: -28px 0 auto; height: 76px; background: url('joint-third.svg') center/100% 100% no-repeat; }
.renova-reference-item { max-width: 850px; padding: 25px 0; }
.renova-reference-item + .renova-reference-item { margin-top: 16px; border-top: 8px solid var(--renova-ground); }
.renova-reference-item h2 { font: 400 25px/1.5 var(--renova-display); margin-bottom: 12px; text-wrap: pretty; }
.renova-source-by { font-size: 14px; line-height: 1.6; color: var(--renova-blue); margin-bottom: 12px; }
.renova-reference-item p:last-child { margin-bottom: 0; }
.renova-lost { min-height: 62vh; padding: 80px 12%; }
.renova-lost h1 { max-width: 760px; }
.renova-lost p { max-width: 630px; }
/* The sole entrance motion moves only the decorative fragment. All words are painted. */
@keyframes renova-set-fragment { from { transform: translate(18px, -20px) rotate(-14deg); } to { transform: translate(0, 0) rotate(-9deg); } }
@media (prefers-reduced-motion: no-preference) { .renova-fragment { animation: renova-set-fragment .8s ease-out both; } }
@media (min-width: 1700px) { .renova-opening { min-height: 720px; } }
@media (max-width: 1100px) and (min-width: 701px) {
  .renova-opening { padding-left: 36px; padding-right: 36px; }
  .renova-opening-copy { width: 68%; padding: 30px 32px; }
  .renova-opening h1 { font-size: 49px; }
  .renova-fragment { right: 13%; width: 160px; height: 145px; }
  .renova-repair-bay { padding-left: 9%; padding-right: 40%; }
  .renova-bay-number { left: 3%; font-size: 125px; }
  .renova-bay-two { padding-left: 43%; padding-right: 6%; }
  .renova-bay-two .renova-bay-number { right: 4%; font-size: 100px; }
  .renova-bay-image { width: 32%; }
  .renova-bay-two .renova-bay-image { width: 32%; }
  .renova-bay-three { padding-left: 12%; padding-right: 40%; }
  .renova-bay-three .renova-bay-image { width: 31%; }
  .renova-bay-caption { width: 220px; }
  .renova-has-photo .renova-article-opening { width: 72%; padding: 25px 30px 30px; }
  .renova-essay-joint, .renova-essay-joint:nth-child(n) { padding-left: 20%; padding-right: 8%; }
  .renova-page-mark { left: -100px; }
}
@media (max-width: 700px) {
  :root { --renova-gutter: 24px; }
  body { font-size: 16px; line-height: 1.85; }
  html { scroll-padding-top: 14px; }
  h1 { font-size: 28px; line-height: 1.12; letter-spacing: -.015em; text-wrap: pretty; }
  h2 { font-size: 35px; }
  .renova-mast { padding: 23px 24px 12px; background: var(--renova-ground); }
  .renova-mast::before { display: none; }
  .renova-mast::after { inset: 0 0 auto; height: 15px; clip-path: polygon(0 0, 100% 0, 100% 30%, 0 100%); }
  .renova-wordmark { font-size: 60px; line-height: .9; }
  .renova-editions { gap: 0; justify-content: space-between; margin-top: 8px; }
  .renova-editions a { font-size: 13px; min-height: 29px; gap: 5px; }
  .renova-editions i[data-lucide], .renova-editions svg.lucide { width: 15px; height: 15px; flex-basis: 15px; }
  .renova-editions a::after { left: 20px; }
  .renova-opening { min-height: 0; padding: 0 0 52px; background: var(--renova-ground); }
  .renova-opening-copy { width: 100%; padding: 8px 24px 0; box-shadow: none; }
  .renova-opening-copy::after { display: none; }
  .renova-opening h1 { font-size: 28px; margin-bottom: 13px; max-width: 330px; }
  .renova-welcome { font-size: 16px; line-height: 1.5; margin-bottom: 10px; max-width: none; }
  .renova-promise-swath { width: calc(100% + 32px); margin-left: -16px; padding: 20px 18px 22px; font-size: 16px; line-height: 1.5; }
  .renova-opening-inlay { position: relative; z-index: 0; height: 168px; margin-top: 9px; clip-path: polygon(8% 0, 100% 8%, 100% 100%, 0 88%); }
  .renova-opening-inlay img { object-position: 59% 63%; }
  .renova-fragment { width: 80px; height: 73px; right: 26px; bottom: 48px; z-index: 3; filter: drop-shadow(5px 5px 0 var(--renova-lilac)); }
  .renova-opening-caption { position: relative; bottom: auto; right: auto; width: 258px; margin: -18px 0 0 22px; padding: 10px 14px; font-size: 12px; line-height: 1.5; transform: rotate(-2deg); box-shadow: 5px 5px 0 var(--renova-lilac); }
  .renova-repair-bay, .renova-bay-two, .renova-bay-three { min-height: 0; padding: 91px 24px 61px; }
  .renova-repair-bay::before { height: 47px; top: -15px; }
  .renova-bay-number, .renova-bay-two .renova-bay-number, .renova-bay-three .renova-bay-number { top: 24px; left: auto; right: 26px; font-size: 85px; }
  .renova-bay-copy { max-width: none; }
  .renova-bay-copy h2 { max-width: 290px; margin-bottom: 23px; }
  .renova-bay-copy p:first-of-type { font-size: 18px; line-height: 1.75; }
  .renova-bay-image, .renova-bay-two .renova-bay-image, .renova-bay-three .renova-bay-image { position: relative; width: calc(100% + 24px); height: 292px; top: auto; bottom: auto; left: auto; right: auto; margin: 35px -24px 20px 0; filter: drop-shadow(-9px 10px 0 var(--renova-lilac)); }
  .renova-bay-image img, .renova-bay-three .renova-bay-image img { clip-path: polygon(18% 0, 100% 10%, 100% 100%, 0 87%); }
  .renova-bay-two .renova-bay-image { margin-left: -24px; }
  .renova-bay-two .renova-bay-image img { clip-path: polygon(0 0, 100% 12%, 84% 100%, 0 89%); }
  .renova-bay-caption, .renova-bay-two .renova-bay-caption, .renova-bay-three .renova-bay-caption { width: 240px; left: 5px; right: auto; bottom: -17px; padding: 11px 14px; font-size: 13px; transform: rotate(-2deg); }
  .renova-bay-two .renova-bay-caption { left: 32px; transform: rotate(2deg); }
  .renova-bottom { padding: 44px 24px 25px; }
  .renova-bottom-top { display: block; }
  .renova-bottom-signature { font-size: 65px; margin-bottom: 27px; }
  .renova-bottom-nav { gap: 13px 23px; }
  .renova-footer-sentence { margin-top: 29px; font-size: 14px; }
  .renova-article-cover { padding: 20px 24px 30px; }
  .renova-article-opening { padding: 0; }
  .renova-crumb { font-size: 12px; margin-bottom: 20px; }
  .renova-article-opening h1, .renova-has-photo .renova-article-opening h1 { font-size: 35px; margin-bottom: 19px; }
  .renova-article-lead { font-size: 18px; line-height: 1.75; }
  .renova-has-photo { min-height: 0; padding: 20px 0 35px; }
  .renova-has-photo .renova-article-opening { width: 100%; padding: 0 24px 25px; box-shadow: none; }
  .renova-has-photo .renova-article-opening::after { display: none; }
  .renova-article-photo { position: relative; z-index: 0; height: 224px; }
  .renova-article-photo img { clip-path: polygon(5% 0, 100% 8%, 100% 100%, 0 91%); }
  .renova-article-caption { left: 24px; right: auto; bottom: -20px; max-width: 292px; font-size: 12px; box-shadow: 5px 5px 0 var(--renova-lilac); }
  .renova-essay-body { padding-top: 15px; }
  .renova-essay-joint, .renova-essay-joint:nth-child(n) { padding: 61px 24px 48px; }
  .renova-essay-joint::before { height: 45px; top: -16px; }
  .renova-essay-inner h2 { font-size: 32px; max-width: 310px; }
  .renova-page-mark { position: static; width: 40px; height: 43px; margin-bottom: 19px; }
  .renova-page-mark i[data-lucide], .renova-page-mark svg.lucide { width: 21px; height: 21px; }
  .renova-next-reading { padding: 36px 24px; }
  .renova-next-reading p { font-size: 26px; }
  .renova-reference-strip { padding: 45px 24px; }
  .renova-reference-strip::before { height: 45px; top: -16px; }
  .renova-reference-item h2 { font-size: 24px; overflow-wrap: anywhere; }
  .renova-source-by { font-size: 13px; }
  .renova-lost { padding: 50px 24px; }
  .renova-lost h1 { font-size: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
