/* Canonical source: design/sample/css/tokens.css — sync manually when tokens change. */
/* ==========================================================================
   GeoVisibly — Design Tokens
   Single source of truth for colour, typography, radius, shadow and spacing.
   Change a value here and it propagates everywhere.
   Reference: design/GeoVisibly Brand Guide.html
   ========================================================================== */

:root {
  /* ---- Brand ------------------------------------------------------------ */
  --gv-navy-900: #0b1220;   /* primary dark surface        */
  --gv-navy-800: #0f1a2e;   /* elevated dark cards         */
  --gv-cyan-deep: #0a7d94;  /* AA-safe accent on light bg  */
  --gv-cyan-bright: #34d6ee;/* accent on dark backgrounds  */
  --gv-cyan-light: #5fe0f2; /* cyan text/detail on dark    */
  --gv-cyan-hover: #056e82; /* deep-cyan button hover      */
  --gv-coral: #ff7a59;      /* complementary highlight     */
  --gv-coral-deep: #d94f36; /* accessible warm accent      */
  --gv-coral-soft: #fff0ea; /* warm highlight background   */
  --gv-coral-glow: rgba(255, 122, 89, 0.22);

  /* ---- Neutrals --------------------------------------------------------- */
  --gv-ink: #0d1626;        /* primary text                */
  --gv-text-2: #2b3a4d;     /* body copy                   */
  --gv-slate-600: #5a6a80;  /* secondary text              */
  --gv-slate-500: #64768a;  /* muted text                  */
  --gv-slate-400: #6b7a8f;  /* captions / meta             */
  --gv-paper: #eef2f6;      /* app background              */
  --gv-paper-2: #e9eef3;    /* screens background          */
  --gv-white: #ffffff;

  /* ---- Borders / dividers ---------------------------------------------- */
  --gv-border: #e4e9f0;       /* default card border       */
  --gv-border-soft: #eef2f6;  /* inner dividers            */
  --gv-border-strong: #cfd8e2;
  --gv-border-input: #d7dee7;
  --gv-border-hover: #bfe9f2; /* card hover border         */

  /* ---- Muted tones on dark surfaces ------------------------------------ */
  --gv-on-dark-1: #c7d4e1;
  --gv-on-dark-2: #a9bacd;
  --gv-on-dark-3: #9fb2c6;
  --gv-on-dark-4: #8496ab;
  --gv-on-dark-5: #7d8ea3;
  --gv-on-dark-6: #5f7089;

  /* ---- Semantic --------------------------------------------------------- */
  --gv-success: #12a150;   --gv-success-bg: #e6f6ee;   /* score >= 65   */
  --gv-warning: #d68a00;   --gv-warning-fg: #a5710a;   --gv-warning-bg: #fbf1dd; /* score 45-64 */
  --gv-danger:  #c23a3a;   --gv-danger-bg:  #fbe9e9;   /* score < 45    */
  --gv-info-bg: #e6f7fb;                                /* running / info */
  --gv-highlight-bg: #fff0ea;

  /* ---- Typography ------------------------------------------------------- */
  --gv-font-sans: 'Hanken Grotesk', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --gv-font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --gv-fs-h1: 56px;
  --gv-fs-h2: 38px;
  --gv-fs-h3: 24px;
  --gv-fs-title: 17px;
  --gv-fs-body: 16px;
  --gv-fs-small: 13px;

  /* ---- Radius ----------------------------------------------------------- */
  --gv-radius-sm: 8px;
  --gv-radius: 11px;      /* buttons / inputs      */
  --gv-radius-md: 14px;   /* small cards           */
  --gv-radius-lg: 16px;   /* cards                 */
  --gv-radius-xl: 20px;   /* panels                */
  --gv-radius-pill: 100px;

  /* ---- Shadows ---------------------------------------------------------- */
  --gv-shadow-card-hover: 0 16px 34px rgba(13, 22, 38, 0.08);
  --gv-shadow-swatch-hover: 0 14px 30px rgba(13, 22, 38, 0.09);
  --gv-shadow-soft: 0 20px 50px rgba(13, 22, 38, 0.06);
  --gv-shadow-hero: 0 24px 60px rgba(11, 18, 32, 0.2);
  --gv-shadow-cyan: 0 8px 24px rgba(52, 214, 238, 0.28);
  --gv-shadow-cyan-hover: 0 14px 34px rgba(52, 214, 238, 0.45);
  --gv-shadow-coral: 0 12px 30px rgba(255, 122, 89, 0.24);

  /* ---- Layout ----------------------------------------------------------- */
  --gv-max: 1240px;       /* wide marketing/app width */
  --gv-max-guide: 960px;  /* brand-guide reading width */

  /* ---- Imagery ---------------------------------------------------------- */
  --gv-texture-ai: url("../assets/images/geo-visibility-texture.png");
  --gv-hero-place: url("../assets/images/hero-place-photo.png");
  --gv-place-map: url("../assets/images/place-resolution-map.png");
  --gv-pattern-dots:
    radial-gradient(circle at 1px 1px, rgba(10, 125, 148, 0.14) 1px, transparent 0);
  --gv-pattern-cross:
    linear-gradient(90deg, rgba(10, 125, 148, 0.07) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 122, 89, 0.08) 1px, transparent 1px);
}