:root {
  --bg: #F5EFE3;
  --bg-tint: #EDE5D2;
  --surface: #FFFFFF;
  --surface-2: #FBF6EA;
  --ink: #181818;
  --ink-2: #545159;
  --ink-3: #8A8590;
  --line: #E6DEC8;
  --line-2: #EFE7D2;

  --coral: #FF5C4D;
  --coral-deep: #E84A3C;
  --coral-tint: #FFE7E1;
  --sun: #FFC53D;
  --sun-tint: #FFF1CB;
  --mint: #1FB295;
  --mint-tint: #E0F1EC;
  --sky: #6FA8E0;
  --sky-tint: #E7F0FB;
  --pink: #F08DB8;
  --pink-tint: #FBE4ED;
  --plum: #4C3A5C;

  --f-head: "Roboto", -apple-system, "Segoe UI", sans-serif;
  --f-serif: "Instrument Serif", "Times New Roman", serif;
  --f-sans: "Roboto", -apple-system, "Segoe UI", sans-serif;
  --f-mono: "Roboto Mono", ui-monospace, monospace;
  --f-mark: var(--f-head);
  --h-weight: 700;
  --h-spacing: -0.03em;
  --h-italic: normal;
  --pad-scale: 1;

  --r-xs: 10px;
  --r-sm: 14px;
  --r: 20px;
  --r-lg: 28px;
  --r-xl: 40px;

  --sh-xs: 0 1px 2px rgba(26,26,31,.04);
  --sh-sm: 0 4px 16px -6px rgba(26,26,31,.08);
  --sh-md: 0 16px 48px -16px rgba(26,26,31,.18);
  --sh-lg: 0 30px 80px -24px rgba(26,26,31,.25);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--bg); color: var(--ink); }
body {
  font-family: var(--f-sans);
  font-size: 17px;
  line-height: 1.6;
  letter-spacing: -0.003em;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; border: 0; background: 0; padding: 0; color: inherit; }
input, textarea { font-family: inherit; }
a { color: inherit; text-decoration: none; cursor: pointer; }

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

.serif {
  font-family: var(--f-head);
  font-weight: 400;
  letter-spacing: -0.015em;
  line-height: 1.04;
}

.eyebrow {
  font-family: var(--f-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-2);
}

.reveal { opacity: 1; transform: none; transition: opacity .85s cubic-bezier(.2,.7,.2,1), transform .85s cubic-bezier(.2,.7,.2,1); transition-delay: var(--rd, 0ms); }
.reveal.pre { opacity: 0; transform: translateY(22px); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--f-sans);
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  padding: 13px 22px;
  border-radius: 999px;
  transition: transform .2s, box-shadow .2s, background .2s, color .2s, border-color .2s;
  white-space: nowrap;
  border: 1px solid transparent;
}
.btn-ink { background: var(--ink); color: var(--bg); }
.btn-ink:hover { transform: translateY(-1px); box-shadow: var(--sh-md); }
.btn-coral { background: var(--coral); color: #fff; font-weight: 600; }
.btn-coral:hover { background: var(--coral-deep); transform: translateY(-1px); box-shadow: 0 14px 30px -10px rgba(255,92,77,.5); }
.btn-outline { background: var(--surface); border: 1px solid var(--line); color: var(--ink); }
.btn-outline:hover { border-color: var(--ink); }
.btn-ghost { color: var(--ink-2); padding: 12px 16px; }
.btn-ghost:hover { color: var(--ink); }
.btn-lg { padding: 17px 28px; font-size: 16px; }
.btn-sm { padding: 9px 16px; font-size: 13px; }
.btn-block { width: 100%; }
.is-disabled { opacity: .5; pointer-events: none; }

.logo {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--ink);
  white-space: nowrap;
}
.logo-lockup {
  height: 30px;
  width: auto;
  display: block;
}
