/* ==========================================================================
   ONESource Moving Solutions Caledon, design tokens
   Concept: "Estate & Escarpment", retint v2 (client direction, Sep 11):
   deep-plum surfaces derived from the franchisor purple #7A2D76 replace
   the evergreen; oat cream papers, brass on dark only, bronze on cream.
   Typeface system: Fraunces variable (460/560 + italic 400) display,
   Instrument Sans 400/500/600 body, IBM Plex Mono 400/500 micro labels.
   Zero radius (2px on controls only), zero shadows, 1px hairline structure.
   ========================================================================== */

:root {
  /* -- surfaces ---------------------------------------------------------- */
  --paper:        #F3EDDF; /* primary cream; ink on it ~14:1                    */
  --paper-raise:  #FAF6EB; /* estimate desk card, caption plates; ink ~14.6:1   */
  --paper-deep:   #E9E1CC; /* reviews + towns band; ink ~11.7:1                 */
  --plum:         #3A2140; /* trust strip, owners band, tel button on cream adj.; cream 12.0:1 */
  --plum-deep:    #251528; /* footer, condensed nav, docked bar, scrims; cream ~14.6:1 */
  --os-purple:    #7A2D76; /* franchisor brand purple: Commission band, tel/menu button fills, focus rings on creams, form selected state; cream on it 7.2:1 */

  /* -- ink --------------------------------------------------------------- */
  --ink:        #261C2B; /* plum-black body + headings on all creams             */
  --ink-soft:   #5A4C63; /* secondary on creams; 16px/400 minimum on paper-deep  */
  --cream-text: #F1EBDB; /* primary text on plum, plum-deep, scrim, purple       */
  --lavender:   #BFB3C9; /* muted text on plum/deep; never under 12px            */
  --brass:      #C7A45F; /* DARK surfaces only: kickers, numerals, hairlines     */
  --bronze:     #6F5420; /* cream-side stand-in: labels, links, field borders    */

  /* -- hairlines ---------------------------------------------------------- */
  --line-cream: rgba(111, 84, 32, 0.35);  /* bronze at 35% on cream surfaces     */
  --line-dark: rgba(199, 164, 95, 0.45);  /* brass at 45% on plum                */
  --line-dark-soft: rgba(199, 164, 95, 0.30); /* footer divider                  */

  /* -- type ---------------------------------------------------------------- */
  --font-serif: "Fraunces", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-sans: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* -- scale ----------------------------------------------------------------
     mono kicker 11px caps .18em | mono caption 12px | body S 15/1.5 | body
     18/1.65 | lede clamp | quote clamp italic | display M/L/XL | Commission
     phone clamp | fig numerals clamp. Fraunces never renders below 1.5rem.  */
  --t-kicker: 500 0.6875rem/1.4 var(--font-mono);
  --t-caption: 400 0.75rem/1.5 var(--font-mono);
  --t-body-s: 400 0.9375rem/1.5 var(--font-sans);
  --t-body: 400 1.125rem/1.65 var(--font-sans);
  --t-lede: clamp(1.125rem, 1.6vw, 1.375rem);
  --t-quote: clamp(1.5rem, 2.6vw, 2.125rem);
  --t-display-m: clamp(1.75rem, 3vw, 2.5rem);
  --t-display-l: clamp(2.25rem, 4.2vw, 3.5rem);
  --t-display-xl: clamp(3rem, 7vw, 5.5rem);
  --t-phone-xl: clamp(2.75rem, 8vw, 6rem);
  --t-fig: clamp(2.5rem, 4vw, 3.25rem);

  /* -- layout ---------------------------------------------------------------- */
  --wrap: 1200px;
  --measure: 36rem;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --nav-h: 76px;
  --r-ctl: 2px;   /* the only radius on the page: buttons, inputs, chips, docked bar */
  --ease-cine: cubic-bezier(0.16, 1, 0.3, 1);

  /* -- focus ----------------------------------------------------------------- */
  --ring-cream: 2px solid var(--os-purple); /* creams only; never on plum surfaces */
  --ring-dark: 2px solid var(--cream-text); /* plum, plum-deep, purple             */

  /* -- grain (2 percent feTurbulence paper grain, multiply; stripped under
     prefers-reduced-transparency; see index.html usage) ---------------------- */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0.1 0 0 0 0.9 0 0.1 0 0 0.9 0 0 0.1 0 0.9 0 0 0 0 1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}