/* Tally site — shared shell.
   Every component's own styling is inline on the element, exactly as designed;
   this file carries only what cannot be: the reset, the type stack, link and
   hover states, and the responsive collapse. Palette from Tally/Design/Theme.swift. */

html { scroll-padding-top: 88px; scroll-behavior: smooth; }

* { box-sizing: border-box; }

body {
  margin: 0;
  background: #f5f1ec;
  color: #1b1815;
  font-family: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: #2f5d4e; text-decoration: none; }
a:hover { color: #24473c; }

.btn-accent:hover { background: #24473c; color: #fffefc; }
.btn-cream:hover { background: #fffefc; color: #264c40; }
.btn-ghost:hover { background: #faf7f3; color: #1b1815; }

img { max-width: 100%; }

@media (max-width: 980px) {
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  [style*="width:390px"] { width: 100% !important; max-width: 390px !important; justify-self: start !important; }
  [style*="position:sticky;top:96px"] { position: static !important; max-height: none !important; }
  [style*="font-size:60px"] { font-size: 42px !important; }
  [style*="font-size:48px"] { font-size: 36px !important; }
  [style*="font-size:44px"] { font-size: 34px !important; }
  [style*="font-size:38px"] { font-size: 30px !important; }
}

@media (max-width: 640px) {
  nav [style*="gap:26px"] { gap: 16px !important; }
  [style*="padding:0 32px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding:76px 32px 40px"],
  [style*="padding:64px 32px 0"] { padding-left: 20px !important; padding-right: 20px !important; }
}