/*
 * JazPiper Website Foundation — temporary Homepage-local mirror.
 * Implementation authority: latest stable JazPiper PRO X plugin (v5.0.42).
 * Figma controls page composition and design intent; when an established PRO X
 * implementation rule conflicts with a Figma value, the PRO X rule wins unless
 * the global rule is explicitly revised.
 */

:root {
  --jp-brand-red: #ed1c24;
  --jp-ink: #111318;
  --jp-black: #000;
  --jp-white: #fff;
  --jp-muted: rgba(255, 255, 255, .50);
  --jp-border: #1c0153;
  --jp-purple: #8e54e9;
  --jp-blue: #4776e6;
  --jp-title-a: #e0eafc;
  --jp-title-b: #cfdef3;

  --jp-stage: 1280px;
  --jp-content: 1120px;
  --jp-header: 913px;

  --jp-measure-section-intro: 913px;
  --jp-measure-supporting: 783px;
  --jp-measure-feature: 540px;
  --jp-measure-spatial: 662px;
  --jp-measure-media-caption: 958px;

  --jp-space-4: 4px;
  --jp-space-8: 8px;
  --jp-space-12: 12px;
  --jp-space-16: 16px;
  --jp-space-20: 20px;
  --jp-space-24: 24px;
  --jp-space-32: 32px;
  --jp-space-40: 40px;
  --jp-space-48: 48px;
  --jp-space-64: 64px;
  --jp-space-80: 80px;
  --jp-space-96: 96px;
  --jp-space-120: 120px;
  --jp-space-160: 160px;

  --jp-page-gutter: 64px;
  --jp-section-pad: 120px;
  --jp-compact-pad: 80px;
  --jp-grid-gap: 24px;
  --jp-content-gap: 32px;
  --jp-stack-gap: 24px;
  --jp-header-content-gap: 40px;
  --jp-media-copy-gap: 48px;
  --jp-control-gap: 32px;

  /* Minimal interaction language: never introduce brand-red on hover. */
  --jp-hover-opacity: .68;
  --jp-hover-bg-light: rgba(17, 19, 24, .05);
  --jp-hover-bg-dark: rgba(255, 255, 255, .12);
  --jp-hover-border-light: rgba(17, 19, 24, .28);
  --jp-hover-border-dark: rgba(255, 255, 255, .28);
  --jp-motion-fast: 180ms ease;

  --jp-h1: 72px;
  --jp-h1-line: 78px;
  --jp-h2: 52px;
  --jp-h2-line: 60px;
  --jp-h3: 36px;
  --jp-h3-line: 44px;
  --jp-h4: 28px;
  --jp-h4-line: 36px;
  --jp-body-l: 20px;
  --jp-body-l-line: 32px;
  --jp-body-m: 16px;
  --jp-body-m-line: 26px;
  --jp-body-support: 18px;
  --jp-body-support-line: 30px;
  --jp-label: 13px;
  --jp-label-line: 18px;

  --jp-site-header-height: 104px;
  --jp-site-z-header: 1000;
  --jp-site-z-backdrop: 1090;
  --jp-site-z-menu: 1100;
}

/* On bridged views, base resets belong to the shell, preserving legacy body styles. */
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) {
  margin: 0;
  overflow-x: clip;
  color: var(--jp-ink);
  background: var(--jp-white);
  font-family: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: var(--jp-body-m);
  line-height: var(--jp-body-m-line);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) *,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) *::before,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) *::after {
  box-sizing: border-box;
}

:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) h1,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) h2,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) h3,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) h4,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) p {
  margin: 0;
}

:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) img,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) video {
  display: block;
  max-width: 100%;
}

:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) button,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) a {
  font: inherit;
}

:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) a {
  color: inherit;
}

html.jp-menu-open,
html.jp-menu-open body {
  overflow: hidden;
}

@media (max-width: 1100px) {
  :root {
    --jp-stage: 1024px;
    --jp-page-gutter: 40px;
    --jp-section-pad: 96px;
    --jp-compact-pad: 64px;
    --jp-grid-gap: 24px;
    --jp-content-gap: 28px;
    --jp-stack-gap: 20px;
    --jp-header-content-gap: 32px;
    --jp-media-copy-gap: 40px;
    --jp-control-gap: 24px;

    --jp-h1: 56px;
    --jp-h1-line: 64px;
    --jp-h2: 44px;
    --jp-h2-line: 52px;
    --jp-h3: 32px;
    --jp-h3-line: 40px;
    --jp-h4: 26px;
    --jp-h4-line: 34px;
    --jp-body-l: 18px;
    --jp-body-l-line: 30px;
    --jp-body-m: 16px;
    --jp-body-m-line: 26px;
    --jp-body-support: 18px;
    --jp-body-support-line: 30px;
    --jp-label: 13px;
    --jp-label-line: 18px;

    --jp-site-header-height: 88px;
  }
}

@media (max-width: 760px) {
  :root {
    --jp-stage: 390px;
    --jp-page-gutter: 20px;
    --jp-section-pad: 96px;
    --jp-compact-pad: 80px;
    --jp-grid-gap: 16px;
    --jp-content-gap: 28px;
    --jp-stack-gap: 20px;
    --jp-header-content-gap: 32px;
    --jp-media-copy-gap: 40px;
    --jp-control-gap: 28px;

    --jp-h1: 40px;
    --jp-h1-line: 46px;
    --jp-h2: 32px;
    --jp-h2-line: 40px;
    --jp-h3: 26px;
    --jp-h3-line: 34px;
    --jp-h4: 22px;
    --jp-h4-line: 30px;
    --jp-body-l: 18px;
    --jp-body-l-line: 28px;
    --jp-body-m: 16px;
    --jp-body-m-line: 26px;
    --jp-body-support: 16px;
    --jp-body-support-line: 26px;
    --jp-label: 12px;
    --jp-label-line: 18px;

    --jp-site-header-height: 76px;
  }
}


/* v0.3.4 — interaction guard
   WordPress themes often inject red/purple anchor states. Keep JazPiper pages
   neutral and let individual components control only opacity/background. */
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) a:visited {
  color: inherit;
}

:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) a:hover,
:is(.jp-site-system-page:not(:where(.jp-foundation-bridged-page)), :where(.jp-foundation-bridged-page) :is(.jp-site-header, .jp-site-menu, .jp-site-footer)) a:focus {
  color: inherit;
}