/* Cryvela · main.css
   Swiss editorial: white paper, ink, one electric violet.
   Grid on wide screens: [chapter rail] [reading column] [margin for captions]. */

:root {
  --cv-paper: #ffffff;
  --cv-ink: #0d0d10;
  --cv-text: #1c1c22;
  --cv-soft: #50505a;
  --cv-mute: #85858f;
  --cv-hair: #e2e2e8;
  --cv-violet: #6b4dff;
  --cv-violet-ink: #4b2fe3;
  --cv-violet-pale: #b9abff;
  --cv-wash: #f4f2ff;
  --cv-serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --cv-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --cv-rail: 12.5rem;
  --cv-gutter: 3.5rem;
  --cv-measure: min(68ch, 39rem); /* about 68 characters of Inter per line */
  --cv-edge: clamp(1.25rem, 4.2vw, 3rem);
}

*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 4.5rem;
}
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  margin: 0;
  background: var(--cv-paper);
  color: var(--cv-text);
  font: 400 1.0625rem/1.72 var(--cv-sans);
  font-feature-settings: "cv11", "ss03";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-wrap: break-word;
}
@media (min-width: 45em) {
  body { font-size: 1.125rem; }
}

img { max-width: 100%; height: auto; display: block; }

a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: var(--cv-violet);
  text-decoration-thickness: 1px;
  text-underline-offset: .22em;
  transition: color .15s ease, text-decoration-color .15s ease;
}
a:hover { color: var(--cv-violet-ink); }
:focus-visible { outline: 2px solid var(--cv-violet); outline-offset: 3px; }

.cv-skip {
  position: absolute; left: -9999px; top: .5rem;
  background: var(--cv-ink); color: #fff; padding: .5rem .9rem; z-index: 50;
  font-size: .875rem; text-decoration: none;
}
.cv-skip:focus { left: .5rem; }

/* ───────── masthead ───────── */

.cv-mast { border-bottom: 1px solid var(--cv-ink); background: var(--cv-paper); }
.cv-mast__in {
  max-width: 86rem; margin-inline: auto; padding: 0 var(--cv-edge);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  min-height: 4rem;
}
.cv-mark {
  display: inline-flex; align-items: center; gap: .6rem;
  font: 500 1.45rem/1 var(--cv-serif); letter-spacing: -.01em; color: var(--cv-ink);
  text-decoration: none;
}
.cv-mark svg { width: 1.6rem; height: 1.6rem; flex: none; }
.cv-mark i { font-style: italic; font-weight: 300; }
.cv-mark:hover { color: var(--cv-ink); }

.cv-nav { display: flex; gap: clamp(1rem, 3vw, 2.25rem); }
.cv-nav a {
  font: 500 .75rem/1 var(--cv-sans); letter-spacing: .15em; text-transform: uppercase;
  color: var(--cv-ink); text-decoration: none; padding: .5rem 0;
  border-bottom: 2px solid transparent;
}
.cv-nav a:hover { color: var(--cv-violet-ink); }
.cv-nav a[aria-current="page"],
[data-page="about"] .cv-nav a[href="/about/"],
[data-page="contact"] .cv-nav a[href="/contact/"] { border-bottom-color: var(--cv-violet); }

@media (min-width: 45em) {
  .cv-mast__in { min-height: 4.75rem; }
  .cv-mark { font-size: 1.6rem; }
  .cv-nav a { font-size: .78rem; }
}

/* ───────── running head (narrow screens, added by script) ───────── */

.cv-runhead {
  position: fixed; inset: 0 0 auto 0; z-index: 30;
  background: rgba(255, 255, 255, .97);
  border-bottom: 1px solid var(--cv-ink);
  transform: translateY(-101%);
  transition: transform .25s ease;
}
.cv-runhead.is-shown { transform: none; }
.cv-runhead a {
  display: flex; align-items: baseline; gap: .7rem;
  padding: .7rem var(--cv-edge); text-decoration: none; color: var(--cv-ink);
}
.cv-runhead__num { font: italic 400 1.2rem/1 var(--cv-serif); color: var(--cv-violet); flex: none; }
.cv-runhead__t {
  flex: 1; min-width: 0; font-size: .8125rem; font-weight: 500; line-height: 1.3;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cv-runhead__up {
  flex: none; font-size: .6875rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--cv-soft);
}
@media (min-width: 68.75em) {
  .cv-runhead { display: none; }
}

