/* Shared site chrome: nav + footer used across landing, help, download, choose-plan, privacy, terms.
   Standalone — does not depend on app's style.css or landing's inline custom properties. */

.tyl-nav {
  position: sticky; top: 0; z-index: 100;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  padding: 0 40px;
}
.tyl-nav-inner {
  max-width: 1080px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  height: 64px;
  gap: 16px;
}
.tyl-nav-logo { display: flex; align-items: center; gap: 8px; text-decoration: none; }
.tyl-nav-logo-text { font-size: 17px; font-weight: 800; letter-spacing: -0.3px; }
.tyl-nav-logo-text .w-text { color: #1A1A1A; }
.tyl-nav-logo-text .w-your { color: #C44A76; }
.tyl-nav-right { display: flex; align-items: center; gap: 18px; }
.tyl-nav-link { font-size: 14px; font-weight: 500; color: #4b5563; text-decoration: none; }
.tyl-nav-link:hover { color: #1A1A1A; }
.tyl-nav-btn {
  display: inline-flex; align-items: center;
  padding: 9px 18px; border-radius: 8px;
  background: #C44A76; color: #fff;
  font-size: 14px; font-weight: 600;
  text-decoration: none;
}
.tyl-nav-btn:hover { background: #7a1d3e; }

@media (max-width: 640px) {
  .tyl-nav { padding: 0 16px; }
  .tyl-nav-inner { height: 56px; gap: 10px; }
  .tyl-nav-logo-text { font-size: 15px; }
  .tyl-nav-right { gap: 12px; }
  .tyl-nav-link[data-secondary] { display: none; }
}

.tyl-footer {
  background: #fff;
  border-top: 1px solid #e5e7eb;
  padding: 40px;
  margin-top: 60px;
}
.tyl-footer-inner {
  max-width: 1080px; margin: 0 auto;
  display: flex; flex-wrap: wrap; gap: 28px;
  align-items: flex-start; justify-content: space-between;
}
.tyl-footer-logo { display: flex; align-items: center; gap: 8px; text-decoration: none; }
.tyl-footer-logo-text { font-size: 15px; font-weight: 800; letter-spacing: -0.3px; }
.tyl-footer-logo-text .w-text { color: #1A1A1A; }
.tyl-footer-logo-text .w-your { color: #C44A76; }
.tyl-footer-links { display: flex; flex-direction: column; gap: 8px; }
.tyl-footer-links a { font-size: 13px; color: #4b5563; text-decoration: none; }
.tyl-footer-links a:hover { color: #1A1A1A; }
.tyl-footer-copy { font-size: 12px; color: #9ca3af; width: 100%; text-align: center; margin-top: 20px; }

@media (max-width: 640px) {
  .tyl-footer { padding: 32px 20px; }
  .tyl-footer-inner { flex-direction: column; gap: 20px; }
}