:root {
  --ink: #14090B;
  --ink-2: #1D1014;
  --surface: #23141A;
  --surface-2: #2C1922;
  --uvita: #7C1F2E;
  --uvita-light: #A23545;
  --uvita-vivid: #C0394C;
  --brass: #D8B04A;
  --cream: #F2E7D0;
  --tin: #B6B0A6;
  --muted: #BFAE9F;
  --line: rgba(242, 231, 208, .16);
  --shadow: 0 24px 80px rgba(0,0,0,.34);
  --serif: "Playfair Display", Georgia, serif;
  --sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  color: var(--cream);
  background:
    radial-gradient(circle at 90% 5%, rgba(124,31,46,.26), transparent 30rem),
    radial-gradient(circle at 12% 20%, rgba(216,176,74,.07), transparent 28rem),
    var(--ink);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
a { color: inherit; }

h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--serif); }
h1 { font-size: clamp(2.8rem, 10vw, 7.5rem); line-height: .9; letter-spacing: -.045em; }
h2 { font-size: clamp(2rem, 5vw, 4.5rem); line-height: .96; letter-spacing: -.03em; }
h3 { font-size: clamp(1.25rem, 2vw, 1.8rem); }
p { line-height: 1.65; }

::selection { background: var(--cream); color: var(--ink); }

:focus-visible {
  outline: 3px solid var(--brass);
  outline-offset: 4px;
}

.skip-link {
  position: fixed;
  z-index: 999;
  left: 1rem;
  top: .75rem;
  padding: .75rem 1rem;
  background: var(--cream);
  color: var(--ink);
  text-decoration: none;
  transform: translateY(-200%);
}
.skip-link:focus { transform: translateY(0); }

.eyebrow {
  margin-bottom: 1rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--brass);
}