/* ───────── the sheet: one grid for cover, contents and chapters ───────── */

.cv-sheet {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  max-width: 42rem;
  margin-inline: auto;
  padding-inline: var(--cv-edge);
  counter-reset: cv-ch cv-fig cv-q;
}
.cv-sheet > [data-part="hero"] { grid-row: 1; }
.cv-sheet > .cv-cover { grid-row: 2; }
.cv-sheet > .cv-contents { grid-row: 3; }
.cv-rail { display: none; }

/* cover */
[data-part="hero"] { padding: 2.25rem 0 1.75rem; }
[data-part="kicker"] {
  margin: 0 0 1.1rem;
  font: 600 .72rem/1.45 var(--cv-sans); letter-spacing: .16em; text-transform: uppercase;
  color: var(--cv-violet-ink);
}
[data-part="kicker"]::before {
  content: ""; display: inline-block; width: .55rem; height: .55rem; margin-right: .6rem;
  background: var(--cv-violet); vertical-align: .05em;
}
[data-part="hero"] h1 {
  margin: 0;
  font: 300 clamp(2.35rem, 1.2rem + 5.4vw, 5.6rem)/1.0 var(--cv-serif);
  letter-spacing: -.022em;
  color: var(--cv-ink);
  text-wrap: balance;
}
.cv-h1-it {
  display: block;
  font-style: italic;
  font-weight: 300;
  color: var(--cv-violet);
  letter-spacing: -.012em;
}
[data-part="dek"] {
  margin: 1.3rem 0 0;
  font-size: 1.0625rem; line-height: 1.58; color: #2a2a31;
}
[data-part="meta"] {
  margin: 1.4rem 0 0; padding-top: .75rem;
  border-top: 1px solid var(--cv-ink);
  font-size: .8125rem; line-height: 1.6; font-weight: 500; color: var(--cv-soft);
  font-variant-numeric: tabular-nums;
}

.cv-cover { margin: 0 0 0; }
.cv-cover img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: 50% 58%;
  background: #f3f3f6;
}

/* contents spread */
.cv-contents { padding: 3rem 0 1rem; }
.cv-contents__h {
  margin: 0 0 1.25rem;
  font: italic 300 2.6rem/1 var(--cv-serif); letter-spacing: -.02em; color: var(--cv-ink);
}
.cv-contents__list {
  list-style: none; margin: 0; padding: 0;
  counter-reset: cv-toc;
}
.cv-contents__list li { counter-increment: cv-toc; border-top: 1px solid var(--cv-ink); break-inside: avoid; }
.cv-contents__list li:last-child { border-bottom: 1px solid var(--cv-ink); }
.cv-contents__list a {
  display: grid; grid-template-columns: 3.4rem minmax(0, 1fr); align-items: baseline;
  padding: .85rem 0 1rem; text-decoration: none; color: var(--cv-ink);
}
.cv-contents__list a::before {
  content: counter(cv-toc, decimal-leading-zero);
  font: 300 2rem/1 var(--cv-serif); letter-spacing: -.02em;
  font-variant-numeric: lining-nums tabular-nums;
  transition: color .15s ease;
}
.cv-contents__list span { font-size: .975rem; line-height: 1.42; font-weight: 500; }
.cv-contents__list a:hover::before { color: var(--cv-violet); font-style: italic; }
.cv-contents__list a:hover span { text-decoration: underline; text-decoration-color: var(--cv-violet); text-underline-offset: .2em; }

/* ───────── chapters ───────── */

.cv-sheet > section { counter-increment: cv-ch; padding-top: 3.5rem; min-width: 0; }
.cv-sheet > section::before {
  content: counter(cv-ch, decimal-leading-zero);
  display: block;
  padding-top: .9rem;
  border-top: 1px solid var(--cv-ink);
  font: italic 300 3.75rem/1 var(--cv-serif);
  letter-spacing: -.03em;
  color: var(--cv-violet);
  font-variant-numeric: lining-nums;
}
.cv-sheet > section > h2 {
  margin: .9rem 0 1.4rem;
  font: 400 clamp(1.8rem, 1.1rem + 2.2vw, 2.75rem)/1.1 var(--cv-serif);
  letter-spacing: -.018em;
  color: var(--cv-ink);
  text-wrap: balance;
  max-width: 21em;
}
.cv-sheet section h3 {
  margin: 2.4em 0 .55em;
  font: 600 1.2rem/1.35 var(--cv-sans);
  letter-spacing: -.008em;
  color: var(--cv-ink);
}
.cv-sheet section p { margin: 0 0 1.15em; }
.cv-sheet section strong { font-weight: 600; color: var(--cv-ink); }
.cv-sheet section a[target="_blank"]:not([data-cta])::after {
  content: "\202F\2197"; font-size: .8em; color: var(--cv-violet-ink);
}

