/* Public site shell. Loaded after tokens/base/components. */
.na-site { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; background: var(--na-surface); }

.na-site-container { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 var(--na-gutter); }

.na-site-header {
  position: sticky;
  top: 0;
  z-index: 1020;
  background-color: rgba(255, 255, 255, 0.8);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--na-line);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .na-site-header { background-color: var(--na-surface); }
}

@media (prefers-reduced-transparency: reduce) {
  .na-site-header { background-color: var(--na-surface); -webkit-backdrop-filter: none; backdrop-filter: none; }
}

.na-site-bar { display: flex; align-items: center; gap: var(--na-space-3); min-height: 64px; }
.na-site-bar .na-logo { margin-right: auto; }
.na-site-login { font-weight: 600; min-height: var(--na-control-h); display: inline-flex; align-items: center; padding: 0 var(--na-space-2); }

@media (max-width: 575.98px) {
  .na-site-bar { gap: var(--na-space-2); }
  .na-site-bar .na-site-cta { display: none; }
}

.na-site-main { flex: 1 1 auto; }

.na-hero { padding: var(--na-space-9) 0 var(--na-space-8); }
.na-hero-eyebrow { margin-bottom: var(--na-space-3); font-size: var(--na-fs-subhead); font-weight: 600; color: var(--na-accent); }
.na-hero-title { max-width: 18ch; margin-bottom: var(--na-space-4); font-size: clamp(2.125rem, 1.6rem + 2.4vw, 3.25rem); font-weight: 700; line-height: 1.1; letter-spacing: -0.025em; }
:lang(ne) .na-hero-title { max-width: 22ch; line-height: 1.3; letter-spacing: 0; }
.na-hero-text { max-width: 58ch; margin-bottom: var(--na-space-6); font-size: 1.1875rem; line-height: 1.6; color: var(--na-muted); }
.na-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--na-space-3); }
.na-hero-note { margin: var(--na-space-4) 0 0; font-size: var(--na-fs-footnote); color: var(--na-muted); }

@media (max-width: 575.98px) {
  .na-hero { padding: var(--na-space-7) 0 var(--na-space-6); }
  .na-hero-actions .btn-primary { flex: 1 1 100%; }
}

.na-site-section { padding: var(--na-space-8) 0; border-top: 1px solid var(--na-line); }
.na-site-section-title { margin-bottom: var(--na-space-2); font-size: var(--na-fs-title1); font-weight: 700; letter-spacing: -0.02em; }
:lang(ne) .na-site-section-title { letter-spacing: 0; }
.na-site-section-lead { max-width: 60ch; margin-bottom: var(--na-space-6); color: var(--na-muted); }

/* Feature list: plain two-column rows with hairlines, no decorative cards. */
.na-feature-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--na-space-7); }
.na-feature { display: flex; gap: var(--na-space-4); padding: var(--na-space-5) 0; border-top: 1px solid var(--na-line); }
.na-feature .na-icon { width: 24px; height: 24px; color: var(--na-accent); margin-top: 2px; }
.na-feature-title { margin-bottom: 4px; font-size: var(--na-fs-headline); font-weight: 600; }
.na-feature-text { margin: 0; color: var(--na-muted); }

@media (max-width: 767.98px) {
  .na-feature-list { grid-template-columns: minmax(0, 1fr); }
}

/* Numbered steps drawn with a CSS counter, so the numbers are not read twice by screen readers. */
.na-steps { list-style: none; margin: 0; padding: 0; counter-reset: na-step; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--na-space-5); }
.na-step { counter-increment: na-step; padding-top: var(--na-space-4); border-top: 1px solid var(--na-line); }
.na-step::before {
  content: counter(na-step);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-bottom: var(--na-space-3);
  border-radius: 50%;
  background: var(--na-accent-soft);
  color: var(--na-accent-press);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 991.98px) {
  .na-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
  .na-steps { grid-template-columns: minmax(0, 1fr); }
}

.na-contact-block { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--na-space-4); padding: var(--na-space-5); background: var(--na-bg); border-radius: var(--na-radius-card); }
.na-contact-block .na-contact { font-size: 1.0625rem; font-weight: 600; }

.na-site-footer { padding: var(--na-space-6) 0 var(--na-space-7); background: var(--na-bg); border-top: 1px solid var(--na-line); font-size: var(--na-fs-footnote); color: var(--na-muted); }
.na-site-footer-grid { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--na-space-5); }
.na-site-footer a { color: var(--na-text-secondary); }
.na-site-footer a:hover { color: var(--na-accent-hover); }
.na-footer-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 20px; }
.na-footer-links a, .na-footer-links button { display: inline-flex; align-items: center; min-height: 32px; }
.na-footer-links button { padding: 0; border: 0; background: none; color: var(--na-text-secondary); font: inherit; cursor: pointer; }
.na-footer-links button:hover { color: var(--na-accent-hover); text-decoration: underline; }
.na-site-footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--na-space-3); margin-top: var(--na-space-5); padding-top: var(--na-space-4); border-top: 1px solid var(--na-line); }