/* Tapyns landings — minimal public reset + chrome (nav + footer).
   Loaded by both the editor canvas (so creator sees the same baseline) and
   the public render. Keep it tiny — block content brings its own styling. */

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #1f2937;
  background: #fff;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, video, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
/* Accessible focus ring — preserved on keyboard nav, hidden on mouse. */
:focus-visible { outline: 2px solid #5b8def; outline-offset: 2px; border-radius: 3px; }
/* FAQ accordion (uses native <details>) — hide default disclosure marker so
   the custom "+/-" sign in the summary is the only indicator. */
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }
details[open] > summary span { transform: rotate(45deg); display: inline-block; transition: transform .15s; }
details > summary span { display: inline-block; transition: transform .15s; }
/* Respect prefers-reduced-motion globally. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ─── Site navigation (auto-rendered when site has multiple nav pages) ─── */
.tpx-site-nav {
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  position: sticky; top: 0; z-index: 100;
}
.tpx-nav-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; gap: 20px; flex-wrap: wrap;
}
.tpx-nav-brand {
  font-weight: 700; font-size: 17px; color: #0f1020;
  text-decoration: none;
}
.tpx-nav-links {
  list-style: none; padding: 0; margin: 0;
  display: flex; gap: 18px; flex-wrap: wrap;
}
.tpx-nav-links a {
  color: #64748b; text-decoration: none; font-size: 14px; font-weight: 500;
  padding: 6px 0; border-bottom: 2px solid transparent; transition: color .15s, border-color .15s;
}
.tpx-nav-links a:hover { color: #0f1020; }
.tpx-nav-links a.active { color: #0f1020; border-bottom-color: #5b8def; }

/* ─── Footer (creator can disable per page via uses_site_footer) ─── */
.tpx-site-footer {
  background: #f8fafc; border-top: 1px solid #e5e7eb; margin-top: auto;
}
.tpx-footer-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px; gap: 14px; flex-wrap: wrap;
  color: #94a3b8; font-size: 13px;
}
.tpx-footer-powered a { color: #64748b; text-decoration: none; }
.tpx-footer-powered a:hover { text-decoration: underline; }

/* Page main wrapper — empty by default, lets blocks define their own padding. */
.tpx-page-main { display: block; }

/* Mobile nudge — collapse nav links to wrap nicely. */
@media (max-width: 600px) {
  .tpx-nav-inner { padding: 10px 16px; }
  .tpx-nav-links { gap: 12px; }
  .tpx-nav-links a { font-size: 13px; }
}