/* Postnama design tokens and shared styles
   Lapis + marigold: the pigments of illuminated manuscripts, for a product
   named after the chronicle ("nama") it writes for each brand. */
:root{
  --lapis:#3337E0; --lapis-2:#4A4EF0; --lapis-soft:#E8E9FF;
  --night:#13154A; --night-2:#1B1E52;
  --marigold:#FFB627; --marigold-2:#FFCA5C;
  --vellum:#F4F5FF; --card:#FFFFFF; --mist:#E1E3F5;
  --ink:#13154A; --ink-2:#454A78; --muted:#6E7299;
  --leaf:#14A37F; --rose:#E5484D;
  --r-lg:22px; --r-md:14px; --r-sm:10px;
  --shadow:0 18px 40px -22px rgba(16,18,59,.45);
  --font-display:"Bricolage Grotesque",system-ui,sans-serif;
  --font-body:"Onest",system-ui,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --vellum:#0D0F30; --card:#161942; --mist:#272B63;
    --ink:#EEF0FF; --ink-2:#BFC3EA; --muted:#8C90BF; --lapis-soft:#222672;
  }
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--vellum);color:var(--ink);font:16px/1.6 var(--font-body);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--marigold);outline-offset:2px;border-radius:6px}
.wrap{max-width:1140px;margin:0 auto;padding:0 20px}
h1,h2,h3{font-family:var(--font-display);letter-spacing:-.02em;line-height:1.05}
h2{font-size:clamp(32px,4.4vw,52px);font-weight:700}
h3{font-size:21px;font-weight:650;letter-spacing:-.01em;line-height:1.2}
.lead{font-size:19px;color:var(--ink-2);max-width:38em}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* logo */
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--font-display);font-weight:750;font-size:23px;letter-spacing:-.03em}
.logo svg{width:34px;height:34px;flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;text-decoration:none;
  font:600 15.5px var(--font-body);padding:13px 20px;border-radius:999px;transition:transform .15s ease, background .15s ease}
.btn:active{transform:translateY(1px)}
.btn-gold{background:var(--marigold);color:var(--night)}
.btn-gold:hover{background:var(--marigold-2)}
.btn-lapis{background:var(--lapis);color:#fff}
.btn-lapis:hover{background:var(--lapis-2)}
.btn-ghost{background:transparent;color:inherit;border:1.5px solid currentColor}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* inputs */
.field{display:block;margin-bottom:14px}
.field span{display:block;font-size:14px;font-weight:600;margin-bottom:6px}
.field small{display:block;color:var(--muted);font-size:13px;margin-top:5px}
.input{width:100%;padding:13px 15px;border-radius:var(--r-sm);border:1.5px solid var(--mist);background:var(--card);color:var(--ink);font:inherit}
.input:focus{outline:none;border-color:var(--lapis)}
textarea.input{min-height:96px;resize:vertical}