/**
 * Crossmiles Elementor — design tokens
 *
 * Values in this file are ported from the verified static source in
 * styles.css and pages.css. Tokens are attached to the plugin namespaces so
 * an Elementor page cannot change the host theme's global design system.
 */

.cm-site,
.cm-widget {
  /* Brand identity palette aligned with the Crossmiles logo. */
  --cm-navy: #12345a;
  --cm-navy-2: #0a2847;
  --cm-navy-light: #1e4570;
  --cm-orange: #ea851c;
  --cm-orange-hover: #d57413;
  --cm-gold: #c99a45;
  --cm-gold-hover: #b38739;
  --cm-teal: #ea851c;
  --cm-teal-hover: #d57413;
  --cm-ink: #1f2933;
  --cm-muted: #65758b;
  --cm-cream: #fbfaf5;
  --cm-white: #ffffff;

  /* Card and layout surfaces — de-rainbowed to clean luxury neutrals. */
  --cm-card-surface: #ffffff;
  --cm-card-surface-subtle: #f8fafc;
  --cm-card-border: rgba(18, 52, 90, 0.08);
  --cm-surface-warm: #f4eee3;
  --cm-surface-light: #f7f9fa;
  --cm-field-surface: #fbfcfc;
  --cm-border: #dde3e7;
  --cm-border-soft: rgba(18, 52, 90, 0.08);

  /* Fallback aliases for deprecated pastels map to clean white surfaces. */
  --cm-mint: #ffffff;
  --cm-peach: #ffffff;
  --cm-blue: #ffffff;
  --cm-yellow: #ffffff;
  --cm-coral: #ea851c;
  --cm-coral-pale: #ffffff;
  --cm-lavender: #ffffff;
  --cm-teal-light: #f5a44e;
  --cm-orange-light: #f5a44e;

  /* Local, bundled faces mirror the verified Google Fonts source. */
  --cm-font-sans-face: "CM DM Sans";
  --cm-font-serif-face: "CM Playfair Display";
  --cm-font-sans: var(--cm-font-sans-face), Arial, sans-serif;
  --cm-font-serif: var(--cm-font-serif-face), Georgia, serif;

  /* Verified source geometry, rhythm, and motion timings. */
  --cm-shadow: 0 18px 50px rgba(18, 52, 90, 0.11);
  --cm-shadow-soft: 0 10px 35px rgba(18, 52, 90, 0.08);
  --cm-shadow-button: 0 10px 24px rgba(234, 133, 28, 0.25);
  --cm-radius: 28px;
  --cm-radius-card: 24px;
  --cm-radius-panel: 34px;
  --cm-radius-pill: 999px;
  --cm-container: min(1200px, calc(100% - 40px));
  --cm-container-max: 1200px;
  --cm-container-gutter: 20px;
  --cm-section-padding: clamp(68px, 9vh, 96px);
  --cm-header-height: 82px;
  --cm-anchor-offset: 92px;

  --cm-transition-fast: 0.25s;
  --cm-transition-standard: 0.35s;
  --cm-transition-image: 0.6s;

  /* CSS custom properties cannot be interpolated into media queries. */
  --cm-breakpoint-laptop: 1080px;
  --cm-breakpoint-wide-tablet: 900px;
  --cm-breakpoint-tablet: 820px;
  --cm-breakpoint-mobile: 560px;
  --cm-breakpoint-compact-height: 850px;
}

@media (max-width: 820px) {
  .cm-site,
  .cm-widget {
    --cm-container: min(calc(100% - 30px), 720px);
    --cm-container-gutter: 15px;
    --cm-section-padding: 85px;
    --cm-header-height: 70px;
  }
}

@media (max-width: 560px) {
  .cm-site,
  .cm-widget {
    --cm-container: calc(100% - 24px);
    --cm-container-gutter: 12px;
    --cm-section-padding: 70px;
  }
}

/* Bundled font files keep the Elementor output independent of remote font requests. */
@font-face {
  font-family: "CM DM Sans";
  src: url("../fonts/dm-sans-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: "CM Playfair Display";
  src: url("../fonts/playfair-display-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 600 700;
  font-display: swap;
}

@font-face {
  font-family: "CM Playfair Display";
  src: url("../fonts/playfair-display-italic-latin.woff2") format("woff2");
  font-style: italic;
  font-weight: 600;
  font-display: swap;
}