/* figures: thin frame, numbered */
.cv-sheet figure[data-part="shot"] { margin: 2rem 0 2.4rem; counter-increment: cv-fig; }
figure[data-part="shot"] img {
  width: 100%;
  border: 1px solid var(--cv-ink);
  padding: .55rem;
  background: #fff;
}
figure[data-part="shot"] figcaption {
  margin-top: .75rem;
  font-size: .85rem; line-height: 1.5; color: var(--cv-soft);
}
figure[data-part="shot"] figcaption::before {
  content: "Fig. " counter(cv-fig);
  font: italic 400 1.05rem/1 var(--cv-serif);
  color: var(--cv-violet-ink);
  margin-right: .5rem;
}

/* tables */
.cv-sheet table {
  width: 100%; border-collapse: collapse;
  margin: 1.6rem 0 2.2rem;
  font-size: .9rem; line-height: 1.5;
  font-variant-numeric: tabular-nums;
}
.cv-sheet thead th {
  text-align: left; vertical-align: bottom;
  padding: .7rem .9rem .65rem 0;
  border-top: 2px solid var(--cv-ink); border-bottom: 1px solid var(--cv-ink);
  font: 600 .68rem/1.35 var(--cv-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--cv-ink);
}
.cv-sheet td {
  padding: .85rem .9rem .85rem 0; vertical-align: top;
  border-bottom: 1px solid var(--cv-hair);
}
.cv-sheet td:first-child { font-weight: 600; color: var(--cv-ink); }

/* definition list */
.cv-sheet dl { margin: 1.4rem 0 2rem; border-top: 2px solid var(--cv-ink); }
.cv-sheet dt {
  padding-top: .95rem;
  font: 600 .68rem/1.45 var(--cv-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--cv-soft);
}
.cv-sheet dd {
  margin: .35rem 0 0; padding-bottom: 1rem;
  border-bottom: 1px solid var(--cv-hair);
  font: 400 1.22rem/1.42 var(--cv-serif); color: var(--cv-ink);
}

/* note and warning */
[data-part="note"] {
  margin: 2rem 0;
  padding: .15rem 0 .15rem 1.3rem;
  border-left: 3px solid var(--cv-violet);
}
[data-part="note"]::before {
  content: "Note";
  display: block; margin-bottom: .35rem;
  font: 600 .68rem/1.4 var(--cv-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cv-violet-ink);
}
.cv-sheet [data-part="note"] p {
  margin: 0; font: italic 400 1.18rem/1.55 var(--cv-serif); color: var(--cv-ink);
}
[data-part="warn"] {
  position: relative;
  margin: 2.6rem 0 2.2rem;
  padding: 1.6rem 1.4rem .4rem;
  border: 2px solid var(--cv-ink);
}
[data-part="warn"]::before {
  content: "Caution";
  position: absolute; top: -.72rem; left: 1rem;
  padding: 0 .55rem; background: var(--cv-paper);
  font: 600 .7rem/1.4 var(--cv-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cv-violet-ink);
}
.cv-sheet [data-part="warn"] p { font-size: 1rem; line-height: 1.65; }

/* numbered app steps */
ol[data-part="steps"] {
  list-style: none; margin: 1.6rem 0 2rem; padding: 0;
  counter-reset: cv-step; border-top: 1px solid var(--cv-ink);
}
ol[data-part="steps"] li {
  counter-increment: cv-step;
  display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); align-items: baseline;
  padding: .8rem 0; border-bottom: 1px solid var(--cv-hair);
}
ol[data-part="steps"] li::before {
  content: counter(cv-step);
  font: italic 300 1.75rem/1 var(--cv-serif); color: var(--cv-violet);
}

