@font-face {
  font-family: "Amanda Sans";
  src: url("/static/fonts/geist-latin-wght-normal.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  color-scheme: light;
  font-family: "Amanda Sans", system-ui, sans-serif;
  color: #4c302b;
  background: #ddd0c4;
  font-synthesis: none;
  --ink: #4c302b;
  --muted: #73564c;
  --accent: #6b3e38;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 24px; }
body { margin: 0; }
a { color: inherit; }
a:focus-visible { outline: 3px solid #714c3e; outline-offset: 6px; }
.skip-link { position: absolute; left: 20px; top: -100px; z-index: 2; padding: 12px; background: #fff8f1; }
.skip-link:focus { top: 12px; }

.site-header {
  position: absolute;
  top: 0; left: 0; right: 0;
  max-width: 1440px;
  margin: auto;
  padding: 26px 6%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  z-index: 1;
}
.brand { display: block; width: 158px; height: 50px; }
.brand img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; }
.site-header nav { display: flex; align-items: center; gap: 30px; }
.site-header nav a { font-size: 14px; font-weight: 500; text-decoration: none; }
.site-header nav a:hover { text-decoration: underline; text-underline-offset: 5px; }
.site-header .account-link { border: 1px solid #a78c7b; border-radius: 999px; padding: 13px 20px; }
.account-link span { margin-left: 14px; }

.welcome {
  min-height: 100svh;
  padding: 152px 24px 42px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: radial-gradient(ellipse at 50% 43%, #fbf5ed 0%, #e8dccf 40%, #d2bfb0 76%, #bda494 100%);
}
.welcome-content { margin: auto 0; padding: 32px 0 52px; max-width: 760px; width: 100%; }
.eyebrow { margin: 0 0 27px; color: var(--muted); font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(32px, 3.5vw, 48px); font-weight: 400; line-height: 1.15; letter-spacing: -.045em; }
.hero-logo {
  display: block;
  width: min(560px, 100%);
  height: clamp(100px, 19vw, 164px);
  margin: 12px auto 16px;
  object-fit: cover;
  mix-blend-mode: multiply;
}
.tagline { margin: 0 0 17px; font-size: clamp(20px, 2vw, 27px); line-height: 1.35; letter-spacing: -.035em; }
.introduction { color: var(--muted); font-size: 16px; line-height: 1.75; margin: 0 auto; }
.welcome-actions { display: flex; justify-content: center; gap: 14px; margin-top: 32px; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 24px; min-height: 52px; min-width: 182px; padding: 13px 26px; border-radius: 999px; text-decoration: none; font-size: 14px; font-weight: 550; transition: background-color .15s ease; }
.button-primary { color: #fff9f2; background: var(--accent); border: 1px solid var(--accent); }
.button-primary:hover { background: #56312c; }
.button-secondary { background: #f8f1e8; border: 1px solid #ab9181; }
.button-secondary:hover { background: #fff9f2; }
.invitation-note { margin: 21px auto 0; font-size: 12px; line-height: 1.6; color: var(--muted); }
.explore-link { display: flex; align-items: center; gap: 16px; font-size: 12px; text-decoration: none; color: #63453c; padding: 12px; }
.explore-link:hover { text-decoration: underline; text-underline-offset: 5px; }

.about { max-width: 1180px; margin: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 100px; padding: 100px 44px; }
.about .eyebrow { margin-bottom: 22px; }
h2 { margin: 0 0 24px; font-size: clamp(30px, 3vw, 42px); font-weight: 450; line-height: 1.2; letter-spacing: -.045em; }
.about-heading>p:last-child { max-width: 40ch; color: #65493f; font-size: 15px; line-height: 1.8; }
.getting-started { list-style: none; margin: 0; padding: 0; }
.getting-started li { display: flex; gap: 23px; padding: 24px 0; border-top: 1px solid #b89f8e; }
.getting-started li:first-child { padding-top: 4px; border-top: 0; }
.step-number { padding-top: 4px; font-size: 12px; color: #77584c; }
h3 { margin: 0 0 9px; font-size: 17px; font-weight: 550; letter-spacing: -.015em; }
.getting-started p { margin: 0; font-size: 14px; line-height: 1.75; color: #65493f; }
.site-footer { max-width: 1350px; margin: auto; padding: 26px 44px 56px; display: flex; align-items: start; justify-content: space-between; gap: 36px; border-top: 1px solid #bda494; color: #65493f; }
.site-footer p { max-width: 70ch; font-size: 12px; line-height: 1.7; margin: 0; }
.site-footer a { font-size: 12px; white-space: nowrap; text-underline-offset: 4px; padding-top: 3px; }

@media (max-width: 680px) {
  .site-header { padding: 18px 20px; gap: 12px; }
  .brand { width: 116px; height: 40px; }
  .site-header nav { gap: 14px; }
  .site-header nav a { font-size: 12px; }
  .site-header .account-link { padding: 10px 13px; }
  .account-link span { margin-left: 4px; }
  .welcome { padding: 114px 25px 26px; min-height: 760px; min-height: max(760px, 100svh); }
  .welcome-content { padding: 30px 0 45px; }
  .eyebrow { font-size: 10px; letter-spacing: .14em; }
  .hero-logo { margin-top: 14px; margin-bottom: 22px; }
  .introduction { font-size: 14px; max-width: 33ch; }
  .desktop-break { display: none; }
  .welcome-actions { flex-direction: column; align-items: center; margin-top: 27px; gap: 12px; }
  .button { width: min(290px, 100%); }
  .invitation-note { max-width: 31ch; font-size: 11px; }
  .about { grid-template-columns: 1fr; gap: 35px; padding: 65px 27px 48px; }
  .site-footer { margin: 0 25px; padding: 23px 0 54px; flex-direction: column; gap: 16px; }
}
@media (max-width: 360px) {
  .site-header { padding: 16px 14px; }
  .site-header nav { gap: 10px; }
  .site-header nav a { font-size: 11px; }
  .brand { width: 100px; }
  .site-header .account-link { padding: 10px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .button { transition: none; } }