/* LastLonger design tokens. Values from frontend-spec 1.1-1.7 and 1.10. */
:root {
  /* Brand colours */
  --ll-ink: #0F1B2E;
  --ll-ink-soft: #1A2A40;
  --ll-ink-muted: #475569;
  --ll-paper: #FFFFFF;
  --ll-paper-2: #F4F6F9;
  --ll-paper-muted: #94A3B8;
  --ll-accent: #1F6F50;
  --ll-accent-hover: #185B41;
  --ll-accent-soft: #E6F1EB;
  --ll-clay: #F59E0B;                       /* defined in the original config, unused */

  /* Status (Tailwind red) */
  --ll-red-50: #FEF2F2;
  --ll-red-100: #FEE2E2;
  --ll-red-300: #FCA5A5;
  --ll-red-600: #DC2626;

  /* Blog prose colours: navy palette (O6, owner decision 2026-10-22; replaces the legacy greens of frontend-spec 1.1) */
  --ll-prose-heading: #0F1B2E;              /* = --ll-ink: .prose-blog h2, strong */
  --ll-prose-subheading: #1A2A40;           /* = --ll-ink-soft: .prose-blog h3 */
  --ll-prose-body: #475569;                 /* = --ll-ink-muted: .prose-blog p */

  /* Alpha variants actually used (frontend-spec 1.2) */
  --ll-paper-a0: rgba(255, 255, 255, 0);
  --ll-paper-a04: rgba(255, 255, 255, .04);
  --ll-paper-a05: rgba(255, 255, 255, .05);
  --ll-paper-a10: rgba(255, 255, 255, .1);
  --ll-paper-a15: rgba(255, 255, 255, .15);
  --ll-paper-a90: rgba(255, 255, 255, .9);
  --ll-paper-a95: rgba(255, 255, 255, .95);
  --ll-paper-2-a60: rgba(244, 246, 249, .6);
  --ll-paper-muted-a70: rgba(148, 163, 184, .7);
  --ll-ink-a05: rgba(15, 27, 46, .05);
  --ll-ink-a10: rgba(15, 27, 46, .1);
  --ll-ink-a15: rgba(15, 27, 46, .15);
  --ll-ink-a20: rgba(15, 27, 46, .2);
  --ll-ink-muted-a70: rgba(71, 85, 105, .7);
  --ll-accent-a06: rgba(31, 111, 80, .06);
  --ll-accent-a08: rgba(31, 111, 80, .08);
  --ll-accent-a10: rgba(31, 111, 80, .1);
  --ll-accent-a25: rgba(31, 111, 80, .25);
  --ll-accent-a30: rgba(31, 111, 80, .3);
  --ll-accent-a40: rgba(31, 111, 80, .4);
  --ll-accent-a50: rgba(31, 111, 80, .5);
  --ll-accent-soft-a60: rgba(230, 241, 235, .6);
  --ll-preflight-border: #E5E7EB;
  --ll-preflight-placeholder: #9CA3AF;

  /* Fonts (self-hosted, assets/css/fonts.css) */
  --ll-font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
  --ll-font-display: 'Plus Jakarta Sans', 'Inter', ui-sans-serif, system-ui, sans-serif;
  --ll-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --ll-tracking-display: -0.02em;
  --ll-tracking-tight: -0.025em;
  --ll-tracking-eyebrow: .18em;

  /* Type scale: size / line-height pairs (Tailwind defaults) */
  --ll-text-xs: .75rem;    --ll-lh-xs: 1rem;
  --ll-text-sm: .875rem;   --ll-lh-sm: 1.25rem;
  --ll-text-base: 1rem;    --ll-lh-base: 1.5rem;
  --ll-text-17: 17px;
  --ll-text-lg: 1.125rem;  --ll-lh-lg: 1.75rem;
  --ll-text-xl: 1.25rem;   --ll-lh-xl: 1.75rem;
  --ll-text-2xl: 1.5rem;   --ll-lh-2xl: 2rem;
  --ll-text-3xl: 1.875rem; --ll-lh-3xl: 2.25rem;
  --ll-text-4xl: 2.25rem;  --ll-lh-4xl: 2.5rem;
  --ll-text-5xl: 3rem;
  --ll-text-6xl: 3.75rem;
  --ll-text-7xl: 4.5rem;
  --ll-leading-hero: 1.08;
  --ll-leading-tight: 1.25;
  --ll-leading-snug: 1.375;
  --ll-leading-relaxed: 1.625;
  --ll-leading-prose: 1.8;

  /* Shadows, filters, rings */
  --ll-shadow-soft: 0 1px 2px rgba(15, 27, 46, .04), 0 8px 24px rgba(15, 27, 46, .06);
  --ll-shadow-card: 0 1px 3px rgba(15, 27, 46, .06), 0 12px 32px rgba(15, 27, 46, .08);
  --ll-shadow-cta: 0 6px 20px rgba(31, 111, 80, .25);
  --ll-shadow-bar: 0 -4px 24px rgba(15, 27, 46, .10);
  --ll-drop-2xl: drop-shadow(0 25px 25px rgba(0, 0, 0, .15));
  --ll-drop-xl: drop-shadow(0 20px 13px rgba(0, 0, 0, .03)) drop-shadow(0 8px 5px rgba(0, 0, 0, .08));
  --ll-ring-focus: 0 0 0 2px #fff, 0 0 0 4px rgba(31, 111, 80, .5);
  --ll-ring-input: 0 0 0 2px rgba(31, 111, 80, .5);
  --ll-blur-bar: blur(12px);

  /* Radii */
  --ll-radius-lg: .5rem;
  --ll-radius-xl: .75rem;
  --ll-radius-2xl: 1rem;
  --ll-radius-3xl: 1.5rem;
  --ll-radius-halo: 2rem;
  --ll-radius-full: 9999px;

  /* Content widths (Tailwind max-w-*) */
  --ll-w-md: 28rem;
  --ll-w-xl: 36rem;
  --ll-w-2xl: 42rem;
  --ll-w-3xl: 48rem;
  --ll-w-4xl: 56rem;
  --ll-w-5xl: 64rem;
  --ll-w-6xl: 72rem;
  --ll-w-7xl: 80rem;

  /* Rhythm */
  --ll-gutter: 1.25rem;                     /* re-set per scope in layout.css */
  --ll-header-h: 4rem;

  /* Motion */
  --ll-ease: cubic-bezier(.4, 0, .2, 1);
  --ll-ease-out: cubic-bezier(0, 0, .2, 1);
  --ll-dur-fast: 150ms;
  --ll-dur-btn: 200ms;
  --ll-dur-ui: 300ms;
  --ll-dur-item: 500ms;
  --ll-dur-reveal: 700ms;
  --ll-dur-hero: 1000ms;

  /* Layers */
  --ll-z-sub: 10;
  --ll-z-fixed: 50;
}
/* Breakpoints cannot be custom properties: sm 640px, md 768px, lg 1024px (min-width). */