/* referral block */
.cv-sheet > [data-part="cta"] {
  margin: 3.5rem 0 0;
  padding: 1.75rem 1.4rem 1.6rem;
  background: var(--cv-ink);
  color: #ececf1;
  display: grid; grid-template-columns: minmax(0, 1fr);
}
[data-part="cta"] p { margin: 0; }
[data-part="cta"] > p:first-child {
  font: 600 .7rem/1.4 var(--cv-sans); letter-spacing: .16em; text-transform: uppercase; color: #b4b4c2;
}
[data-part="cta"] > p:first-child strong {
  display: block; margin: .4rem 0 .9rem;
  font: 300 3.2rem/1 var(--cv-serif); letter-spacing: .03em; text-transform: none;
  color: #fff; font-variant-numeric: lining-nums;
}
.cv-copy {
  display: inline-flex; align-items: center; gap: .5rem;
  margin: 0 0 1.4rem; padding: .62rem 1rem;
  border: 1px solid rgba(255, 255, 255, .55); border-radius: 0;
  background: transparent; color: #fff; cursor: pointer;
  font: 600 .7rem/1 var(--cv-sans); letter-spacing: .15em; text-transform: uppercase;
  transition: background .15s ease, border-color .15s ease;
}
.cv-copy::before {
  content: ""; width: .7rem; height: .8rem;
  border: 1.5px solid currentColor; box-shadow: 2px -2px 0 -.5px #0d0d10, 3px -3px 0 0 currentColor;
}
.cv-copy:hover { border-color: #fff; }
.cv-copy.is-done { background: var(--cv-violet); border-color: var(--cv-violet); }
.cv-copy.is-done::before { border: 0; box-shadow: none; width: .7rem; height: .4rem; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) translateY(-.1rem); }
[data-part="cta"] > p:nth-child(2) { font-size: 1rem; line-height: 1.6; color: #f1f1f5; }
[data-part="cta"] > a[data-cta] {
  justify-self: stretch; justify-content: space-between;
  display: inline-flex; align-items: center; gap: .9rem;
  margin: 1.2rem 0 1.2rem;
  padding: 1rem 1.5rem;
  background: var(--cv-violet); color: #fff;
  font: 600 1rem/1.2 var(--cv-sans); letter-spacing: .005em;
  text-decoration: none;
  transition: background .15s ease, transform .15s ease;
}
[data-part="cta"] > a[data-cta]::after { content: "\2192"; font-size: 1.15em; transition: transform .15s ease; }
[data-part="cta"] > a[data-cta]:hover { background: #7d63ff; color: #fff; }
[data-part="cta"] > a[data-cta]:hover::after { transform: translateX(3px); }
[data-part="cta"] > a[data-cta]:focus-visible { outline-color: #fff; }
[data-part="cta"] > p:last-child {
  padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, .22);
  font-size: .9375rem; line-height: 1.6; color: #d7d7e0;
}
[data-part="cta"] > p:last-child a { color: #fff; text-decoration-color: var(--cv-violet-pale); }

/* FAQ */
#faq details { border-top: 1px solid var(--cv-hair); counter-increment: cv-q; }
#faq details:first-of-type { border-top: 2px solid var(--cv-ink); }
#faq details:last-of-type { border-bottom: 1px solid var(--cv-ink); }
#faq summary {
  list-style: none; cursor: pointer;
  display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) 1.25rem; align-items: baseline; gap: 0 .4rem;
  padding: 1.05rem 0;
  font: 400 1.18rem/1.38 var(--cv-serif); color: var(--cv-ink);
}
#faq summary::-webkit-details-marker { display: none; }
#faq summary::before {
  content: counter(cv-q, decimal-leading-zero);
  font: 600 .7rem/1 var(--cv-sans); letter-spacing: .12em; color: var(--cv-violet-ink);
}
#faq summary::after {
  content: ""; align-self: center; justify-self: end;
  width: .85rem; height: .85rem;
  background:
    linear-gradient(var(--cv-ink), var(--cv-ink)) center / 100% 1.5px no-repeat,
    linear-gradient(var(--cv-ink), var(--cv-ink)) center / 1.5px 100% no-repeat;
  transition: transform .2s ease;
}
#faq details[open] summary::after { transform: rotate(45deg); }
#faq summary:hover { color: var(--cv-violet-ink); }
#faq details > p { margin: -.2rem 0 1.3rem 3rem; color: var(--cv-text); font-size: 1rem; }

