/* Modern buttons and nav (Rurik, 2026-10-11): 14px Synapse Medium for the
   nav and most buttons, shorter boxes, one 8px radius; kit colours and
   hovers unchanged. This deliberately updates the brand hub's Button style
   (16px Medium).

     Lead CTAs (hero pair, final demo band)   44px, 0/20 padding, 15px
     Page buttons, Connect field + button     40px, 0/18 padding, 14px
     Header pair, newsletter                  36px, 0/14 padding, 14px
     Nav items                                14px Medium

   Scoped to <body class="btn-tight">, so only pages that opt in change
   (homepage first; port by adding the class and this file). Loaded after
   the page styles. The header's sizes live in css/header.css. */

/* ---------- Page buttons ---------- */

.btn-tight :is(.btn-citron, .btn-demo-white, .btn-primary, .btn-gradient, .btn-outline-teal) {
  min-height: 40px;
  height: 40px;
  gap: 8px;
  padding: 0 18px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.1;
}

/* The 1px border counts inside the height. */
.btn-tight :is(.btn-gradient, .btn-outline-teal) { padding: 0 17px; }

/* Lead CTAs stay a step larger so they still lead. */
.btn-tight :is(.hero-actions, .demo-section) :is(.btn-citron, .btn-demo-white, .btn-primary, .btn-gradient, .btn-outline-teal) {
  min-height: 44px;
  height: 44px;
  padding: 0 20px;
  font-size: 15px;
}

.btn-tight :is(.hero-actions, .demo-section) :is(.btn-gradient, .btn-outline-teal) { padding: 0 19px; }

/* Connect section: the email field and its button sit side by side. */
.btn-tight .connect-embed .email-input { height: 40px; }

.btn-tight .connect-embed .connect-btn {
  height: 40px;
  padding: 0 18px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.1;
}

/* ---------- Header ---------- */
/* The header's nav and buttons moved to css/header.css (2026-10-11): they
   follow the shared header onto every page, not just pages with this class. */

/* Footer newsletter: the button sits below its field. */
.btn-tight .sf-news-form .mktoButton {
  height: 36px;
  padding: 0 14px;
  border-radius: 8px;
  font: 500 14px/1.1 'Synapse', 'Inter', sans-serif;
}
