/* BCP Bolivia pitch prototype "Planes en Realidad": design tokens.
   Palette hexes are exactly those extracted from bcp.com.bo live CSS (see BRIEF section 2).
   RULE: #F26E29 is the only orange in the codebase. Every tint/shade of it is a color-mix()
   of the token, never a second hex.

   The world is LIGHT (per References/): pale grounds, huge rounded white containers,
   deep navy type, and dark navy inset panels only where the drama is earned. */

:root {
  /* Brand color */
  --navy: #203864;        /* dominant dark navy */
  --blue-deep: #002B76;   /* deep brand blue */
  --blue: #004B8E;        /* secondary blue */
  --orange: #F26E29;      /* the action color. The only orange. */
  --ground: #F6F6F6;
  --ground-blue: #F3F6FB;
  --border: #DFE1E7;
  --white: #FFFFFF;

  /* Derived (mixes only, no new brand hexes) */
  --navy-deep: color-mix(in srgb, var(--blue-deep) 78%, black);
  --text: color-mix(in srgb, var(--navy) 90%, black);
  --text-soft: color-mix(in srgb, var(--navy) 62%, white);
  --text-faint: color-mix(in srgb, var(--navy) 44%, white);
  --text-inverse-soft: color-mix(in srgb, var(--white) 74%, var(--navy));
  --orange-tint: color-mix(in srgb, var(--orange) 9%, white);
  --orange-hover: color-mix(in srgb, var(--orange) 86%, black);
  --orange-glow: color-mix(in srgb, var(--orange) 42%, transparent);
  --blue-tint: color-mix(in srgb, var(--blue) 7%, white);
  --border-soft: color-mix(in srgb, var(--border) 55%, white);
  --border-navy: color-mix(in srgb, var(--white) 15%, transparent);
  --ground-deep: color-mix(in srgb, var(--ground-blue) 55%, var(--border) 22%);

  /* Type: Archivo, a modern squarish grotesk in the spirit of Flexo (self-hosted) */
  --font: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fs-display: clamp(2.35rem, 5.9vw, 5.1rem);   /* hero headline */
  --fs-h1: clamp(2.3rem, 4.6vw, 3.7rem);
  --fs-h2: clamp(2rem, 3.8vw, 3.15rem);           /* section headlines */
  --fs-h3: 1.3rem;
  --fs-lede: clamp(1.08rem, 1.5vw, 1.26rem);
  --fs-body: 1.05rem;
  --fs-small: .93rem;
  --fs-tiny: .8rem;

  /* Space */
  --s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem;
  --s-5: 1.5rem; --s-6: 2rem; --s-7: 3rem; --s-8: 4.5rem; --s-9: 6.5rem;

  /* Shape: the container is the brand device */
  --r-shell: clamp(20px, 3vw, 36px);  /* big rounded section containers */
  --r-card: 20px;
  --r-input: 12px;
  --r-pill: 999px;
  --shadow-card: 0 1px 2px color-mix(in srgb, var(--navy) 6%, transparent),
                 0 10px 34px color-mix(in srgb, var(--navy) 8%, transparent);
  --shadow-lift: 0 2px 6px color-mix(in srgb, var(--navy) 8%, transparent),
                 0 26px 70px color-mix(in srgb, var(--navy) 14%, transparent);
  --shadow-shell: 0 2px 5px color-mix(in srgb, var(--navy) 4%, transparent),
                  0 30px 90px color-mix(in srgb, var(--navy) 7%, transparent);

  /* Motion: compostura. Calm, weighted, assured; nothing snaps, nothing bounces. */
  --ease-out: cubic-bezier(.19, .62, .22, 1);
  --ease-soft: cubic-bezier(.33, .7, .3, 1);
  --t-fast: 180ms;
  --t-med: 350ms;
  --t-slow: 700ms;
  --stagger: 90ms;

  /* Layout */
  --container: 1280px;
  --shell-max: 1408px;
  --gutter: clamp(1rem, 3.4vw, 2rem);
  --header-h: 76px;
}