/*
 * Design tokens, extracted verbatim from the mockup
 * (mockup/Ashworth & Vale - Homepage (Standalone).html) per the project's
 * decision to adopt the mockup's palette/type as-is. See
 * docs/MOCKUP_TRANSFORMATION_PLAN.md §3.1 for the source table.
 */

:root {
  /* ---- Color ---- */
  --av-ink: #0E1A2B;          /* navy — headings, dark surfaces */
  --av-ink-hover: #16263C;    /* dark button hover */
  /* Was #3A7BFF (bright blue) — replaced sitewide with the navy ink at the
     user's request, so --av-accent is now literally --av-ink's value. Kept
     as a separate token (rather than deleted) because a handful of rules on
     dark backgrounds/photos would otherwise go invisible if they resolved to
     the literal ink color and happened to sit on an ink-colored surface —
     those specific rules were given an explicit light/white color instead of
     var(--av-accent); everything else (buttons, borders, hover states on
     light surfaces, focus rings) just inherits ink automatically via this
     token, with no per-rule changes needed. */
  --av-accent: #0E1A2B;
  --av-accent-hover: #16263C;
  --av-bg: #F9FAFB;           /* page background */
  --av-surface: #FFFFFF;
  --av-surface-alt: #F2F4F7;  /* alternating section background */
  --av-text: #101828;
  --av-muted: #5F6B7A;
  --av-success: #3CB371;
  --av-hairline: rgba(14, 26, 43, .08);
  --av-hairline-strong: rgba(14, 26, 43, .15);
  --av-shadow-color: 14, 26, 43;

  /* ---- Type ---- */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-label: 'Space Grotesk', ui-sans-serif, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  --fs-kicker: 13px;
  --fs-h1: clamp(40px, 5.4vw, 82px);
  --fs-h2: clamp(30px, 3.6vw, 54px);
  --fs-h3: clamp(22px, 2vw, 28px);
  --fs-lead: clamp(15px, 1.2vw, 18px);
  --fs-body: 15.5px;
  --fs-small: 13.5px;

  --lh-tight: 1.14;
  --lh-heading: 1.15;
  --lh-body: 1.7;

  --tracking-kicker: .22em;
  --tracking-label: .12em;

  /* ---- Space ---- */
  --space-section-y: clamp(80px, 12vh, 140px);
  --space-section-x: clamp(20px, 5vw, 72px);
  --space-hero-y: clamp(120px, 16vh, 180px);
  --container-max: 1360px;

  /* ---- Radii ---- */
  --radius-sm: 14px;
  --radius-md: 16px;
  --radius-lg: 18px;
  --radius-xl: 20px;
  --radius-2xl: 22px;
  --radius-3xl: 24px;
  --radius-4xl: 28px;
  --radius-pill: 99px;

  /* ---- Shadow ---- */
  --shadow-card: 0 24px 60px -30px rgba(var(--av-shadow-color), .18);
  --shadow-card-hover: 0 28px 60px -28px rgba(var(--av-shadow-color), .25);
  --shadow-float: 0 20px 40px rgba(var(--av-shadow-color), .12);
  --shadow-image: 0 40px 80px -30px rgba(var(--av-shadow-color), .35);
  --shadow-cta-glow: 0 0 60px rgba(14, 26, 43, .35);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(.2, .8, .2, 1);
  --dur-fast: .3s;
  --dur-base: .4s;
  --dur-slow: .9s;

  /* ---- Layering ---- */
  --z-nav: 100;
  --z-mobile-nav: 150;
  --z-cursor: 300;
}