/* ============================================================================
   Nuvia — Base layer (DS §3 typography, §8 motion, §9 a11y)
   Reset + typographic defaults + focus ring + reduced-motion, all scoped under
   `.nuvia` so nothing here touches the legacy Able Pro screens.
   ============================================================================ */

/* Drop the UA default body margin/padding — only loaded by Nuvia pages. */
body {
  margin: 0;
  padding: 0;
}

/* The wrapper itself paints the page background and sets the body font. */
.nuvia {
  background: var(--b-bg-page);
  color: var(--b-ink-700);
  font: var(--b-font-body-l);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height: 100vh;
}

/* Scoped, gentle reset — only inside .nuvia. */
.nuvia *,
.nuvia *::before,
.nuvia *::after {
  box-sizing: border-box;
}

.nuvia h1,
.nuvia h2,
.nuvia h3,
.nuvia h4 {
  margin: 0;
  font-family: var(--b-display);
  font-weight: var(--b-display-weight);
  letter-spacing: var(--b-display-letter);
  color: var(--b-ink-900);
  line-height: 1.1;
}

/* §3.2 — the display italic is reserved for accent words and emotional
   captions, rendered with terracotta (default) or a mustard override. */
.nuvia h1 em,
.nuvia h2 em,
.nuvia h3 em {
  font-style: var(--b-display-em-style);
  color: var(--b-terracotta-500);
}

.nuvia p { margin: 0; }

.nuvia a {
  color: var(--b-terracotta-600);
  text-decoration: none;
}
.nuvia a:hover { color: var(--b-terracotta-700); }

.nuvia img { max-width: 100%; display: block; }

.nuvia ul,
.nuvia ol { margin: 0; padding: 0; list-style: none; }

.nuvia button {
  font-family: inherit;
  cursor: pointer;
}

.nuvia ::selection { background: var(--b-selection-bg); }

/* §9 — focus ring is always visible on interactive elements. */
.nuvia a:focus-visible,
.nuvia button:focus-visible,
.nuvia input:focus-visible,
.nuvia select:focus-visible,
.nuvia textarea:focus-visible,
.nuvia [tabindex]:focus-visible {
  outline: 2px solid var(--b-focus-ring);
  outline-offset: 2px;
}

/* §8 — calm transitions; never aggressive entrances. */
.nuvia .fade-in { animation: nuvia-fade-in 0.2s ease both; }

@keyframes nuvia-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* §9 — honour reduced-motion: opacity only, no transforms/animations. */
@media (prefers-reduced-motion: reduce) {
  .nuvia *,
  .nuvia *::before,
  .nuvia *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .nuvia [data-motion-transform] { transform: none !important; }
}

/* Utility: visually-hidden label kept accessible to screen readers. */
.nuvia .sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}