/* Valores compartidos: paleta, tipografía y ancho de página. */
:root {
  --paper:#faf7f1;
  --ink:#382b34;
  --muted:#71656a;
  --gold:#a68a58;
  --line:#ddd4c8;
  --serif:Georgia,'Times New Roman',serif;
  --sans:Arial,Helvetica,sans-serif;
  --width:1200px}

* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth;
  scroll-padding-top:25px}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.65}
a {
  color:inherit}
img {
  max-width:100%;
  height:auto;
  display:block}
h1,h2,h3,p {
  margin:0}
h1,h2,h3 {
  font-family:var(--serif);
  font-weight:400}
h1,h2 {
  letter-spacing:-.055em;
  line-height:1.04}
em {
  font-weight:400}
a {
  -webkit-tap-highlight-color:transparent}
a:focus-visible {
  outline:3px solid var(--gold);
  outline-offset:6px}
.wrap {
  width:min(var(--width),calc(100% - 96px));
  margin-inline:auto}
.eyebrow {
  font-size:10px;
  letter-spacing:.19em;
  font-weight:600}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:35px;
  padding:18px 24px;
  font-size:13px;
  text-decoration:none;
  border:1px solid var(--ink);
  transition:background .2s}
.primary {
  background:var(--ink);
  color:var(--paper)}
.primary:hover {
  background:#55404e}
.button span {
  font-size:21px}
.skip {
  position:absolute;
  left:15px;
  top:-100px;
  background:var(--paper);
  padding:12px;
  z-index:9}
.skip:focus {
  top:15px}
::selection {
  background:#d9c5ad;
  color:var(--ink)}
@media(max-width:700px) {
  .wrap {
  width:calc(100% - 40px)}
}
@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto}
* {
  transition:none!important}
}