/* end of story */
.cv-end {
  margin: 3.5rem 0 4.5rem; padding-top: 1rem;
  border-top: 1px solid var(--cv-ink);
  display: flex; align-items: center; gap: .75rem;
  font: 600 .72rem/1.4 var(--cv-sans); letter-spacing: .15em; text-transform: uppercase;
}
.cv-end::before { content: ""; width: .65rem; height: .65rem; background: var(--cv-violet); }
.cv-end a { text-decoration: none; color: var(--cv-ink); }
.cv-end a:hover { color: var(--cv-violet-ink); }

/* ───────── medium screens ───────── */

@media (min-width: 45em) {
  [data-part="hero"] { padding: 3.5rem 0 2.25rem; }
  [data-part="dek"] { font-size: 1.25rem; }
  [data-part="cta"] > a[data-cta] { justify-self: start; }
  .cv-contents { padding-top: 4rem; }
  .cv-contents__h { font-size: 3.4rem; }
  .cv-contents__list a { grid-template-columns: 4.2rem minmax(0, 1fr); }
  .cv-contents__list a::before { font-size: 2.5rem; }
  .cv-sheet > section { padding-top: 4.5rem; }
  .cv-sheet > [data-part="cta"] { padding: 2.25rem 2.25rem 2rem; }
  [data-part="cta"] > p:first-child strong { font-size: 4.2rem; }
  [data-part="warn"] { padding: 1.8rem 1.9rem .5rem; }
  .cv-sheet table { font-size: .95rem; }
}

/* ───────── wide screens: the editorial grid ───────── */

