:root {
    --cv-ink: #2f3337;
    --cv-red: #ba0c2f;
    --cv-red-dark: #8f0924;
    --cv-blush: #fff0f3;
    --cv-cream: #f8f8f6;
    --cv-silver: #eef0f1;
    --cv-line: #d8dadd;
    --cv-muted: #626a71;
    --cv-shadow: 0 10px 28px rgba(47, 51, 55, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: radial-gradient(circle at top, #fff 0%, var(--cv-cream) 48%, var(--cv-silver) 100%); color: var(--cv-ink); font-family: Arial, sans-serif; }
.cv-skip { position: absolute; left: -9999px; }
.cv-skip:focus { left: 1rem; top: 1rem; z-index: 100; border: 1px solid var(--cv-red); padding: .8rem; background: #fff; }

.cv-header { position: sticky; z-index: 50; top: 0; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--cv-line); padding: 1rem max(1.25rem, calc((100vw - 1180px) / 2)); background: rgba(255, 255, 255, .96); backdrop-filter: blur(8px); }
.cv-brand { display: flex; gap: .8rem; align-items: center; color: inherit; text-decoration: none; }
.cv-brand:hover { text-decoration: none; }
.cv-brand img { display: block; width: 290px; max-width: 46vw; height: 68px; object-fit: contain; object-position: left center; }
.cv-brand > span { display: grid; place-items: center; width: 58px; height: 58px; border: 2px solid var(--cv-red); border-radius: 8px; background: #fff; color: var(--cv-red-dark); box-shadow: var(--cv-shadow); font: 700 1.05rem Georgia, "Times New Roman", serif; }
.cv-brand strong { font: 600 1.15rem/1.05 Georgia, "Times New Roman", serif; }
.cv-header nav { display: flex; gap: .55rem; align-items: center; }
.cv-header nav a { border: 1px solid var(--cv-line); border-radius: 999px; padding: .65rem .9rem; background: #fff; color: var(--cv-ink); font-size: .84rem; font-weight: 700; text-decoration: none; }
.cv-header nav a:hover, .cv-header nav a:focus-visible { border-color: var(--cv-red); background: var(--cv-blush); color: var(--cv-red-dark); }
.cv-header nav .cv-nav-cta { border-color: var(--cv-red); background: var(--cv-red); color: #fff; }

main { max-width: 1180px; margin: auto; padding: 2rem; }
.cv-hero { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 2rem; align-items: center; border: 1px solid var(--cv-line); border-radius: 18px; padding: clamp(2rem, 5vw, 3.5rem); background: linear-gradient(135deg, #fff 0%, #fff5f6 52%, var(--cv-silver) 100%); box-shadow: var(--cv-shadow); }
.cv-eyebrow { margin: 0 0 1rem; color: var(--cv-red); font-size: .73rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.cv-hero h1 { max-width: 720px; margin: 0 0 1rem; font: normal clamp(3.3rem, 6vw, 5.8rem)/.94 Georgia, "Times New Roman", serif; letter-spacing: -.045em; }
.cv-lede { max-width: 720px; margin: 0; color: #4d555c; font-size: 1.1rem; line-height: 1.75; }
.cv-actions { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; margin-top: 1.5rem; }
.cv-button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; border: 1px solid var(--cv-red); border-radius: 8px; padding: .75rem 1.1rem; background: var(--cv-red); color: #fff; font-weight: 800; text-decoration: none; }
.cv-button:hover, .cv-button:focus-visible { background: var(--cv-red-dark); text-decoration: none; }
.cv-button--quiet { background: #fff; color: var(--cv-red-dark); }
.cv-text-link { color: var(--cv-red-dark); font-weight: 800; text-underline-offset: 4px; }
.cv-status { margin: 1.5rem 0 0; color: var(--cv-muted); font-size: .82rem; }
.cv-status span { display: inline-block; width: 8px; height: 8px; margin-right: .45rem; border-radius: 50%; background: var(--cv-red); }

.cv-hero-card { display: grid; grid-template-columns: 1fr auto 1fr; gap: .65rem; align-items: center; border: 1px solid var(--cv-line); border-radius: 14px; padding: 1.5rem; background: #fff; }
.cv-party { text-align: center; }
.cv-party > span { display: grid; place-items: center; width: 66px; height: 66px; margin: 0 auto 1rem; border: 2px solid var(--cv-red); border-radius: 8px; background: var(--cv-blush); color: var(--cv-red-dark); font: normal 1.8rem Georgia, serif; }
.cv-party--right > span { background: var(--cv-silver); }
.cv-party strong, .cv-party small { display: block; }
.cv-party small, .cv-proof small { margin-top: .35rem; color: var(--cv-muted); font-size: .68rem; }
.cv-proof { color: var(--cv-red); text-align: center; }
.cv-proof span { display: block; color: var(--cv-muted); font-size: .63rem; }
.cv-proof strong { display: block; margin: .45rem; font-size: 1.5rem; }
.cv-hero-card > p { grid-column: 1 / -1; margin: 1.5rem 0 0; border-top: 1px solid var(--cv-line); padding-top: 1.1rem; text-align: center; font: italic 1.15rem Georgia, serif; }

.cv-principles, .cv-flow, .cv-standards { padding: 4rem 0; }
.cv-principles h2, .cv-flow h2, .cv-standards h2, .cv-boundary h2, .cv-origin h2 { max-width: 760px; margin: .2rem 0 1rem; font: normal clamp(2.1rem, 4vw, 3.5rem)/1.05 Georgia, "Times New Roman", serif; letter-spacing: -.03em; }
.cv-principle-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 2rem; }
.cv-principle-grid article, .cv-standard-grid a { border: 1px solid var(--cv-line); border-radius: 8px; padding: 1.5rem; background: #fff; box-shadow: var(--cv-shadow); }
.cv-principle-grid span { color: var(--cv-red); font: italic 1rem Georgia, serif; }
.cv-principle-grid h3 { margin: 1.5rem 0 .6rem; font: normal 1.35rem Georgia, serif; }
.cv-principle-grid p, .cv-flow > div > p, .cv-standards > div > p, .cv-origin p { color: var(--cv-muted); line-height: 1.65; }

.cv-flow { border-top: 1px solid var(--cv-line); }
.cv-flow ol { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin: 2.5rem 0 0; padding: 0; list-style: none; }
.cv-flow li { border: 1px solid var(--cv-line); border-radius: 8px; padding: 1.35rem; background: #fff; box-shadow: var(--cv-shadow); }
.cv-flow li > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: var(--cv-red); color: #fff; font-weight: 800; }
.cv-flow strong { display: block; margin-top: 1.15rem; font: normal 1.2rem Georgia, serif; }
.cv-flow li p { color: var(--cv-muted); font-size: .9rem; line-height: 1.55; }

.cv-standards { display: grid; grid-template-columns: .75fr 1.25fr; gap: 3rem; align-items: start; }
.cv-standard-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.cv-standard-grid a { color: inherit; text-decoration: none; transition: .18s ease; }
.cv-standard-grid a:hover, .cv-standard-grid a:focus-visible { border-color: var(--cv-red); background: var(--cv-blush); transform: translateY(-2px); }
.cv-standard-grid span, .cv-standard-grid strong, .cv-standard-grid small { display: block; }
.cv-standard-grid span { color: var(--cv-red); font-size: .7rem; font-weight: 900; letter-spacing: .1em; }
.cv-standard-grid strong { margin: .65rem 0 .3rem; font: normal 1.2rem Georgia, serif; }
.cv-standard-grid small { color: var(--cv-muted); }

.cv-boundary { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; border: 1px solid var(--cv-line); border-radius: 18px; padding: clamp(2rem, 5vw, 3rem); background: linear-gradient(135deg, #fff, #fff5f6); box-shadow: var(--cv-shadow); }
.cv-boundary > p { border-left: 3px solid var(--cv-red); padding-left: 1.25rem; color: #4d555c; line-height: 1.75; }
.cv-origin { display: flex; justify-content: space-between; gap: 3rem; align-items: center; margin: 2rem 0; border: 1px solid var(--cv-line); border-radius: 18px; padding: clamp(2rem, 5vw, 3rem); background: #fff; box-shadow: var(--cv-shadow); }
.cv-origin > div { max-width: 760px; }

footer { margin-top: 3rem; border-top: 3px solid var(--cv-red); padding: 3rem 2rem; background: var(--cv-ink); color: #fff; text-align: center; }
footer p, footer small { color: #d8dadd; }
footer a { color: #fff; }

@media (max-width: 820px) {
    .cv-header nav > a:not(.cv-nav-cta) { display: none; }
    .cv-hero, .cv-standards, .cv-boundary { grid-template-columns: 1fr; }
    .cv-principle-grid, .cv-flow ol { grid-template-columns: 1fr; }
    .cv-origin { align-items: flex-start; flex-direction: column; }
    .cv-standard-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
    .cv-header { padding: .8rem 1rem; }
    .cv-brand img { width: 205px; max-width: 58vw; height: 52px; }
    .cv-brand > span { width: 48px; height: 48px; }
    .cv-brand strong { font-size: .85rem; }
    main { padding: 1rem; }
    .cv-hero { padding: 1.5rem; }
    .cv-hero h1 { font-size: 3.15rem; }
    .cv-actions { align-items: stretch; flex-direction: column; }
    .cv-hero-card { grid-template-columns: 1fr; }
    .cv-proof { padding: .5rem 0; }
    .cv-proof strong { transform: rotate(90deg); }
    .cv-hero-card > p { grid-column: 1; }
}
