/* Reservoir Partners. Brand tokens and type as booking's pages (reservoir-booking
   static/app.css); layout rules as design partners-site.md §8.6: mobile first, one
   breakpoint at 768px, 44px targets, 16px form type, no horizontal scroll. */
@font-face { font-family: 'Stack Sans Headline'; src: url('fonts/StackSansHeadline-VariableFont_wght.ttf') format('truetype'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'Stack Sans Text'; src: url('fonts/StackSansText-VariableFont_wght.ttf') format('truetype'); font-weight: 100 900; font-display: swap; }
:root {
  --heartwood: #353223; --fieldstone: #AAA799; --umber: #382927; --sage: #85836D;
  --birch: #F3F2EC; --sand: #F1ECDE; --honey: #C8894A; --plum: #613249;
  --plum-text: #EAB5C2; --error: #CD3824; --hairline: #AAA799;
  --stack: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  --font-head: 'Stack Sans Headline', var(--stack);
  --font-text: 'Stack Sans Text', var(--stack);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--birch); color: var(--heartwood); font-family: var(--font-text); font-weight: 300; font-size: 17px; line-height: 1.55; -webkit-font-smoothing: antialiased; overflow-wrap: anywhere; }
h1 { font-family: var(--font-head); font-weight: 400; font-size: 28px; line-height: 34px; letter-spacing: -0.02em; margin: 0 0 12px; }
a { color: var(--plum); }
:focus-visible { outline: 2px solid var(--honey); outline-offset: 2px; }

.top { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 8px 16px; background: var(--birch); border-bottom: 1px solid var(--hairline); }
.top .wordmark { height: 22px; width: auto; }
.top .product { font-family: var(--font-head); font-size: 16px; color: var(--sage); }

main { padding: 24px 16px 48px; }
main.narrow { max-width: 480px; margin: 0 auto; }
.lead { font-size: 18px; }
.note { font-size: 15px; color: var(--sage); }

input, select, textarea { font-size: 16px; }
button, .cta { min-height: 44px; }

@media (min-width: 768px) {
  .top { padding: 8px 24px; }
  main { padding: 40px 24px 64px; }
}