@media (min-width: 68.75em) {
  .cv-sheet {
    max-width: 86rem;
    grid-template-columns: var(--cv-rail) minmax(0, var(--cv-measure)) minmax(12rem, 1fr);
    column-gap: var(--cv-gutter);
  }

  /* cover */
  .cv-sheet > [data-part="hero"] {
    grid-column: 1 / -1;
    display: grid; grid-template-columns: subgrid;
    align-items: start;
    padding: 5rem 0 3rem;
  }
  [data-part="hero"] > [data-part="kicker"] { grid-column: 1; grid-row: 1; margin: 1.05rem 0 0; }
  [data-part="hero"] > h1 { grid-column: 2 / -1; grid-row: 1; max-width: 13.5em; }
  [data-part="hero"] > [data-part="dek"] { grid-column: 2; grid-row: 2; margin-top: 2.25rem; }
  [data-part="hero"] > [data-part="meta"] { grid-column: 3; grid-row: 2; margin-top: 2.6rem; max-width: 19rem; }

  .cv-sheet > .cv-cover { grid-column: 1 / -1; }
  .cv-cover img { aspect-ratio: 2.25 / 1; }

  /* contents spread */
  .cv-sheet > .cv-contents {
    grid-column: 1 / -1;
    display: grid; grid-template-columns: subgrid;
    padding: 5rem 0 1rem;
  }
  .cv-contents__h { grid-column: 1; font-size: 3.6rem; margin: -.3rem 0 0; }
  .cv-contents__list { grid-column: 2 / -1; columns: 2; column-gap: var(--cv-gutter); }
  .cv-contents__list a { grid-template-columns: 5rem minmax(0, 1fr); padding: 1rem 0 1.25rem; }
  .cv-contents__list a::before { font-size: 2.9rem; }
  .cv-contents__list span { font-size: 1rem; }

  /* chapter rail: the big numeral is the navigation */
  .cv-rail { display: block; grid-column: 1; grid-row: 4 / span 40; }
  .cv-rail__in { position: sticky; top: 2rem; padding-top: 5.5rem; }
  .cv-rail__now { display: none; margin: 0 0 1.4rem; align-items: flex-end; gap: .4rem; }
  .cv-js .cv-rail__now { display: flex; }
  .cv-rail__num {
    font: italic 300 7.25rem/.8 var(--cv-serif); letter-spacing: -.045em;
    color: var(--cv-violet); font-variant-numeric: lining-nums;
  }
  .cv-rail__of { font: 500 .8rem/1 var(--cv-sans); color: var(--cv-mute); padding-bottom: .3rem; font-variant-numeric: tabular-nums; }
  .cv-rail__list { list-style: none; margin: 0; padding: 0; counter-reset: cv-rl; border-top: 1px solid var(--cv-ink); }
  .cv-rail__list li { counter-increment: cv-rl; border-bottom: 1px solid var(--cv-hair); }
  .cv-rail__list a {
    display: grid; grid-template-columns: 1.9rem minmax(0, 1fr); align-items: baseline;
    padding: .5rem 0; text-decoration: none; color: var(--cv-mute);
  }
  .cv-rail__list a::before {
    content: counter(cv-rl, decimal-leading-zero);
    font: 600 .68rem/1 var(--cv-sans); letter-spacing: .06em; font-variant-numeric: tabular-nums;
  }
  .cv-rail__list span {
    font-size: .78rem; line-height: 1.4;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .cv-rail__list a:hover { color: var(--cv-ink); }
  .cv-rail__list li.is-on a { color: var(--cv-ink); }
  .cv-rail__list li.is-on a::before { color: var(--cv-violet-ink); }
  .cv-rail__list li.is-on span { white-space: normal; font-weight: 500; }

  /* chapters sit in reading column + margin */
  .cv-sheet > section {
    grid-column: 2 / -1;
    display: grid; grid-template-columns: subgrid;
    align-content: start;
    padding-top: 5.5rem;
  }
  .cv-sheet > section > * { grid-column: 1; }
  .cv-sheet > section::before {
    grid-column: 1 / -1;
    font: 600 .72rem/1.4 var(--cv-sans); letter-spacing: .16em; color: var(--cv-violet-ink);
    content: "Chapter " counter(cv-ch, decimal-leading-zero);
    text-transform: uppercase;
  }
  .cv-sheet > section > h2 { grid-column: 1 / -1; margin-top: 1.1rem; }

  .cv-sheet section > figure[data-part="shot"] {
    grid-column: 1 / -1;
    display: grid; grid-template-columns: subgrid; align-items: end;
    margin: 2.4rem 0 2.8rem;
  }
  figure[data-part="shot"] img { grid-column: 1; }
  figure[data-part="shot"] figcaption {
    grid-column: 2; margin: 0; max-width: 17rem;
    padding-top: .8rem; border-top: 1px solid var(--cv-ink);
  }
  figure[data-part="shot"] figcaption::before {
    display: block; margin: 0 0 .5rem; font-size: 1.6rem; color: var(--cv-violet);
  }

  .cv-sheet section > table { grid-column: 1 / -1; max-width: 52rem; }
  .cv-sheet section > dl dd { font-size: 1.3rem; }

  .cv-sheet > [data-part="cta"] {
    grid-column: 2 / -1;
    margin-top: 5rem;
    padding: 2.75rem 3rem 2.5rem;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    column-gap: 3.5rem;
  }
  [data-part="cta"] > p:first-child { grid-column: 1; grid-row: 1 / span 3; }
  [data-part="cta"] > p:first-child strong { font-size: 5.25rem; margin-top: .6rem; }
  [data-part="cta"] > p:nth-child(2),
  [data-part="cta"] > a[data-cta],
  [data-part="cta"] > p:last-child { grid-column: 2; }
  [data-part="cta"] > a[data-cta] { margin: 1.3rem 0 1.5rem; }

  #faq summary { font-size: 1.3rem; padding: 1.2rem 0; }

  .cv-sheet > .cv-end { grid-column: 2 / -1; margin-top: 5rem; }
}

@media (min-width: 90em) {
  [data-part="hero"] h1 { font-size: 6rem; }
}

/* ───────── site pages ───────── */

.cv-page {
  max-width: 42rem; margin-inline: auto; padding: 2.5rem var(--cv-edge) 4.5rem;
}
.cv-page__folio {
  margin: 0 0 1.5rem;
  font: 600 .72rem/1.45 var(--cv-sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cv-violet-ink);
}
.cv-page__folio span + span::before { content: "/"; margin: 0 .5rem; color: var(--cv-mute); }
.cv-page__body h1 {
  margin: 0 0 2rem;
  font: 300 clamp(2.4rem, 1.4rem + 4vw, 4.6rem)/1.02 var(--cv-serif); letter-spacing: -.022em; color: var(--cv-ink);
  text-wrap: balance;
}
.cv-page__body h2 {
  margin: 2.6rem 0 .8rem; padding-top: .9rem;
  border-top: 1px solid var(--cv-ink);
  font: 400 1.6rem/1.2 var(--cv-serif); letter-spacing: -.012em; color: var(--cv-ink);
}
.cv-page__body p { margin: 0 0 1.1em; }
.cv-page__body ul { margin: 0 0 1.3em; padding: 0; list-style: none; }
.cv-page__body li { position: relative; padding-left: 1.6rem; margin-bottom: .45rem; }
.cv-page__body li::before { content: ""; position: absolute; left: 0; top: .78em; width: .8rem; height: 1px; background: var(--cv-violet); }

@media (min-width: 68.75em) {
  .cv-page {
    max-width: 86rem;
    display: grid; grid-template-columns: var(--cv-rail) minmax(0, var(--cv-measure)) minmax(12rem, 1fr);
    column-gap: var(--cv-gutter);
    padding-top: 5rem; padding-bottom: 7rem;
  }
  .cv-page__folio { grid-column: 1; padding-top: 1rem; }
  .cv-page__body { grid-column: 2 / -1; display: grid; grid-template-columns: subgrid; align-content: start; }
  .cv-page__body > * { grid-column: 1; }
  .cv-page__body > h1 { grid-column: 1 / -1; max-width: 14em; margin-bottom: 3rem; }
}

/* 404 */
.cv-lost { max-width: 86rem; margin-inline: auto; padding: 4rem var(--cv-edge) 6rem; }
.cv-lost .cv-lost__num {
  margin: 0; max-width: none; font: italic 300 clamp(7rem, 4rem + 18vw, 17rem)/.8 var(--cv-serif);
  letter-spacing: -.05em; color: var(--cv-violet);
}
.cv-lost h1 {
  margin: 2rem 0 1rem; max-width: 16em;
  font: 300 clamp(2rem, 1.3rem + 2.6vw, 3.4rem)/1.05 var(--cv-serif); letter-spacing: -.02em; color: var(--cv-ink);
}
.cv-lost p { max-width: 36rem; color: var(--cv-soft); }
.cv-lost__links { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--cv-ink); }
.cv-lost__links a { font: 600 .75rem/1.4 var(--cv-sans); letter-spacing: .15em; text-transform: uppercase; text-decoration: none; color: var(--cv-ink); }
.cv-lost__links a:hover { color: var(--cv-violet-ink); }

