/* The gate: splash, password, request, agreement. Same house as the shell. */
:root {
  --bg: #F6F1E7; --bg-2: #EDE6D8; --ink: #2B2722; --ink-2: #6E675C; --ink-3: #9A9285;
  --rule: #D8CFBF; --accent: #7C8B6F; --accent-ink: #4B5942; --focus: #4B5942;
  --display: "Cormorant Garamond", Garamond, Georgia, serif; --script: "Pinyon Script", "Snell Roundhand", cursive; --body: "Jost", "Helvetica Neue", Arial, sans-serif; --mono: "Jost", "Helvetica Neue", Arial, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--body); font-size: 1rem; line-height: 1.55; min-height: 100%; -webkit-font-smoothing: antialiased; }
body.gate { display: grid; place-items: center; min-height: 100vh; padding: clamp(1.25rem, 4vw, 3rem); }
a { color: inherit; text-decoration-color: var(--accent); text-underline-offset: .18em; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
h1, h2, h3 { font-family: var(--display); font-weight: 400; line-height: 1.08; letter-spacing: 0; margin: 0 0 .5em;  }
h1 { font-size: clamp(2rem, 5vw, 3.25rem); }
h2 { font-size: 1.5rem; margin-top: 2rem; }
p { margin: 0 0 1em; }
.eyebrow, .mono, label, .btn, .tag { font-family: var(--mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow { color: var(--ink-2); margin-bottom: .75rem; }
.mono { text-transform: none; letter-spacing: .02em; }
.muted { color: var(--ink-2); }
.gate-card { width: min(100%, 560px); }
.gate-card.wide { width: min(100%, 900px); }
.gate-card.full { width: min(100%, 1100px); }
.logo { color: var(--ink); display: block; }
.logo svg, .logo img { width: 100%; height: auto; display: block; }

/* Splash */
.splash { text-align: center; display: grid; gap: 2rem; justify-items: center; }
.splash .logo { width: min(72vw, 680px); opacity: 0; transform: translateY(8px); animation: rise 1.2s cubic-bezier(.22,1,.36,1) .2s forwards; }
.splash .lib { font-family: var(--script); font-size: clamp(2rem, 4vw, 3rem) !important; font-size: clamp(1.25rem, 2.5vw, 1.6rem); color: var(--ink-2);  opacity: 0; animation: rise 1s cubic-bezier(.22,1,.36,1) .7s forwards; }
.splash .enter { opacity: 0; animation: rise 1s cubic-bezier(.22,1,.36,1) 1.1s forwards; }
@keyframes rise { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .splash .logo, .splash .lib, .splash .enter { animation: none; opacity: 1; transform: none; } }

/* Forms */
.btn { display: inline-flex; align-items: center; gap: .5rem; padding: .85rem 1.25rem; border: 1px solid var(--ink); border-radius: 4px; background: var(--ink); color: var(--bg); text-decoration: none; cursor: pointer; line-height: 1; }
.btn:hover { background: var(--accent-ink); border-color: var(--accent-ink); }
.btn.ghost { background: transparent; color: var(--ink); }
.btn.ghost:hover { background: var(--ink); color: var(--bg); }
.field { margin: 0 0 1.1rem; }
.field label { display: block; color: var(--ink-2); margin-bottom: .4rem; }
.field input[type=text], .field input[type=email], .field input[type=password], .field textarea { width: 100%; font: inherit; font-size: 1.05rem; padding: .75rem .9rem; border: 1px solid var(--rule); border-radius: 4px; background: #fff; color: var(--ink); }
.field textarea { min-height: 6rem; resize: vertical; }
.field input:focus-visible, .field textarea:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-color: var(--accent-ink); }
.field small { display: block; color: var(--ink-2); font-size: .85rem; margin-top: .35rem; }
.check { display: grid; grid-template-columns: auto 1fr; gap: .75rem; align-items: start; margin: 0 0 1rem; font-size: .95rem; }
.check input { width: 1.1rem; height: 1.1rem; margin-top: .2rem; accent-color: var(--accent-ink); }
.radios { display: flex; gap: 1.25rem; flex-wrap: wrap; margin-bottom: 1rem; font-size: .95rem; }
.radios label { text-transform: none; letter-spacing: 0; font-family: var(--body); font-size: .95rem; display: inline-flex; gap: .5rem; align-items: center; }
.actions { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; margin-top: 1.5rem; }
.error { border-left: 2px solid #A64B3B; padding: .4rem .9rem; color: #7A3328; background: rgba(166,75,59,.08); margin-bottom: 1.25rem; font-size: .95rem; }
.card { background: rgba(255,253,248,.72); border: 1px solid rgba(43,39,34,.08); border-radius: 10px; padding: clamp(1.25rem, 4vw, 2.25rem); backdrop-filter: blur(6px); }
.head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 2rem; }
.head .logo { width: 120px; }
.hp { position: absolute; left: -9999px; }

/* Agreement */
.agreement { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.agreement nav { position: sticky; top: 1rem; font-size: .85rem; }
.agreement nav a { display: block; padding: .35rem 0; border-bottom: 1px solid var(--rule); text-decoration: none; color: var(--ink-2); }
.agreement nav a:hover { color: var(--ink); }
.particulars { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 2rem; border-top: 1px solid var(--ink); padding-top: 1rem; margin: 1rem 0 2rem; }
.particulars div { font-size: .95rem; }
.particulars .eyebrow { margin-bottom: .2rem; }
.clause { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: .5rem 1rem; margin: .6rem 0; }
.clause .n { font-family: var(--mono); font-size: .8rem; color: var(--accent-ink); padding-top: .25em; }
.clause .n.sub { padding-left: 1rem; }
.clause p { margin: 0; }
.sec { margin-top: 2.25rem; }
.sec h2 { font-size: 1.3rem; margin: 0 0 .25rem; }
.sec .eyebrow { margin-bottom: .1rem; }
.end { font-family: var(--mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); text-align: center; margin: 3rem 0; }
.sigblock { border-top: 2px solid var(--ink); padding-top: 1.5rem; margin-top: 2rem; }
table { width: 100%; border-collapse: collapse; font-size: .85rem; margin: .5rem 0 1.5rem; }
th, td { text-align: left; vertical-align: top; padding: .5rem .4rem; border-bottom: 1px solid var(--rule); }
th { font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); font-weight: 400; }
@media (max-width: 760px) { .agreement { grid-template-columns: 1fr; } .agreement nav { position: static; display: none; } .particulars { grid-template-columns: 1fr; } }