/* ============================================================
   FLYBITS BASE — light resets + brand defaults.
   Opt-in: apply .fb-root to a wrapper to get brand canvas/type.
   ============================================================ */
.fb-root{
  background:var(--surface-canvas);
  color:var(--text-body);
  font-family:var(--font-sans);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.fb-root h1,.fb-root h2,.fb-root h3,.fb-root h4{
  color:var(--text-strong);
  font-family:var(--font-display);
  font-weight:var(--fw-bold);
  line-height:var(--lh-heading);
  letter-spacing:var(--ls-heading);
  margin:0;
  text-wrap:balance;
}
.fb-root p{margin:0;text-wrap:pretty}
.fb-root a{color:var(--link);text-decoration:none;transition:color var(--dur-fast) var(--ease-standard)}
.fb-root a:hover{color:var(--link-hover)}

/* Type utility classes */
.fb-eyebrow{font-family:var(--font-sans);font-size:var(--fs-eyebrow);font-weight:var(--fw-semibold);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-accent)}
.fb-display-xl{font-family:var(--font-display);font-size:var(--fs-display-xl);font-weight:var(--fw-black);line-height:var(--lh-tight);letter-spacing:var(--ls-display)}
.fb-display{font-family:var(--font-display);font-size:var(--fs-display);font-weight:var(--fw-bold);line-height:var(--lh-tight);letter-spacing:var(--ls-display)}
.fb-serif{font-family:var(--font-serif)}
.fb-quote{font-family:var(--font-serif);font-style:italic;font-weight:var(--fw-medium);line-height:var(--lh-snug)}

/* Glass panel utility */
.fb-glass{
  background:var(--glass-fill);
  border:var(--glass-hairline);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
  border-radius:var(--radius-lg);
  position:relative;
}

/* Icon utility — recolours a stroke SVG to currentColor via mask.
   Usage: <span class="fb-icon" style="--icon:url(assets/icons/search.svg)"></span> */
.fb-icon{display:inline-block;width:1em;height:1em;flex:none;background-color:currentColor;-webkit-mask:var(--icon) center/contain no-repeat;mask:var(--icon) center/contain no-repeat}

/* Topographic canvas backdrop */
.fb-topo{
  background-color:var(--surface-canvas);
  background-image:var(--pattern-topo-dark);
  background-size:cover;
}

/* Focus visibility — WCAG */
.fb-root :focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:var(--radius-xs)}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
}