@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');
/* The Google Fonts @import must stay the very first line, above any comment: an
   @import that follows anything else gets dropped (this once left the public pages on fallback fonts). */
@import "tailwindcss";
@plugin "daisyui" {
  themes: false; /* only the two custom "trove"/"trove-dark" themes in theme.css — no daisyUI built-ins */
}
@import "./theme.css";
/* Lexxy's npm package doesn't export its CSS, so it's imported by path. */
@import "../../../node_modules/@37signals/lexxy/dist/stylesheets/lexxy-variables.css";
@import "../../../node_modules/@37signals/lexxy/dist/stylesheets/lexxy-content.css";
@import "../../../node_modules/@37signals/lexxy/dist/stylesheets/lexxy-editor.css";
@import "./lexxy_theme.css";

  /* Sidebar state. #nav-toggle is the hidden checkbox in the vendor layout.
     Unchecked = default (rail on mobile, expanded on desktop).
     Checked   = flipped (expanded on mobile, rail on desktop). */
  @custom-variant nav-checked (&:is(:where(body:has(#nav-toggle:checked)) *));

  .font-display { font-family: var(--font-display); font-optical-sizing: auto; }
  .font-mono { font-family: var(--font-mono); }

  .rail-link.active {
    background: color-mix(in oklch, var(--color-primary) 10%, transparent);
    position: relative;
  }
  .rail-link.active::before {
    content: "";
    position: absolute;
    left: 0; top: 8px; bottom: 8px; width: 3px;
    background: var(--color-primary);
    border-radius: 0 3px 3px 0;
  }
 
  /* Chart marks: the dataviz skill's categorical slots 1–2, validated against
     this theme's surfaces (#FFFCF9 light, #1A1224 dark). Blue = top-of-funnel,
     orange = downstream/conversion. Dark mode is its own validated steps. */
  .viz-root {
    --series-1: #2a78d6;
    --series-2: #eb6834;
    --grid: color-mix(in oklab, var(--color-base-content) 14%, transparent);
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme]) .viz-root {
      --series-1: #3987e5;
      --series-2: #d95926;
    }
  }
  [data-theme="trove-dark"] .viz-root {
    --series-1: #3987e5;
    --series-2: #d95926;
  }

  .inquiry-msg {
    max-width: 60ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  
/* Category picker (vendor registration + portfolio services): a category's
   service list opens when its toggle is checked. Lives here rather than in an
   inline <style> so it isn't blocked by the content security policy. */
.cat-panel { display: none; }
.cat-block:has(.category-toggle:checked) .cat-panel { display: block; }

/* #nav-toggle is visually hidden, so keyboard focus on it would be invisible.
   Show the focus ring on the hamburger label that stands in for it. */
body:has(#nav-toggle:focus-visible) label[for="nav-toggle"] {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}