/* ───────── footer / colophon ───────── */

.cv-foot { background: var(--cv-ink); color: #c9c9d3; }
.cv-foot__in { max-width: 86rem; margin-inline: auto; padding: 3rem var(--cv-edge) 2rem; }
.cv-foot .cv-foot__mark {
  margin: 0 0 2.25rem;
  font: 300 clamp(3.6rem, 1.5rem + 9vw, 9.5rem)/.9 var(--cv-serif); letter-spacing: -.035em; color: #fff;
}
.cv-foot__mark i { font-style: italic; color: var(--cv-violet-pale); }
.cv-foot__cols {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.75rem;
  padding-top: 1.25rem; border-top: 1px solid rgba(255, 255, 255, .25);
}
.cv-foot .cv-foot__k {
  margin: 0 0 .6rem;
  font: 600 .68rem/1.4 var(--cv-sans); letter-spacing: .16em; text-transform: uppercase; color: #8f8f9c;
}
.cv-foot ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
.cv-foot a { color: #fff; text-decoration-color: rgba(185, 171, 255, .7); }
.cv-foot a:hover { color: var(--cv-violet-pale); }
.cv-foot p { margin: 0; font-size: .9375rem; line-height: 1.6; }
.cv-foot .cv-foot__base {
  margin-top: 2.5rem; padding-top: 1rem;
  border-top: 1px solid rgba(255, 255, 255, .12);
  font-size: .8125rem; color: #8f8f9c;
}
@media (min-width: 45em) {
  .cv-foot__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; }
}
@media (min-width: 68.75em) {
  .cv-foot__in { padding-top: 4.5rem; }
  .cv-foot__cols { grid-template-columns: var(--cv-rail) minmax(0, var(--cv-measure)) minmax(12rem, 1fr); column-gap: var(--cv-gutter); }
}

@media print {
  .cv-mast, .cv-rail, .cv-runhead, .cv-copy, .cv-foot { display: none !important; }
  [data-part="cta"] { background: none !important; color: #000 !important; border: 2px solid #000; }
}

.cv-page__key::after { content: attr(data-key); }
