/*
 Theme Name:   LDN Magazine v3.0
 Theme URI:    https://lifediverse.com
 Description:  Minimal editorial child theme for the Life Diverse Network. Inter typeface, monochrome palette, photography-first card layouts. Built on GeneratePress Premium + GenerateBlocks.
 Author:       LDN Engineering
 Author URI:   https://lifediverse.com
 Template:     generatepress
 Version:      3.0.0
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  ldn-gp-child
 Tags:         magazine, editorial, lifestyle, minimal, responsive, grid-layout

 ─────────────────────────────────────────────────────────────
 DESIGN TOKENS — Synced from Figma: LDN-First-Child-Template
 File Key: h6fw1mDnn6YoOJOnAgdEYf
 ─────────────────────────────────────────────────────────────
*/

/* =================================================================
   1. ROOT TOKENS — Figma-Aligned Foundation
   ================================================================= */

:root {
    /* ── Backgrounds (Figma Grayscale) ── */
    --bg-primary:     #FFFFFF;
    --bg-secondary:   #F7F7F7;
    --bg-tertiary:    #E6E6E6;
    --bg-overlay:     rgba(0, 0, 0, 0.55);

    /* ── Text (Figma Grayscale) ── */
    --text-primary:   #000000;
    --text-secondary: #444444;
    --text-tertiary:  #828282;
    --text-inverse:   #FFFFFF;

    /* ── Borders & Dividers ── */
    --border:         #E6E6E6;
    --border-hover:   #D9D9D9;
    --divider:        #E6E6E6;

    /* ── Accent (defaults — overridden per city) ── */
    --accent-primary:   #000000;
    --accent-hover:     #444444;
    --accent-muted:     rgba(0, 0, 0, 0.06);

    /* ── Shadows (subtle, Kinfolk-style) ── */
    --shadow-sm:      0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md:      0 4px 12px rgba(0, 0, 0, 0.06);
    --shadow-lg:      0 8px 24px rgba(0, 0, 0, 0.08);
    --shadow-hover:   0 12px 32px rgba(0, 0, 0, 0.10);

    /* ── Typography — Inter Only (Figma) ── */
    --font-primary:   'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --text-body:      16px;      /* Figma: 16px */
    --text-lg:        20px;      /* Figma: 20px */
    --text-xl:        24px;      /* Figma: 24px */
    --text-2xl:       32px;      /* Figma: 32px */
    --text-3xl:       40px;      /* Figma: 40px */
    --text-4xl:       48px;      /* Figma: 48px */
    --text-hero:      64px;      /* Figma: 64px */

    --text-sm:        14px;
    --text-xs:        12px;

    --leading-tight:  1.2;
    --leading-snug:   1.35;
    --leading-normal: 1.5;       /* Figma: 150% line-height */
    --leading-loose:  1.7;

    --tracking-tight:  -0.02em;
    --tracking-normal: 0;
    --tracking-wide:   0.05em;
    --tracking-wider:  0.1em;

    /* ── Spacing (Figma tokens) ── */
    --space-1:  4px;
    --space-2:  8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-5:  20px;
    --space-6:  24px;
    --space-7:  32px;
    --space-8:  48px;
    --space-9:  64px;
    --space-10: 96px;

    /* ── Layout ── */
    --max-width:       1200px;
    --max-width-wide:  1440px;
    --max-width-prose: 680px;
    --gutter:          var(--space-6);
    --section-gap:     var(--space-9);

    /* ── Radius (Figma: 4, 8, 12) ── */
    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   12px;
    --radius-pill: 100px;

    /* ── Transitions ── */
    --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
    --duration:      0.25s;
    --duration-slow: 0.4s;
}
