/* generated by render-qck-site.ts — do not hand-edit (gitignored output) */
*{box-sizing:border-box;margin:0}
:root{--radius:0.375rem}
html{scroll-behavior:smooth}
body{background:#FBF7EF;color:#17231F;font-family:'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;line-height:1.65;font-size:1.0625rem;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:'DM Serif Display', Georgia, 'Times New Roman', serif;line-height:1.2;color:#17231F}
a{color:#8B2E2E}
a:hover{opacity:.85}
img{max-width:100%}
code{background:#E5D8C5;padding:.1em .35em;border-radius:4px;font-size:.9em}
.jzxw{position:absolute;left:-9999px;top:0;background:#8B2E2E;color:#FFFFFF;padding:.5rem 1rem;z-index:9}
.jzxw:focus{left:0}
.whpv{max-width:72rem;margin:0 auto;padding:0 1.5rem}
.wmlg{font-family:'DM Serif Display', Georgia, 'Times New Roman', serif;font-weight:700;font-size:1.25rem;text-decoration:none;color:inherit}
.yijn{color:#4D5B55;font-size:.85rem}
.ewrr{display:flex;flex-wrap:wrap;gap:1.1rem}
.oseq{text-decoration:none;color:inherit;font-size:.95rem}
.oseq:hover{color:#8B2E2E;opacity:1}
.jcsf{display:none;background:none;border:1px solid currentColor;border-radius:6px;color:inherit;width:2.6rem;height:2.3rem;padding:.45rem .55rem;cursor:pointer;flex-direction:column;justify-content:space-between}
.jcsf span{display:block;height:2px;background:currentColor;border-radius:2px}
.jcsf[aria-expanded="true"] span:nth-child(2){opacity:0}
.ffkg{border-bottom:1px solid #C9BDAA;background:#FBF7EF} .ffkg .whpv{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem}
.smcr{background:#F0E8DA;border-bottom:1px solid #C9BDAA} .smcr .whpv{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:2.5rem;padding:4.08rem 1.5rem}
.vidp{text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;color:#8B2E2E;font-weight:600;margin-bottom:.8rem}
.rakn{font-size:clamp(1.9rem,4.5vw,3rem);margin-bottom:1rem}
.hbqh{font-size:1.15rem;color:#4D5B55;max-width:44rem;margin:0 auto}
.grpq{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin-top:1.4rem}
.jpcb{border:1px solid #C9BDAA;background:#F0E8DA;border-radius:999px;padding:.3rem .85rem;font-size:.85rem}
.rdeq{padding:3.12rem 0}
/* the measure fix: prose column CENTERED in the container, never pinned left */
.dwur,.oxet,.ritb{max-width:46rem;margin-left:auto;margin-right:auto}
.dwur{padding:1.68rem 0}
.dwur h2{font-size:1.6rem;margin-bottom:.8rem}
.dwur h3{font-size:1.2rem;margin:.9rem 0 .5rem}
.dwur p,.dwur li,.oxet p{margin-bottom:.85rem}
.dwur ul,.dwur ol{padding-left:1.4rem}
.oxet{font-size:1.12rem}
.ritb{background:#F0E8DA;border:1px solid #C9BDAA;border-radius:var(--radius);padding:1.2rem 1.4rem;margin-bottom:1.92rem}
.iurz{overflow-x:auto;margin:1rem 0}
table{border-collapse:collapse;width:100%;font-size:.95rem}
th,td{border:1px solid #C9BDAA;padding:.55rem .7rem;text-align:left;vertical-align:top}
th{background:#F0E8DA}
blockquote{border-left:4px solid #8B2E2E;padding:.2rem 0 .2rem 1rem;color:#4D5B55;margin:1rem 0}
.hkbb{max-width:46rem;margin:2.16rem auto;background:#eaddd0;border:1px solid #C9BDAA;border-radius:var(--radius);padding:1.4rem 1.6rem}
.wwaz{font-size:1.25rem;margin-bottom:.7rem}
.wuir{list-style:none;padding:0;margin-top:.8rem;display:grid;gap:.45rem}
.geqb{padding-left:1.1rem;position:relative;font-size:.95rem}
.geqb::before{content:"";position:absolute;left:0;top:.55em;width:.45em;height:.45em;border-radius:50%;background:#8B2E2E}
.xyxo{max-width:46rem;margin:2.16rem auto;padding:0;list-style:none;counter-reset:src}
.oooi{border-top:1px solid #C9BDAA;padding:.9rem 0 .9rem 2.2rem;position:relative;counter-increment:src}
.oooi::before{content:counter(src);position:absolute;left:0;top:.95rem;font-family:'DM Serif Display', Georgia, 'Times New Roman', serif;font-weight:700;color:#8B2E2E}
.tmnd{margin-bottom:.3rem}
.oxdy{font-size:.88rem;color:#4D5B55}
.euki{max-width:46rem;margin:0 auto}
.lwut{border-bottom:1px solid #C9BDAA;padding:1.32rem 0}
.wdhh{font-size:1.15rem;margin-bottom:.5rem}
.chnh{color:#17231F}
.kyrx{background:#dbdacc;border-top:1px solid #C9BDAA;border-bottom:1px solid #C9BDAA;margin:2.4rem 0 0}
.ndhq{max-width:46rem;margin:0 auto;padding:2.64rem 1.5rem;text-align:center}
.ndhq h2{margin-bottom:.7rem}
.ndhq p{margin-bottom:1.1rem}
.xoqh{display:inline-block;background:#8B2E2E;color:#FFFFFF;text-decoration:none;font-weight:600;padding:.8rem 1.8rem;border-radius:var(--radius)}
.xoqh:hover{opacity:.9}

.ogps{font-size:1.45rem;margin-bottom:.45rem}
.iucy p{margin-bottom:.55rem}
.iucy p:last-child{margin-bottom:0}
.hmdz{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.35rem .95rem;margin:.6rem 0 0;font-size:.92rem}
.kiaa{display:inline-block;font-weight:700;font-size:1.05rem;padding:1rem 2rem;border-radius:var(--radius);text-decoration:none;white-space:nowrap}
.kiaa:hover{opacity:.92}
.xill{background:#17231F;color:#FFFFFF;border-top:4px solid #1F5C50}
.mthf{max-width:64rem;margin:0 auto;padding:1.7rem 1.5rem;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.2rem 2.5rem;align-items:center}
.xill h2,.xill p{color:#FFFFFF}
.wpav{display:inline-block;background:#FBF7EF;color:#17231F;font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.3rem .7rem;border-radius:3px;margin-bottom:.6rem}
.hmdz{color:#949a98}
.oinw::before{content:"\2713\00a0"}
.kiaa{background:#8B2E2E;color:#FFFFFF;outline:2px solid #FFFFFF;outline-offset:2px}
@media (max-width:720px){.mthf{display:block} .wpav{transform:none;max-width:none;margin-bottom:.6rem} .kiaa{display:block;text-align:center;margin-top:1rem}}
.oqck{background:#17231F;color:#FFFFFF} .oqck a{color:inherit}
.oqck .whpv{padding:2.64rem 1.5rem}
.wvsz{display:grid;grid-template-columns:2fr 1fr;gap:2rem;margin-bottom:1.4rem}
.zokp{font-style:italic;margin-bottom:.8rem}
.ugdl{font-size:.9rem;margin-bottom:.8rem}
.tnbb{font-size:.85rem;color:#4D5B55}
.oqck .tnbb{opacity:.85}
.vdmt{color:#4D5B55;font-size:.92rem}
.oqck .yijn,.oqck .vdmt{color:#949a98}
.oqck .tnbb{color:#868d8b;opacity:1}
@media(max-width:760px){
  .smcr .whpv{grid-template-columns:1fr;gap:1.5rem}
  .wvsz{grid-template-columns:1fr}
  .ffkg .whpv{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem;padding:.9rem 1.5rem;text-align:left}
  .ffkg .ewrr{border-top:0;padding-top:0}
  .ffkg .jcsf{display:flex}
  .ffkg .ewrr{display:none;flex-basis:100%;flex-direction:column;gap:0;border-top:1px solid #C9BDAA;padding-top:.4rem;margin-top:.4rem}
  .ffkg .ewrr[data-open="true"]{display:flex}
  .ffkg .oseq{display:block;padding:.6rem 0;font-size:1.05rem}
}

/* ---- per-site theme layer ---- */
/* Mesa Cartilage Field Notes — a warm-paper storytelling system. */

:root {
  --story-paper: #FBF7EF;
  --story-card: #F0E8DA;
  --story-card-deep: #E5D8C5;
  --story-ink: #17231F;
  --story-muted: #4D5B55;
  --story-red: #8B2E2E;
  --story-green: #1F5C50;
  --story-line: #C9BDAA;
  --story-shadow: 0 24px 60px -42px rgba(23, 35, 31, .6);
  --icon-gap: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 7h6v10H3zM15 7h6v10h-6z%22/%3E%3Cpath d=%22M9 12h6M12 9l3 3-3 3%22/%3E%3C/svg%3E");
  --icon-pin: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 10c0 5-8 12-8 12S4 15 4 10a8 8 0 1 1 16 0Z%22/%3E%3Ccircle cx=%2212%22 cy=%2210%22 r=%222.4%22/%3E%3C/svg%3E");
  --icon-book: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 5.5A3.5 3.5 0 0 1 7.5 2H11v17H7.5A3.5 3.5 0 0 0 4 22zM20 5.5A3.5 3.5 0 0 0 16.5 2H13v17h3.5A3.5 3.5 0 0 1 20 22z%22/%3E%3C/svg%3E");
  --icon-question: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%229%22/%3E%3Cpath d=%22M9.6 9a2.7 2.7 0 1 1 3.7 2.5c-.8.4-1.3 1-1.3 1.8M12 17h.01%22/%3E%3C/svg%3E");
  --icon-source: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M7 3h8l4 4v14H7zM15 3v5h4M10 12h6M10 16h6%22/%3E%3C/svg%3E");
  --icon-arrow: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 12h15M14 7l5 5-5 5%22/%3E%3C/svg%3E");
}

html {
  scroll-padding-top: 5rem;
}

body {
  color: #17231F;
  letter-spacing: -.008em;
  background-image:
    linear-gradient(rgba(139, 46, 46, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(139, 46, 46, .025) 1px, transparent 1px);
  background-size: 100% 2rem, 2rem 100%;
}

body p,
body li,
td {
  color: #17231F;
}

/* A field-journal masthead with a compact monogram seal. */
.ffkg {
  background: #FBF7EF;
  color: #17231F;
  border-bottom: 1px solid #C9BDAA;
  box-shadow: 0 6px 24px -24px rgba(23, 35, 31, .8);
}

.ffkg .whpv {
  max-width: 80rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.wmlg {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 3.2rem;
  padding-left: 4rem;
  color: #17231F;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 1.22rem;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -.018em;
}

.wmlg::before {
  content: "M";
  position: absolute;
  left: 0;
  top: 0;
  display: grid;
  place-items: center;
  width: 3.15rem;
  height: 3.15rem;
  border: 1px solid #8B2E2E;
  border-radius: 50% 50% 46% 54%;
  background: #FBF7EF;
  color: #8B2E2E;
  font-size: 1.85rem;
  font-style: italic;
  transform: rotate(-4deg);
}

.wmlg::after {
  content: "";
  position: absolute;
  left: 2.72rem;
  bottom: .3rem;
  width: 1.55rem;
  height: 2px;
  background: #1F5C50;
  transform: rotate(-10deg);
  transform-origin: left center;
}

.ffkg .yijn {
  margin: -.55rem 0 0 4rem;
  color: #4D5B55;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .115em;
  text-transform: uppercase;
}

.ewrr {
  gap: .2rem .3rem;
  align-items: center;
}

.oseq {
  position: relative;
  padding: .5rem .56rem;
  color: #17231F;
  font-size: .77rem;
  font-weight: 700;
  letter-spacing: .025em;
}

.oseq::after {
  content: "";
  position: absolute;
  right: .5rem;
  bottom: .22rem;
  left: .5rem;
  height: 1px;
  background: #8B2E2E;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}

.oseq:hover::after {
  transform: scaleX(1);
}

/* The hero is a cover page: story text on the left, an abstract graft diagram on the right. */
.smcr {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 30%, rgba(31, 92, 80, .12) 0 9rem, transparent 9.08rem),
    linear-gradient(112deg, #F0E8DA 0 70%, #E5D8C5 70% 100%);
  color: #17231F;
  border-bottom: 1px solid #C9BDAA;
}

.smcr::before,
.smcr::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.smcr::before {
  right: 6vw;
  top: 50%;
  width: 15rem;
  height: 5.6rem;
  border: 2px solid #1F5C50;
  border-radius: 5rem;
  transform: translateY(-50%) rotate(-7deg);
  box-shadow: inset 5.4rem 0 0 #FBF7EF, inset -5.4rem 0 0 #FBF7EF;
}

.smcr::after {
  right: calc(6vw + 6.45rem);
  top: 50%;
  width: 2.2rem;
  height: 2.2rem;
  border: 2px dashed #8B2E2E;
  border-radius: 50%;
  background: #E5D8C5;
  transform: translateY(-50%) rotate(8deg);
}

.smcr .whpv {
  position: relative;
  z-index: 1;
  display: block;
  max-width: 76rem;
  padding-top: clamp(3.8rem, 8vw, 7.5rem);
  padding-bottom: clamp(4.3rem, 9vw, 8.2rem);
}

.vivr {
  position: relative;
  max-width: 47rem;
  padding-left: 2.3rem;
}

.vivr::before {
  content: "";
  position: absolute;
  left: .35rem;
  top: .1rem;
  bottom: .1rem;
  width: 2px;
  background: #8B2E2E;
}

.vivr::after {
  content: "";
  position: absolute;
  left: -.02rem;
  top: -.15rem;
  width: .72rem;
  height: .72rem;
  border: 2px solid #8B2E2E;
  border-radius: 50%;
  background: #F0E8DA;
}

.vidp {
  margin-bottom: 1.2rem;
  color: #8B2E2E;
  font-size: .72rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .18em;
}

.rakn {
  max-width: 14ch;
  margin-bottom: 1.4rem;
  color: #17231F;
  font-size: clamp(2.75rem, 6.2vw, 5.5rem);
  font-weight: 400;
  line-height: .96;
  letter-spacing: -.042em;
  text-wrap: balance;
}

.hbqh {
  max-width: 39rem;
  margin: 0;
  color: #4D5B55;
  font-size: 1.08rem;
  line-height: 1.72;
}

.grpq {
  max-width: 44rem;
  margin-top: 2rem;
  gap: .5rem;
}

.jpcb {
  display: inline-flex;
  align-items: center;
  border: 1px solid #C9BDAA;
  border-radius: 0;
  background: #FBF7EF;
  color: #17231F;
  padding: .48rem .72rem;
  font-size: .73rem;
  font-weight: 700;
  letter-spacing: .015em;
}

.jpcb::before {
  content: "";
  width: .95rem;
  height: .95rem;
  margin-right: .4rem;
  background: #1F5C50;
  -webkit-mask: var(--icon-gap) center / contain no-repeat;
  mask: var(--icon-gap) center / contain no-repeat;
}

/* Keep the inverted spotlight structural variant, then turn it into an editorial insert. */
.xill {
  position: relative;
  background: #17231F;
  color: #FFFFFF;
  border-top: 0;
  border-bottom: 5px solid #8B2E2E;
}

.xill::before {
  content: "CLINIC NOTE";
  position: absolute;
  left: max(1.5rem, calc((100vw - 64rem) / 2 - 1.2rem));
  top: 1.65rem;
  color: #FFFFFF;
  font-size: .6rem;
  font-weight: 800;
  letter-spacing: .16em;
  writing-mode: vertical-rl;
}

.mthf {
  position: relative;
  max-width: 64rem;
  padding-top: 2.35rem;
  padding-bottom: 2.35rem;
  grid-template-columns: minmax(0, 1fr) minmax(12rem, auto);
}

.slnh {
  position: relative;
  padding-left: 1.7rem;
  border-left: 1px solid rgba(255, 255, 255, .45);
}

.wpav {
  border: 1px solid #C9BDAA;
  border-radius: 0;
  background: #FBF7EF;
  color: #17231F;
  padding: .34rem .6rem;
  font-size: .66rem;
  letter-spacing: .15em;
}

.ogps {
  max-width: 31ch;
  color: #FFFFFF;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: clamp(1.65rem, 3vw, 2.3rem);
  font-weight: 400;
  line-height: 1.08;
}

.iucy p {
  max-width: 46rem;
  color: #FFFFFF;
  font-size: .96rem;
  line-height: 1.65;
}

.hmdz {
  margin-top: .9rem;
  color: #C5CECA;
}

.oinw {
  position: relative;
  padding-left: 1.25rem;
  color: #C5CECA;
}

.oinw::before {
  content: "";
  position: absolute;
  left: 0;
  top: .22rem;
  width: .9rem;
  height: .9rem;
  background: #C5CECA;
  -webkit-mask: var(--icon-pin) center / contain no-repeat;
  mask: var(--icon-pin) center / contain no-repeat;
}

.kiaa {
  position: relative;
  border: 1px solid #FFFFFF;
  border-radius: 0;
  background: #8B2E2E;
  color: #FFFFFF;
  padding-right: 3.3rem;
  box-shadow: 8px 8px 0 #1F5C50;
  transition: transform .2s ease, box-shadow .2s ease;
}

.kiaa::after {
  content: "";
  position: absolute;
  right: 1.2rem;
  top: 50%;
  width: 1.1rem;
  height: 1.1rem;
  background: #FFFFFF;
  -webkit-mask: var(--icon-arrow) center / contain no-repeat;
  mask: var(--icon-arrow) center / contain no-repeat;
  transform: translateY(-50%);
}

.kiaa:hover {
  opacity: 1;
  transform: translate(3px, 3px);
  box-shadow: 5px 5px 0 #1F5C50;
}

/* Chapters follow one continuous red thread. */
.rdeq {
  position: relative;
  padding-top: 4.7rem;
  padding-bottom: 5.4rem;
}

.rdeq > .whpv {
  position: relative;
  max-width: 66rem;
  counter-reset: story-chapter;
}

.oxet {
  position: relative;
  max-width: 51rem;
  margin-bottom: 3rem;
  padding: 2rem 2.3rem 2.1rem 5.2rem;
  border-top: 1px solid #C9BDAA;
  border-bottom: 1px solid #C9BDAA;
  color: #17231F;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 1.23rem;
  line-height: 1.62;
}

.oxet::before {
  content: "READ\A FIRST";
  position: absolute;
  left: 1.1rem;
  top: 2.25rem;
  color: #8B2E2E;
  font-family: 'Manrope', sans-serif;
  font-size: .63rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: .15em;
  white-space: pre;
}

.oxet::after {
  content: "";
  position: absolute;
  left: 3.55rem;
  top: 2.15rem;
  bottom: 2.15rem;
  width: 1px;
  background: #C9BDAA;
}

.dwur {
  position: relative;
  max-width: 51rem;
  margin-top: 1rem;
  padding: 2.4rem 2.55rem 2.5rem 5.2rem;
  border-left: 1px solid #8B2E2E;
  counter-increment: story-chapter;
}

.dwur:nth-of-type(even) {
  background: #F0E8DA;
  color: #17231F;
  box-shadow: var(--story-shadow);
}

.dwur::before {
  content: counter(story-chapter, decimal-leading-zero);
  position: absolute;
  left: -1.55rem;
  top: 2.15rem;
  display: grid;
  place-items: center;
  width: 3.1rem;
  height: 3.1rem;
  border: 1px solid #8B2E2E;
  border-radius: 50%;
  background: #FBF7EF;
  color: #8B2E2E;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .08em;
}

.dwur h2 {
  position: relative;
  max-width: 24ch;
  margin-bottom: 1.25rem;
  color: #17231F;
  font-size: clamp(1.65rem, 3vw, 2.25rem);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.02em;
  text-wrap: balance;
}

.dwur h2::after {
  content: "";
  display: block;
  width: 3.5rem;
  height: 2px;
  margin-top: .85rem;
  background: #1F5C50;
}

.dwur p,
.dwur li {
  color: #17231F;
  font-size: 1rem;
  line-height: 1.78;
}

.dwur p:first-of-type::first-letter {
  float: left;
  margin: .08em .13em 0 0;
  color: #8B2E2E;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 3.25rem;
  line-height: .78;
}

blockquote {
  position: relative;
  border-left: 0;
  background: #E5D8C5;
  color: #17231F;
  padding: 1.4rem 1.6rem 1.4rem 3.8rem;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 1.12rem;
}

blockquote::before {
  content: "“";
  position: absolute;
  left: 1.1rem;
  top: .4rem;
  color: #8B2E2E;
  font-size: 3.5rem;
}

/* Mesa snapshot as a folded route map. */
.hkbb {
  position: relative;
  max-width: 54rem;
  margin-top: 4rem;
  border: 1px solid #1F5C50;
  border-radius: 0;
  background:
    linear-gradient(135deg, transparent 0 1.4rem, #F0E8DA 1.45rem) top left,
    #F0E8DA;
  color: #17231F;
  padding: 2.5rem 2.6rem 2.7rem 4.7rem;
  box-shadow: 12px 12px 0 #E5D8C5;
}

.hkbb::before {
  content: "";
  position: absolute;
  left: 1.45rem;
  top: 2.55rem;
  width: 1.65rem;
  height: 1.65rem;
  background: #1F5C50;
  -webkit-mask: var(--icon-pin) center / contain no-repeat;
  mask: var(--icon-pin) center / contain no-repeat;
}

.wwaz {
  max-width: 25ch;
  margin-bottom: 1rem;
  color: #17231F;
  font-size: clamp(1.55rem, 3vw, 2rem);
  font-weight: 400;
}

.hkbb p,
.geqb {
  color: #17231F;
  line-height: 1.72;
}

.wuir {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem 1.2rem;
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid #C9BDAA;
}

.geqb {
  padding-left: 1.45rem;
  font-size: .84rem;
  font-weight: 600;
}

.geqb::before {
  top: .25rem;
  width: 1rem;
  height: 1rem;
  border-radius: 0;
  background: #8B2E2E;
  -webkit-mask: var(--icon-gap) center / contain no-repeat;
  mask: var(--icon-gap) center / contain no-repeat;
}

/* Source cards resemble clipped notebook references. */
.xyxo {
  max-width: 54rem;
  margin-top: 5rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}

.xyxo::before {
  content: "SOURCE DECK";
  grid-column: 1 / -1;
  color: #8B2E2E;
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .18em;
}

.oooi {
  min-height: 100%;
  border: 1px solid #C9BDAA;
  background: #FBF7EF;
  color: #17231F;
  padding: 1.25rem 1.2rem 1.25rem 3.3rem;
  box-shadow: 4px 4px 0 #E5D8C5;
}

.oooi::before {
  left: 1.05rem;
  top: 1.22rem;
  display: grid;
  place-items: center;
  width: 1.45rem;
  height: 1.45rem;
  border: 1px solid #8B2E2E;
  border-radius: 50%;
  color: #8B2E2E;
  font-size: .68rem;
}

.oooi::after {
  content: "";
  position: absolute;
  right: .8rem;
  top: .8rem;
  width: 1rem;
  height: 1rem;
  background: #1F5C50;
  -webkit-mask: var(--icon-source) center / contain no-repeat;
  mask: var(--icon-source) center / contain no-repeat;
}

.tmnd {
  padding-right: .9rem;
  color: #17231F;
  font-size: .84rem;
  line-height: 1.55;
}

.oxdy {
  color: #4D5B55;
  font-size: .75rem;
  line-height: 1.45;
}

/* FAQ is staged as a conversation in the notebook margin. */
.euki {
  max-width: 54rem;
  counter-reset: faq-note;
}

.lwut {
  position: relative;
  border-bottom: 1px solid #C9BDAA;
  padding: 2rem 2rem 2rem 4.2rem;
  counter-increment: faq-note;
}

.lwut::before {
  content: counter(faq-note, decimal-leading-zero);
  position: absolute;
  left: .3rem;
  top: 2rem;
  color: #8B2E2E;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 1.4rem;
  font-style: italic;
}

.lwut::after {
  content: "";
  position: absolute;
  left: 2.45rem;
  top: 2.05rem;
  width: 1.1rem;
  height: 1.1rem;
  background: #1F5C50;
  -webkit-mask: var(--icon-question) center / contain no-repeat;
  mask: var(--icon-question) center / contain no-repeat;
}

.wdhh {
  max-width: 34ch;
  color: #17231F;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 1.45rem;
  font-weight: 400;
  line-height: 1.2;
}

.chnh {
  max-width: 47rem;
  color: #17231F;
  font-size: .96rem;
  line-height: 1.72;
}

/* Final invitation: a dark green page turn, not a generic card. */
.kyrx {
  position: relative;
  overflow: hidden;
  margin-top: 0;
  border: 0;
  background: #1F5C50;
  color: #FFFFFF;
}

.kyrx::before {
  content: "";
  position: absolute;
  right: -4rem;
  top: -5rem;
  width: 18rem;
  height: 18rem;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 50%;
  box-shadow: 0 0 0 2.7rem rgba(255, 255, 255, .05), 0 0 0 5.4rem rgba(255, 255, 255, .04);
}

.ndhq {
  position: relative;
  z-index: 1;
  max-width: 52rem;
  padding-top: 5rem;
  padding-bottom: 5rem;
  text-align: left;
}

.ndhq h2 {
  max-width: 16ch;
  color: #FFFFFF;
  font-size: clamp(2rem, 4vw, 3.4rem);
  font-weight: 400;
  line-height: 1;
}

.ndhq p {
  max-width: 43rem;
  color: #FFFFFF;
  line-height: 1.7;
}

.xoqh {
  position: relative;
  border: 1px solid #FFFFFF;
  border-radius: 0;
  background: #8B2E2E;
  color: #FFFFFF;
  padding: .95rem 3.5rem .95rem 1.4rem;
  box-shadow: 7px 7px 0 #17231F;
}

.xoqh::after {
  content: "";
  position: absolute;
  right: 1.2rem;
  top: 50%;
  width: 1.15rem;
  height: 1.15rem;
  background: #FFFFFF;
  -webkit-mask: var(--icon-arrow) center / contain no-repeat;
  mask: var(--icon-arrow) center / contain no-repeat;
  transform: translateY(-50%);
}

/* Footer variant 2 remains inverted; this refines its closing colophon. */
.oqck {
  position: relative;
  background: #17231F;
  color: #FFFFFF;
  border-top: 1px solid #8B2E2E;
}

.oqck::before {
  content: "MESA / FIELD NOTES / 2026";
  position: absolute;
  right: 1.5rem;
  top: 1rem;
  color: #C5CECA;
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .16em;
}

.oqck .whpv {
  max-width: 76rem;
  padding-top: 4.2rem;
  padding-bottom: 3rem;
}

.wvsz {
  grid-template-columns: minmax(0, 1.55fr) minmax(16rem, .8fr);
  gap: 3.5rem;
  padding-bottom: 2.2rem;
  border-bottom: 1px solid rgba(255, 255, 255, .28);
}

.oqck .zokp,
.oqck .ugdl,
.oqck .tnbb {
  color: #C5CECA;
}

.zokp {
  max-width: 45rem;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 1.08rem;
  line-height: 1.5;
}

.ugdl {
  max-width: 48rem;
  line-height: 1.65;
}

.oqck .oseq {
  display: inline-block;
  color: #FFFFFF;
  padding: .3rem .2rem;
}

.tnbb {
  margin-top: 1.2rem;
}

@media (max-width: 900px) {
  .smcr::before,
  .smcr::after {
    opacity: .28;
  }

  .xyxo {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .ffkg .whpv {
    padding-top: .8rem;
    padding-bottom: .8rem;
  }

  .wmlg {
    min-height: 2.7rem;
    padding-left: 3.35rem;
    font-size: .98rem;
  }

  .wmlg::before {
    width: 2.65rem;
    height: 2.65rem;
    font-size: 1.55rem;
  }

  .wmlg::after {
    left: 2.25rem;
  }

  .ffkg .yijn {
    margin-left: 3.35rem;
    font-size: .58rem;
  }

  .smcr .whpv {
    padding-top: 3.8rem;
    padding-bottom: 4.4rem;
  }

  .vivr {
    max-width: 100%;
    padding-left: 1.45rem;
  }

  .smcr::before {
    right: -8rem;
    width: 13rem;
  }

  .smcr::after {
    right: -1.6rem;
  }

  .rakn {
    max-width: 13ch;
    font-size: clamp(2.5rem, 13vw, 4.1rem);
  }

  .xill::before {
    display: none;
  }

  .slnh {
    padding-left: 1rem;
  }

  .rdeq {
    padding-top: 3.2rem;
    padding-bottom: 3.5rem;
  }

  .oxet {
    padding: 1.5rem 1.15rem;
    font-size: 1.07rem;
  }

  .oxet::before,
  .oxet::after {
    display: none;
  }

  .dwur {
    padding: 2.1rem 1.15rem 2.2rem 2.3rem;
  }

  .dwur::before {
    left: -.9rem;
    width: 1.8rem;
    height: 1.8rem;
    font-size: .55rem;
  }

  .hkbb {
    margin-right: .45rem;
    padding: 2.1rem 1.2rem 2.2rem 3.5rem;
    box-shadow: 7px 7px 0 #E5D8C5;
  }

  .hkbb::before {
    left: 1.05rem;
  }

  .wuir {
    grid-template-columns: 1fr;
  }

  .lwut {
    padding: 1.65rem .2rem 1.7rem 3.25rem;
  }

  .lwut::before {
    left: 0;
    top: 1.65rem;
  }

  .lwut::after {
    left: 1.8rem;
    top: 1.72rem;
  }

  .ndhq {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .wvsz {
    grid-template-columns: 1fr;
    gap: 1.7rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .oseq::after,
  .kiaa {
    transition: none;
  }
}