/* Self hosted. Generated by build/fetch-fonts.js, do not edit. */
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/archivo-600.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/archivo-700.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/manrope-400.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/manrope-500.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/manrope-600.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* ============ 1. base ============ */

/* ============================================================ 1. base ===
   Tokens. The same seven the site has always used. */
:root{
  --ink:#0B0F14; --ink-soft:#171C22; --paper:#FFFFFF; --surface:#F3F5F7;
  --line:#E3E7EA; --red:#D02B1F; --dim:#5C656E;
  --on-ink:#EDF0F2; --on-ink-dim:#AEB5BC;
  --display:'Archivo','Helvetica Neue',Arial,sans-serif;
  --body:'Manrope','Segoe UI',system-ui,sans-serif;
  --wrap:1240px; --gutter:40px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{overflow-x:clip}           /* deliberate backstop, nothing scrolls sideways */
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--body);font-size:18px;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}

/* The centred column every section shares. */
.jm-wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}

/* Section shell: one ground, one vertical rhythm. */
.jm-s{padding-block:var(--padY,88px)}
.jm-s--paper{background:var(--paper)}
.jm-s--surface{background:var(--surface)}
.jm-s--ink{background:var(--ink);color:var(--on-ink)}
.jm-s--inksoft{background:var(--ink-soft);color:var(--on-ink)}
.jm-s--light{color:var(--on-ink)}
.jm-s--light .jm-display{color:#fff}
.jm-s--light .jm-body,.jm-s--light .jm-lead{color:var(--on-ink)}

.jm-col{max-width:100%}
.jm-col--68{max-width:68%}
.jm-col--74{max-width:74%}

/* Display type.
   --fs is the size the family asks for, which is the size at full width.
   Elementor could only step it at two breakpoints, with blunt 0.7 and 0.52
   multipliers, so a heading jumped a third of its size at 900px. Here it
   scales continuously: never below 54 per cent of the full size, never above
   it, interpolating on viewport width in between. Nothing jumps. */
.jm-display{
  font-family:var(--display);font-weight:700;
  font-size:clamp(calc(var(--fs,40px) * .54), calc(var(--fs,40px) * .42 + 1.5vw), var(--fs,40px));
  line-height:1.04;letter-spacing:-.034em;
  color:var(--ink);margin:0;text-wrap:balance;
}
.jm-display--hero{--fs:58px;color:#fff}
.jm-display--head{--fs:52px;color:#fff}
.jm-display + .jm-body,.jm-display + .jm-lead{margin-top:20px}

.jm-body{font-size:var(--fs,18px);line-height:1.65;color:var(--dim);margin:16px 0 0;max-width:62ch}
.jm-body--sm{font-size:15px}
.jm-lead{font-size:20px;line-height:1.55;color:var(--dim);margin:16px 0 0;max-width:58ch}
.jm-s--light .jm-lead,.jm-phero .jm-lead,.jm-band .jm-lead{color:var(--on-ink)}

/* Anything a family emits after a heading needs air. */
.jm-display + .jm-srvlist,.jm-display + .jm-cells,.jm-display + .jm-doc,
.jm-display + .jm-process,.jm-display + .jm-faq{margin-top:34px}
.jm-eyebrow + .jm-display{margin-top:14px}

/* Button. */
.jm-btn{
  display:inline-block;font-family:var(--body);font-weight:600;font-size:15px;
  line-height:1;letter-spacing:.2px;padding:17px 30px;border-radius:2px;
  text-decoration:none;transition:background-color .2s ease,color .2s ease;
}
.jm-btn--primary{background:var(--red);color:#fff;border:1px solid var(--red)}
.jm-btn--primary:hover{background:#fff;color:var(--ink);border-color:#fff}
.jm-btn--ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.5)}
.jm-btn--ghost:hover{background:#fff;color:var(--ink);border-color:#fff}

/* ============ 2. kit  ============ */

/* ---- gloss build ---- */
.jm-wrap{max-width:1240px;margin-inline:auto;width:100%}

.jm-eyebrow{display:flex;align-items:center;gap:14px}
.jm-eyebrow__rule{display:block;width:40px;height:2px;background:var(--e-global-color-accent,#D02B1F);flex:0 0 40px}
.jm-eyebrow__label{font-family:Manrope,sans-serif;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--e-global-color-primary,#0B0F14)}
.jm-eyebrow--light .jm-eyebrow__label{color:#fff}

.jm-list{width:100%}
.jm-list__row{display:grid;grid-template-columns:1fr 26px;column-gap:20px;padding:20px 0;border-top:1px solid var(--e-global-color-line,#E3E7EA);text-decoration:none;transition:none}
.jm-list__row:last-child{border-bottom:1px solid var(--e-global-color-line,#E3E7EA)}
.jm-list__term{grid-column:1;font-family:Archivo,sans-serif;font-weight:700;font-size:20px;line-height:1.25;color:var(--e-global-color-primary,#0B0F14)}
.jm-list__desc{grid-column:1;margin-top:6px;font-family:Manrope,sans-serif;font-size:15px;line-height:1.55;color:var(--e-global-color-secondary,#5C656E)}
.jm-list__go{grid-column:2;grid-row:1 / span 2;align-self:center;justify-self:end;font-size:18px;line-height:1;color:var(--e-global-color-accent,#D02B1F)}
.jm-list__row:hover .jm-list__term{color:var(--e-global-color-accent,#D02B1F)}

/* Service index. An index, not a table: the picture carries real size, the
   term carries real scale, and the row breathes. Hairlines, never cards. */
.jm-srvlist{width:100%;border-top:1px solid var(--e-global-color-line,#E3E7EA)}
.jm-srv{display:grid;grid-template-columns:300px minmax(0,1fr) 56px;column-gap:44px;align-items:center;padding:26px 0;border-bottom:1px solid var(--e-global-color-line,#E3E7EA);text-decoration:none;position:relative}
.jm-srv::before{content:"";position:absolute;inset:0 -24px;background:var(--e-global-color-primary,#0B0F14);opacity:0;transition:opacity .28s ease;pointer-events:none}
.jm-srv:hover::before{opacity:.035}
.jm-srv__media{display:block;overflow:hidden;background:var(--e-global-color-line,#E3E7EA);aspect-ratio:3 / 2}
.jm-srv__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.jm-srv:hover .jm-srv__media img{transform:scale(1.045)}
.jm-srv__body{display:flex;flex-direction:column;gap:9px;min-width:0;position:relative}
.jm-srv__term{font-family:Archivo,sans-serif;font-weight:700;font-size:31px;line-height:1.12;letter-spacing:-.7px;color:var(--e-global-color-primary,#0B0F14);transition:color .2s ease}
.jm-srv__desc{font-family:Manrope,sans-serif;font-size:16px;line-height:1.6;max-width:56ch;color:var(--e-global-color-secondary,#5C656E)}
.jm-srv__go{position:relative;justify-self:end;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border:1px solid var(--e-global-color-line,#E3E7EA);border-radius:2px;font-size:17px;line-height:1;color:var(--e-global-color-primary,#0B0F14);transition:background-color .24s ease,border-color .24s ease,color .24s ease,transform .24s ease}
.jm-srv:hover .jm-srv__term{color:var(--e-global-color-accent,#D02B1F)}
.jm-srv:hover .jm-srv__go{background:var(--e-global-color-accent,#D02B1F);border-color:var(--e-global-color-accent,#D02B1F);color:#fff;transform:translateX(4px)}
/* Rows without a picture keep the same rhythm. */
.jm-srvlist .jm-srv--plain{grid-template-columns:minmax(0,1fr) 56px}


/* A hairline row with an icon in the margin. Same idea as the figure row, at
   the scale of a mark rather than a number. Used where a reference list has no
   pictures to carry it, above all on the legal pages. */
.jm-srvlist .jm-srv--ico{grid-template-columns:44px minmax(0,1fr);column-gap:24px;align-items:start;padding:22px 0}
.jm-srv__ico{display:block;color:var(--e-global-color-accent,#D02B1F);padding-top:2px}
.jm-srv__ico .jm-ico{display:block;width:24px;height:24px}
.jm-srv--ico .jm-srv__term{font-size:20px;letter-spacing:-.3px}
.jm-srv--light .jm-srv__ico{color:#fff}
@media(max-width:767px){
  .jm-srvlist .jm-srv--ico{grid-template-columns:32px minmax(0,1fr);column-gap:14px}
  .jm-srv__ico .jm-ico{width:20px;height:20px}
}

/* A row carrying a figure. This replaced the specification tables: the number
   is the thing the reader came for, so it sits in the margin at display size
   instead of being one cell among four. */
.jm-srvlist .jm-srv--fig{grid-template-columns:150px minmax(0,1fr);column-gap:44px;align-items:start;padding:28px 0}
.jm-srv__figwrap{display:flex;flex-direction:column;gap:4px;padding-top:3px}
.jm-srv__fig{font-family:Archivo,sans-serif;font-weight:700;font-size:34px;line-height:1;letter-spacing:-1.2px;color:var(--e-global-color-primary,#0B0F14);font-variant-numeric:tabular-nums;transition:color .2s ease}
.jm-srv__unit{font-family:Manrope,sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--e-global-color-bodymid,#7A828B)}
.jm-srv--fig .jm-srv__term{font-size:24px;letter-spacing:-.4px}
.jm-srv:hover .jm-srv__fig{color:var(--e-global-color-accent,#D02B1F)}
/* The second line under the term, for aircraft names and other specifics. */
.jm-srv__meta{font-family:Manrope,sans-serif;font-size:14px;line-height:1.5;color:var(--e-global-color-primary,#0B0F14);opacity:.7}
.jm-srv--light .jm-srv__meta{color:#fff;opacity:.72}
.jm-srv--light .jm-srv__fig{color:#fff}
@media(max-width:767px){
  .jm-srvlist .jm-srv--fig{grid-template-columns:1fr;row-gap:10px;padding:22px 0}
  .jm-srv__figwrap{flex-direction:row;align-items:baseline;gap:10px;padding-top:0}
  .jm-srv__fig{font-size:28px}
}
@media(max-width:1100px){
  .jm-srv{grid-template-columns:220px minmax(0,1fr) 46px;column-gap:30px}
  .jm-srvlist .jm-srv--fig{grid-template-columns:126px minmax(0,1fr);column-gap:32px}
  .jm-srv__term{font-size:26px}
}
@media(max-width:767px){
  .jm-srv{grid-template-columns:1fr;row-gap:16px;padding:24px 0}
  .jm-srvlist .jm-srv--plain{grid-template-columns:1fr}
  .jm-srv__media{aspect-ratio:16 / 9}
  .jm-srv__go{justify-self:start;width:42px;height:42px}
  .jm-srv__term{font-size:23px}
  .jm-srv__desc{font-size:15px}
}

/* Band: scrim under the line, so the photograph stays bright at the top.
   A band is a very wide letterbox, so whatever the picture does on the left is
   unpredictable. The second gradient darkens the side the copy sits on, which
   is what makes white text safe on a bright fuselage or a pale apron. */
.jm-band{position:relative}
.jm-band::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,rgba(11,15,20,.58) 0%,rgba(11,15,20,.36) 34%,rgba(11,15,20,0) 64%)}
.jm-band::after{content:"";position:absolute;inset:auto 0 0 0;height:62%;pointer-events:none;background:linear-gradient(to bottom,rgba(11,15,20,0) 0%,rgba(11,15,20,.30) 45%,rgba(11,15,20,.66) 100%)}
.jm-band__in{position:relative;z-index:1}
@media(max-width:767px){
  /* Narrow screens crop the picture to almost nothing on either side, so the
     side gradient stops earning its keep and a flat wash reads better. */
  .jm-band::before{background:linear-gradient(to right,rgba(11,15,20,.46) 0%,rgba(11,15,20,.30) 100%)}
}
/* The band copy sits in its own narrow column, set in the page structure.
   A CSS max-width does not work here: Elementor forces max-width:100% on
   widgets with higher specificity than a kit rule can reach. */

/* Figures. Category first, then the number as the answer, then the proof, then
   a named link. The whole tile is clickable. */
.jm-figures{display:grid;grid-template-columns:repeat(3,1fr);gap:0;width:100%;border-top:1px solid var(--e-global-color-line,#E3E7EA)}
.jm-figure{display:flex;flex-direction:column;gap:8px;padding:26px 30px 24px 0;text-decoration:none;position:relative;border-top:2px solid var(--e-global-color-primary,#0B0F14);margin-top:-1px;transition:border-color .24s ease}
.jm-figure + .jm-figure{padding-left:34px;border-left:1px solid var(--e-global-color-line,#E3E7EA)}
.jm-figure__label{font-family:Manrope,sans-serif;font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--e-global-color-bodymid,#7A828B)}
.jm-figure__n{font-family:Archivo,sans-serif;font-weight:700;font-size:58px;line-height:1;letter-spacing:-2px;color:var(--e-global-color-primary,#0B0F14);transition:color .2s ease}
.jm-figure__t{font-family:Manrope,sans-serif;font-size:15px;line-height:1.55;color:var(--e-global-color-secondary,#5C656E);max-width:34ch}
.jm-figure__go{margin-top:auto;padding-top:14px;display:inline-flex;align-items:center;gap:8px;font-family:Manrope,sans-serif;font-size:14px;font-weight:600;color:var(--e-global-color-accent,#D02B1F)}
.jm-figure__arrow{transition:transform .24s ease}
.jm-figure:hover{border-top-color:var(--e-global-color-accent,#D02B1F)}
.jm-figure:hover .jm-figure__n{color:var(--e-global-color-accent,#D02B1F)}
.jm-figure:hover .jm-figure__arrow{transform:translateX(5px)}
@media(max-width:900px){
  .jm-figures{grid-template-columns:1fr;border-top:0}
  .jm-figure{padding:22px 0 20px}
  .jm-figure + .jm-figure{padding-left:0;border-left:0}
  .jm-figure__n{font-size:46px}
}

/* Subpage hero. Same scrim idea as the home hero, over a still photograph. */
.jm-phero{position:relative}
.jm-phero::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(to bottom,rgba(11,15,20,.10) 0%,rgba(11,15,20,.06) 34%,rgba(11,15,20,.46) 68%,rgba(11,15,20,.76) 100%)}
.jm-phero > .elementor-element{position:relative;z-index:2}
.jm-phero h1,.jm-phero .elementor-widget-text-editor{text-shadow:0 1px 20px rgba(11,15,20,.42)}

/* Rows without a picture, and rows on an ink ground. */
.jm-srv--plain .jm-srv__term{font-size:24px}
.jm-srv--light{border-bottom-color:#2A333B}
.jm-srvlist:has(.jm-srv--light){border-top-color:#2A333B}
.jm-srv--light .jm-srv__term{color:#fff}
.jm-srv--light .jm-srv__desc{color:#AEB5BC}
.jm-srv--light .jm-srv__go{border-color:#2A333B;color:#fff}

/* Numbered process, on a rail. The figure sits in a ring and a hairline runs
   from it to the next one, so five steps read as a sequence rather than as
   five paragraphs that happen to be numbered. The line is drawn from the ring
   downward, which avoids having to knock a hole in it for the number. */
.jm-process{list-style:none;margin:0;padding:0;width:100%}
.jm-process__item{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:28px;padding:0 0 34px}
.jm-process__item--last{padding-bottom:0}
.jm-process__item::before{content:"";position:absolute;left:21px;top:44px;bottom:0;width:1px;background:var(--e-global-color-line,#E3E7EA)}
.jm-process__item--last::before{display:none}
.jm-process__n{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--e-global-color-line,#E3E7EA);border-radius:50%;background:var(--jm-ground,#fff);transition:border-color .24s ease,background-color .24s ease}
.jm-process__num{font-family:Archivo,sans-serif;font-weight:700;font-size:14px;line-height:1;color:var(--e-global-color-primary,#0B0F14);font-variant-numeric:tabular-nums;transition:color .24s ease}
.jm-process__body{display:flex;flex-direction:column;gap:7px;min-width:0;padding-top:9px}
.jm-process__term{font-family:Archivo,sans-serif;font-weight:700;font-size:23px;line-height:1.2;letter-spacing:-.3px;color:var(--e-global-color-primary,#0B0F14);transition:color .2s ease}
.jm-process__desc{font-family:Manrope,sans-serif;font-size:16px;line-height:1.6;max-width:62ch;color:var(--e-global-color-secondary,#5C656E)}
.jm-process__item:hover .jm-process__n{border-color:var(--e-global-color-accent,#D02B1F);background:var(--e-global-color-accent,#D02B1F)}
.jm-process__item:hover .jm-process__num{color:#fff}
.jm-process__item:hover .jm-process__term{color:var(--e-global-color-accent,#D02B1F)}
/* The ring is knocked out of the rail, so it needs the section's own ground. */
.jm-process--onsurface .jm-process__n{background:var(--e-global-color-surface,#F3F5F7)}
.jm-process--light .jm-process__item::before{background:#2A333B}
.jm-process--light .jm-process__n{border-color:#2A333B;background:#0B0F14}
.jm-process--light .jm-process__num{color:#fff}
.jm-process--light .jm-process__term{color:#fff}
.jm-process--light .jm-process__desc{color:#AEB5BC}
@media(max-width:767px){
  .jm-process__item{grid-template-columns:36px minmax(0,1fr);column-gap:18px;padding-bottom:26px}
  .jm-process__item::before{left:17px;top:36px}
  .jm-process__n{width:36px;height:36px}
  .jm-process__term{font-size:20px}
  .jm-process__body{padding-top:6px}
}

/* Icons in a cell. One weight, inherited colour, red on hover where the cell
   is a link. */
.jm-cell__ico{display:block;color:var(--e-global-color-accent,#D02B1F);margin-bottom:4px}
.jm-cell__ico .jm-ico{display:block}
.jm-cells--light .jm-cell__ico{color:#fff}

/* Hero scrim. Elementor's flat overlay cannot darken only the text area, and
   the cloud footage is bright exactly where the copy sits. */
.jm-hero-gloss{position:relative}
.jm-hero-gloss::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(to bottom,rgba(11,15,20,0) 0%,rgba(11,15,20,0) 42%,rgba(11,15,20,.30) 68%,rgba(11,15,20,.62) 100%)}
.jm-hero-gloss > .e-con-inner,
.jm-hero-gloss > .elementor-element{position:relative;z-index:2}
.jm-hero-gloss h1,
.jm-hero-gloss .elementor-widget-text-editor{text-shadow:0 1px 20px rgba(11,15,20,.45)}

/* Hero video fills the section. Elementor centres the video with a
   translate(-50%,-50%) and sets its size inline, so the transform has to be
   cancelled here or the element lands half out of frame to the top left. */
.jm-hero-gloss .elementor-background-video-container{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.jm-hero-gloss .elementor-background-video-hosted,
.jm-hero-gloss video{position:absolute!important;top:0!important;left:0!important;right:auto!important;bottom:auto!important;transform:none!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;object-position:center center}

/* FAQ. Elementor's nested accordion in the same hairline language as the rest
   of the site.

   Elementor lays the title row out with flex, so an earlier attempt to make it
   a grid was inert: the display came from Elementor and only the dead
   grid-template survived. Everything below works with the flex row it gives
   us, and the icon's side is set on the widget, not here, because its order
   comes from a custom property a kit rule cannot outrank.

   The icon is framed the same way as the arrow on the service rows, so the FAQ
   reads as part of the site rather than as a plugin default. */
.jm-faq .e-n-accordion{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--e-global-color-line,#E3E7EA)}
.jm-faq .e-n-accordion-item{border-bottom:1px solid var(--e-global-color-line,#E3E7EA);background:none;border-radius:0;overflow:hidden}
/* Row padding is set on the widget, which emits a per-post rule a kit rule
   cannot outrank. Everything else about the row is ours. */
.jm-faq .e-n-accordion-item-title{align-items:center;cursor:pointer;list-style:none;background:none;border:0;border-radius:0}
.jm-faq .e-n-accordion-item-title::-webkit-details-marker{display:none}
.jm-faq .e-n-accordion-item-title-header{min-width:0}
.jm-faq .e-n-accordion-item-title-text{font-family:Archivo,sans-serif;font-weight:700;font-size:21px;line-height:1.3;letter-spacing:-.3px;color:var(--e-global-color-primary,#0B0F14);transition:color .2s ease;margin:0}

.jm-faq .e-n-accordion .e-n-accordion-item-title-icon{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--e-global-color-line,#E3E7EA);border-radius:2px;transition:background-color .24s ease,border-color .24s ease}
.jm-faq .e-n-accordion-item-title:hover .e-n-accordion-item-title-text{color:var(--e-global-color-accent,#D02B1F)}
.jm-faq .e-n-accordion .e-n-accordion-item-title:hover .e-n-accordion-item-title-icon{border-color:var(--e-global-color-primary,#0B0F14)}
.jm-faq details[open] > .e-n-accordion-item-title .e-n-accordion-item-title-text{color:var(--e-global-color-accent,#D02B1F)}
.jm-faq .e-n-accordion details[open] > .e-n-accordion-item-title .e-n-accordion-item-title-icon{background:var(--e-global-color-accent,#D02B1F);border-color:var(--e-global-color-accent,#D02B1F)}

/* The answer. Held to a reading measure, and indented to the question's text
   so the open row reads as one block rather than two loose lines. */
.jm-faq .e-n-accordion-item > .e-con{max-width:72ch;--padding-top:0px;--padding-right:0px;--padding-bottom:28px;--padding-left:0px}

.jm-faq--light .e-n-accordion{border-top-color:#2A333B}
.jm-faq--light .e-n-accordion-item{border-bottom-color:#2A333B}
.jm-faq--light .e-n-accordion-item-title-text{color:#fff}
.jm-faq--light .e-n-accordion .e-n-accordion-item-title-icon{border-color:#2A333B}
.jm-faq--light .e-n-accordion .e-n-accordion-item-title:hover .e-n-accordion-item-title-icon{border-color:#fff}

@media(max-width:767px){
  .jm-faq .e-n-accordion-item-title-text{font-size:18px}
  .jm-faq .e-n-accordion .e-n-accordion-item-title-icon{width:34px;height:34px}
}


/* The header has to outrank the page, and on desktop it did not.

   Both hero families lift their content above their own scrim by giving the
   direct children position:relative and z-index:2. A positioned element with a
   z-index paints above every element that has neither, and the header had
   neither: position:relative was set only inside the 1024px burger query
   below. So on a desktop the Solutions dropdown opened underneath the hero
   headline and its last item, Helicopter Charter, sank into the text.

   200 sits clear of everything else here: the scrims are 1, the hero content is
   2, and the burger panel is 60 inside this same stacking context. */
.jm-header{position:relative;z-index:200}

/* The burger menu. The nav sits in a narrow header column, and the dropdown
   panel inherited that column's width: 80px on a phone, so every menu item
   overflowed and the whole document became four pixels pannable sideways.
   The panel is taken out of the column and hung under the header instead. */
@media(max-width:1024px){
  .jm-header{position:relative}
  /* The panel is absolute, so it resolves against the nearest positioned
     ancestor. That was the 80px nav column, which is why it opened as a narrow
     strip. Both the column and the widget have to go static for the header to
     become the containing block. */
  .jm-header [data-id="header-nav"],
  .jm-header .elementor-element-primary-nav{position:static}
  .jm-header nav.elementor-nav-menu--dropdown{position:absolute;top:100%;left:0;right:0;width:100%;max-width:100%;z-index:60;background:#fff;border-top:1px solid var(--e-global-color-line,#E3E7EA);box-shadow:none}
  .jm-header .elementor-nav-menu--dropdown .elementor-nav-menu{padding:6px 0}
  .jm-header .elementor-nav-menu--dropdown .elementor-item{padding:14px 20px;font-size:16px}
  .jm-header .elementor-nav-menu--dropdown .elementor-sub-item{padding:11px 20px 11px 34px;font-size:15px}
  .jm-header .elementor-nav-menu--dropdown .sub-arrow{padding-left:8px}
}

/* Header on a phone. The three columns were 46, 24 and 28 per cent plus a
   24px gap, which does not fit, so the telephone wrapped onto a second row
   below the logo. Narrower columns, a smaller gap, and the burger moved to the
   far right so the order reads logo, telephone, menu. */
@media(max-width:767px){
  .jm-header > .e-con-inner{--gap:10px}
  .jm-header [data-id="header-in"]{gap:10px;flex-wrap:nowrap}
  .jm-header [data-id="header-logo"]{width:40%;flex:0 0 40%}
  .jm-header [data-id="header-contact"]{width:44%;flex:0 0 44%;order:2}
  .jm-header [data-id="header-nav"]{width:16%;flex:0 0 16%;order:3}
  .jm-header .elementor-menu-toggle{margin-left:auto}
}

/* Nothing on this site is meant to scroll sideways. A stray pixel from a third
   party widget should not make the page pannable. */
html,body{overflow-x:clip}

/* Footer menus are lists, and the theme leaves the marker on them. The legal
   links showed bullets once they moved into their own column. */
.jm-footer .elementor-nav-menu,
.jm-footer .elementor-nav-menu li{list-style:none;margin:0;padding-left:0}
.jm-footer .elementor-nav-menu li::marker{content:none}



/* The footnote under a list. It used to sit below the last hairline with no
   connection to anything, aligned to nothing, reading as a stray sentence.
   A red rule ties it to the list it belongs to and the indent lines it up
   with the row content rather than the section edge. */
.jm-note{border-left:2px solid var(--e-global-color-accent,#D02B1F)}
.jm-note p{margin:0}
.jm-note--light{border-left-color:var(--e-global-color-accent,#D02B1F)}


/* Cells. The second face of the row list: short items in two or three columns
   under their own rule, instead of each taking a full width row. A page runs
   three to five list sections and they were all reading the same. */
.jm-cells{display:grid;column-gap:48px;row-gap:0;width:100%}
.jm-cells--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.jm-cells--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.jm-cells--4{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:34px}
.jm-cell{display:flex;flex-direction:column;gap:7px;padding:24px 0 26px;border-top:1px solid var(--e-global-color-line,#E3E7EA);text-decoration:none;position:relative}
.jm-cell__term{font-family:Archivo,sans-serif;font-weight:700;font-size:20px;line-height:1.25;letter-spacing:-.3px;color:var(--e-global-color-primary,#0B0F14);transition:color .2s ease}
.jm-cell__meta{font-family:Manrope,sans-serif;font-size:14px;line-height:1.5;color:var(--e-global-color-primary,#0B0F14);opacity:.7}
.jm-cell__desc{font-family:Manrope,sans-serif;font-size:15px;line-height:1.6;color:var(--e-global-color-secondary,#5C656E)}
.jm-cell__go{margin-top:auto;padding-top:12px;font-size:17px;line-height:1;color:var(--e-global-color-accent,#D02B1F);transition:transform .24s ease}
a.jm-cell:hover .jm-cell__term{color:var(--e-global-color-accent,#D02B1F)}
a.jm-cell:hover .jm-cell__go{transform:translateX(4px)}
.jm-cells--light .jm-cell{border-top-color:#2A333B}
.jm-cells--light .jm-cell__term{color:#fff}
.jm-cells--light .jm-cell__meta{color:#fff;opacity:.72}
.jm-cells--light .jm-cell__desc{color:#AEB5BC}
/* An odd number of cells in two columns leaves a hole at the bottom right.
   The last one spans instead, so the block closes on a full width rule. */
.jm-cells--2 > .jm-cell:last-child:nth-child(odd){grid-column:1 / -1}
.jm-cells--2 > .jm-cell:last-child:nth-child(odd) .jm-cell__desc{max-width:62ch}
@media(max-width:1100px){
  .jm-cells--3,.jm-cells--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .jm-cells{column-gap:34px}
}
@media(max-width:767px){
  .jm-cells--2,.jm-cells--3,.jm-cells--4{grid-template-columns:1fr}
  .jm-cell{padding:20px 0 22px}
  .jm-cell__term{font-size:18px}
}



/* Portrait in an aside column. A hairline and a hard crop rather than a round
   avatar, which would belong to a different kind of site. */
.jm-portrait img{display:block;width:100%;max-width:300px;height:auto;aspect-ratio:4 / 5;object-fit:cover;object-position:center top;border-radius:2px}
.jm-portrait{margin-bottom:10px}
@media(max-width:767px){.jm-portrait img{max-width:200px}}


/* Enquiry form. Elementor ships rounded grey inputs; this is the same hairline
   language as the rest of the site. Labels above, a single rule under each
   field rather than a box, and the accent only on focus so the form is quiet
   until you are working in it. */
.jm-form .elementor-field-group{margin-bottom:4px}
.jm-form .elementor-field-group > label{font-family:Manrope,sans-serif;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--e-global-color-bodymid,#7A828B);margin-bottom:7px}
.jm-form .elementor-field-group .elementor-field-textual{font-family:Manrope,sans-serif;font-size:16px;line-height:1.5;color:var(--e-global-color-primary,#0B0F14);background:transparent;border:0;border-bottom:1px solid var(--e-global-color-line,#E3E7EA);border-radius:0;padding:10px 0;box-shadow:none;transition:border-color .2s ease}
.jm-form .elementor-field-group .elementor-field-textual:focus{outline:none;border-bottom-color:var(--e-global-color-accent,#D02B1F);box-shadow:none}
.jm-form .elementor-field-group .elementor-field-textual::placeholder{color:#9AA2AA}
.jm-form select.elementor-field-textual{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#7A828B 50%),linear-gradient(135deg,#7A828B 50%,transparent 50%);background-position:calc(100% - 13px) calc(50% + 2px),calc(100% - 8px) calc(50% + 2px);background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:26px}
.jm-form textarea.elementor-field-textual{border:1px solid var(--e-global-color-line,#E3E7EA);padding:12px 14px;resize:vertical}
.jm-form textarea.elementor-field-textual:focus{border-color:var(--e-global-color-accent,#D02B1F)}
/* Consent. A real checkbox, sized to be hit, with the notice beside it. */
.jm-form .elementor-field-type-acceptance{margin-top:14px}
.jm-form .elementor-field-option{display:flex;align-items:flex-start;gap:11px}
.jm-form .elementor-field-option input[type=checkbox]{flex:0 0 auto;width:17px;height:17px;margin-top:2px;accent-color:var(--e-global-color-accent,#D02B1F)}
.jm-form .elementor-field-option label{font-family:Manrope,sans-serif;font-size:14px;line-height:1.55;color:var(--e-global-color-secondary,#5C656E);text-transform:none;letter-spacing:0;font-weight:400;margin:0}
.jm-form .elementor-field-option label a{color:var(--e-global-color-primary,#0B0F14);text-decoration:underline;text-underline-offset:2px}
.jm-form .elementor-field-option label a:hover{color:var(--e-global-color-accent,#D02B1F)}
/* The required marker should not shout. */
.jm-form .elementor-mark-required .elementor-field-label:after{color:var(--e-global-color-accent,#D02B1F);margin-left:3px}
/* Submit, the same object as every other primary button on the site. */
.jm-form .elementor-field-type-submit{margin-top:22px}
.jm-form button[type=submit]{font-family:Manrope,sans-serif;font-size:15px;font-weight:600;letter-spacing:0;color:#fff;background:var(--e-global-color-accent,#D02B1F);border:0;border-radius:2px;padding:17px 30px;width:auto;transition:background-color .24s ease}
.jm-form button[type=submit]:hover{background:#A21D14}
.jm-form .elementor-message{font-family:Manrope,sans-serif;font-size:15px;margin-top:14px}
.jm-form .elementor-message.elementor-message-danger{color:var(--e-global-color-accent,#D02B1F)}
@media(max-width:767px){
  .jm-form .elementor-field-group .elementor-field-textual{font-size:16px}
  .jm-form button[type=submit]{width:100%}
}

/* Boxed cells. Same grid, but each item sits in a panel. For sections that
   are a set of assertions rather than a list of things, where the hairline
   alone left too much air. No shadows: the site has none, so a box here is a
   hairline and a ground, not a floating card. */
.jm-cells--boxed{column-gap:24px;row-gap:24px}
.jm-cells--boxed > .jm-cell{padding:28px 30px 30px;border:1px solid var(--e-global-color-line,#E3E7EA);border-top:1px solid var(--e-global-color-line,#E3E7EA);border-radius:2px;background:#fff;transition:border-color .24s ease}
.jm-cells--boxed > .jm-cell::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:2px;background:var(--e-global-color-accent,#D02B1F);opacity:0;transition:opacity .24s ease}
.jm-cells--boxed > .jm-cell:hover::before{opacity:1}
.jm-cells--boxed.jm-cells--light > .jm-cell{background:#12171D;border-color:#2A333B}
.jm-cells--boxed.jm-cells--light > .jm-cell:hover{border-color:#3A444E}
.jm-cells--boxed > .jm-cell:last-child:nth-child(odd){grid-column:auto}

/* The document panel. A facsimile of the quote, because the section is about
   what that document contains. The header strip carries the ink so the panel
   reads as a thing you receive rather than as another list. */
.jm-doc{border:1px solid var(--e-global-color-line,#E3E7EA);border-radius:2px;background:#fff;overflow:hidden;width:100%}
.jm-doc__head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 24px;background:var(--e-global-color-primary,#0B0F14)}
.jm-doc__label{font-family:Manrope,sans-serif;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.jm-doc__mark{font-family:Archivo,sans-serif;font-size:12px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#7A828B}
.jm-doc__body{padding:4px 24px 8px}
.jm-doc__row{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:20px;padding:18px 0;border-bottom:1px solid var(--e-global-color-line,#E3E7EA)}
.jm-doc__row:last-child{border-bottom:0}
.jm-doc__n{font-family:Archivo,sans-serif;font-weight:700;font-size:12px;line-height:1.9;color:var(--e-global-color-accent,#D02B1F);font-variant-numeric:tabular-nums}
/* An icon replaces the index where one is given. Sized down from the 28px
   grid icons, because here it sits beside a 17px term rather than above it. */
.jm-doc__ico{display:block;margin-top:1px}
.jm-doc__ico .jm-ico{display:block;width:20px;height:20px}
.jm-doc__cell{display:flex;flex-direction:column;gap:5px;min-width:0}
.jm-doc__term{font-family:Archivo,sans-serif;font-weight:700;font-size:17px;line-height:1.3;color:var(--e-global-color-primary,#0B0F14)}
.jm-doc__meta{font-family:Manrope,sans-serif;font-size:13px;line-height:1.5;color:var(--e-global-color-primary,#0B0F14);opacity:.7}
.jm-doc--light .jm-doc__meta{color:#fff;opacity:.72}
.jm-doc__desc{font-family:Manrope,sans-serif;font-size:14px;line-height:1.55;color:var(--e-global-color-secondary,#5C656E)}
.jm-doc--light{background:#12171D;border-color:#2A333B}
.jm-doc--light .jm-doc__head{background:#000}
.jm-doc--light .jm-doc__row{border-bottom-color:#2A333B}
.jm-doc--light .jm-doc__term{color:#fff}
.jm-doc--light .jm-doc__desc{color:#AEB5BC}
@media(max-width:767px){
  .jm-cells--boxed > .jm-cell{padding:22px 22px 24px}
  .jm-doc__body{padding:4px 18px 8px}
  .jm-doc__row{grid-template-columns:26px minmax(0,1fr);column-gap:12px}
}

/* Specification table. Reads as an index in the same language as the rest of
   the site, not as a spreadsheet.

   The theme's reset.css sets a 1px border on every table cell, which is what
   drew the grid. A border-bottom longhand does not undo a border shorthand, so
   every cell is zeroed first and the hairlines are put back on the row.
   Backgrounds are cleared for the same reason. */
.jm-spec-wrap{width:100%;overflow-x:auto}
.jm-spec{width:100%;border-collapse:collapse;border-spacing:0;font-family:Manrope,sans-serif;font-size:16px;color:var(--e-global-color-secondary,#5C656E)}
.jm-spec th,.jm-spec td{border:0;background:none;text-align:left;vertical-align:top}
.jm-spec caption{text-align:left;font-family:Manrope,sans-serif;font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--e-global-color-bodymid,#7A828B);padding:0 0 18px}

.jm-spec thead th{font-family:Manrope,sans-serif;font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--e-global-color-bodymid,#7A828B);padding:0 32px 13px 0;border-bottom:2px solid var(--e-global-color-primary,#0B0F14)}

.jm-spec tbody tr{border-bottom:1px solid var(--e-global-color-line,#E3E7EA)}
.jm-spec tbody th{font-family:Archivo,sans-serif;font-weight:700;font-size:19px;line-height:1.25;letter-spacing:-.3px;color:var(--e-global-color-primary,#0B0F14);padding:22px 32px 22px 0;white-space:nowrap;transition:color .2s ease}
.jm-spec tbody td{padding:24px 32px 22px 0;line-height:1.55}
/* The aircraft column is a list of names, so it sits closer to the label than
   to the prose in the last column. */
.jm-spec tbody td:first-of-type{color:var(--e-global-color-primary,#0B0F14);font-size:15px}
/* A figure column is marked by the builder, because its position changes from
   table to table and nth-child guesses wrong. */
.jm-spec__num{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--e-global-color-primary,#0B0F14)!important;font-size:16px!important}
.jm-spec th:last-child,.jm-spec td:last-child{padding-right:0}
.jm-spec tbody td:last-child{max-width:52ch}

.jm-spec tbody tr:hover th{color:var(--e-global-color-accent,#D02B1F)}

.jm-spec--light{color:#AEB5BC}
.jm-spec--light thead th{color:#7A828B;border-bottom-color:#fff}
.jm-spec--light tbody tr{border-bottom-color:#2A333B}
.jm-spec--light tbody th{color:#fff}
.jm-spec--light tbody td:first-of-type,.jm-spec--light .jm-spec__num{color:#fff!important}

@media(max-width:900px){
  .jm-spec thead th,.jm-spec tbody th,.jm-spec tbody td{padding-right:22px}
}
@media(max-width:767px){
  /* Below this the columns stop being readable side by side, so each row
     becomes a block: the label, then each cell under its own column name. */
  .jm-spec,.jm-spec tbody,.jm-spec tbody tr,.jm-spec tbody th,.jm-spec tbody td{display:block;width:100%}
  .jm-spec thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .jm-spec tbody tr{padding:20px 0}
  .jm-spec tbody th{padding:0 0 10px;white-space:normal;font-size:20px}
  .jm-spec tbody td{padding:0 0 7px;font-size:15px}
  .jm-spec tbody td:last-child{max-width:none;padding-bottom:0}
  .jm-spec tbody td::before{content:attr(data-label);display:block;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--e-global-color-bodymid,#7A828B);margin-bottom:3px}
}

/* A numbered row now reacts, so the list reads as something you can work
   through rather than a printed page. */
.jm-process__item{transition:border-color .2s ease}
.jm-process__item:hover .jm-process__n{color:var(--e-global-color-primary,#0B0F14)}
.jm-process--light .jm-process__item:hover .jm-process__n{color:#fff}

/* ========================================================== 3. after ===
   Replaces the blocks that used to reach into Elementor, and adds what the
   static build introduces. */

/* ---- hero, which no longer has an Elementor element to lift ---- */
.jm-phero{
  position:relative;min-height:var(--minH,560px);
  display:flex;align-items:flex-end;
  padding-block:150px 64px;
  background-size:cover;background-position:center center;background-repeat:no-repeat;
}
.jm-phero::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:linear-gradient(to bottom,rgba(11,15,20,.10) 0%,rgba(11,15,20,.06) 34%,rgba(11,15,20,.46) 68%,rgba(11,15,20,.76) 100%);
}
.jm-phero__in{position:relative;z-index:2}
.jm-phero__col{max-width:62%;display:flex;flex-direction:column;gap:20px}
.jm-phero__col > *{margin:0}
.jm-phero h1,.jm-phero .jm-lead{text-shadow:0 1px 20px rgba(11,15,20,.42)}

/* ---- band ----
   The two scrims are the KIT's, ::before left to right and ::after bottom up,
   and they were designed as a pair. Do not add a third here: an earlier
   version did, which replaced the bottom up one and left the copy sitting on
   bare photograph.

   The copy sits bottom left, which is why the bottom up scrim exists. */
.jm-band{
  min-height:var(--minH,520px);
  display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;
  padding:0 var(--gutter) 52px;
  background-size:cover;background-position:center center;background-repeat:no-repeat;
}
.jm-band > .jm-wrap{padding-inline:0}
.jm-band .jm-display{color:#fff}
.jm-band .jm-rich,.jm-band .jm-lead{color:var(--on-ink)}

/* ---- split ---- */
.jm-split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.jm-split__text > *:first-child{margin-top:0}
.jm-split__media img{width:100%;height:auto;border:1px solid var(--line)}
.jm-s--ink .jm-split__media img,.jm-s--inksoft .jm-split__media img{border-color:rgba(255,255,255,.14)}

/* ---- aside layout ---- */
.jm-aside{display:grid;grid-template-columns:32% 1fr;gap:56px;align-items:start}
.jm-aside__head > *:first-child{margin-top:0}

/* ---- cta ---- */
.jm-cta{max-width:62ch}
.jm-cta__btn{margin:28px 0 0}

/* ---- the footnote under a list ----
   The kit only ever set the red rule. The indent, size and colour came from
   Elementor writing a per-post rule, which does not exist here, so the
   stylesheet has to own all of it now. Without this the note sits hard against
   its own border with body-sized text. */
.jm-note{
  margin:26px 0 0;padding-left:16px;max-width:72ch;
  border-left:2px solid var(--red);
}
.jm-note p{margin:0;font-size:15px;line-height:1.6;color:var(--dim)}
.jm-s--light .jm-note p,.jm-s--ink .jm-note p,.jm-s--inksoft .jm-note p{color:var(--on-ink-dim)}

/* ---- FAQ as a real <details>. No widget, no JavaScript, and none of the
   nested-accordion border fights that cost three rounds. ---- */
.jm-faq{border-top:1px solid var(--line)}
.jm-s--ink .jm-faq,.jm-s--inksoft .jm-faq{border-color:rgba(255,255,255,.16)}
.jm-faq__item{border-bottom:1px solid var(--line)}
.jm-s--ink .jm-faq__item,.jm-s--inksoft .jm-faq__item{border-color:rgba(255,255,255,.16)}
.jm-faq__q{
  list-style:none;cursor:pointer;display:flex;align-items:flex-start;
  justify-content:space-between;gap:24px;
  font-family:var(--display);font-weight:600;font-size:21px;line-height:1.3;
  letter-spacing:-.012em;color:var(--ink);padding:23px 0;
}
.jm-s--light .jm-faq__q{color:#fff}
.jm-faq__q::-webkit-details-marker{display:none}
.jm-faq__sign{flex:0 0 auto;position:relative;width:14px;height:14px;margin-top:7px}
.jm-faq__sign::before,.jm-faq__sign::after{
  content:"";position:absolute;background:var(--red);transition:transform .2s ease}
.jm-faq__sign::before{inset:6px 0 auto 0;height:1.5px}
.jm-faq__sign::after{inset:0 auto 0 6px;width:1.5px}
.jm-faq__item[open] .jm-faq__sign::after{transform:scaleY(0)}
.jm-faq__a{padding:0 0 24px;max-width:70ch}
.jm-faq__a p{margin:0 0 14px;color:var(--dim);font-size:17px;line-height:1.65}
.jm-faq__a p:last-child{margin-bottom:0}
.jm-s--light .jm-faq__a p{color:var(--on-ink)}

/* ---- header ---- */
.jm-header{
  position:relative;z-index:200;          /* must outrank the hero, see CLAUDE.md */
  background:var(--paper);border-bottom:1px solid var(--line);
}
.jm-header__in{display:flex;align-items:center;justify-content:space-between;gap:24px;
  min-height:72px;padding-block:14px}
.jm-logo{font-family:var(--display);font-weight:700;font-size:22px;line-height:1;
  letter-spacing:2px;color:var(--ink);text-decoration:none;white-space:nowrap}
.jm-nav{display:flex;align-items:center;gap:28px}
.jm-nav a{font-size:15px;font-weight:500;letter-spacing:0;text-decoration:none;color:var(--ink)}
.jm-nav a:hover{color:var(--red)}
.jm-nav__item{position:relative}
.jm-nav__sub{
  position:absolute;top:100%;left:-18px;min-width:230px;margin:0;padding:8px 0;
  list-style:none;background:var(--paper);border:1px solid var(--line);
  opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .16s ease,transform .16s ease,visibility .16s;
}
.jm-nav__item:hover .jm-nav__sub,.jm-nav__item:focus-within .jm-nav__sub{opacity:1;visibility:visible;transform:none}
.jm-nav__sub a{display:block;padding:11px 20px;font-size:14.5px}
.jm-header__contact{text-align:right;line-height:1.2}
.jm-header__mail{font-family:var(--body);font-weight:600;font-size:16px;letter-spacing:0;
  color:var(--ink);text-decoration:none;display:block}
.jm-header__note{font-size:12px;color:#7A828B;margin-top:2px}
.jm-burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.jm-burger span{display:block;width:22px;height:2px;background:var(--ink);margin:4px 0}

/* ---- the mobile menu ----
   This was written into the shell and never given any CSS, so opening the
   burger produced thirteen underlined links running together as one
   paragraph. One row per link, hairlines between, children indented. */
.jm-mobile{
  border-top:1px solid var(--line);
  background:var(--paper);
  padding-block:6px 10px;
}
.jm-mobile a{
  display:block;padding:13px 0;
  font-size:16px;font-weight:500;text-decoration:none;color:var(--ink);
  border-bottom:1px solid var(--line);
}
.jm-mobile a:last-child{border-bottom:0}
.jm-mobile a:active{color:var(--red)}
/* Written as a.jm-mobile__sub on purpose. The rule above sets the padding
   shorthand on every link, which outranks a bare .jm-mobile__sub longhand
   and resets the indent to zero. Same shorthand-beats-longhand trap as the
   footnote. */
.jm-mobile a.jm-mobile__sub{
  padding-left:18px;font-size:15px;font-weight:400;color:var(--dim);
}
.jm-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.jm-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.jm-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.jm-burger span{transition:transform .18s ease,opacity .18s ease}

/* The aside layout's right column. Without min-width:0 a long unbroken
   string in a grid child refuses to shrink and pushes the row wider. */
.jm-aside__body{min-width:0}

/* ---- the measurement notice ----
   A bar, not a modal: it does not block the page, because nothing is being
   collected while it is open. House style, so a hairline and a ground and no
   shadow. The safe-area inset matters on a phone with a home indicator. */
.jm-consent{
  position:fixed;left:0;right:0;bottom:0;z-index:300;
  background:var(--ink);color:var(--on-ink);
  border-top:1px solid rgba(255,255,255,.16);
  padding-block:16px;
  padding-bottom:calc(16px + env(safe-area-inset-bottom, 0px));
}
.jm-consent__in{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px 32px;flex-wrap:wrap;
}
.jm-consent__text{
  margin:0;font-size:14px;line-height:1.55;color:var(--on-ink);max-width:68ch;
}
.jm-consent__text a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.jm-consent__btns{display:flex;gap:10px;flex-shrink:0}
.jm-consent .jm-btn{padding:12px 22px;font-size:14px;cursor:pointer}

@media(max-width:767px){
  .jm-consent__in{flex-direction:column;align-items:stretch}
  .jm-consent__text{font-size:13px}
  .jm-consent__btns{justify-content:stretch}
  .jm-consent .jm-btn{flex:1 1 auto;text-align:center}
}

/* classic.js marks light display type with its own class rather than relying
   on the section ground, which the hero and band both need. */
.jm-display--light{color:#fff}

/* ---- footer ---- */
.jm-footer{background:var(--ink);color:var(--on-ink-dim);padding-block:72px 0;font-size:14px}
.jm-footer a{color:var(--on-ink-dim);text-decoration:none}
.jm-footer a:hover{color:#fff}
.jm-footer__cols{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.4fr;gap:40px}
.jm-footer__label{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:#7A828B;margin:0 0 14px}
.jm-footer ul{list-style:none;margin:0;padding:0}
.jm-footer li{margin-bottom:9px;line-height:1.5}
.jm-footer__bar{margin-top:56px;border-top:1px solid rgba(255,255,255,.12);
  padding-block:22px 28px;text-align:center;font-size:13px;color:#7A828B}

/* ---- enquiry form ---- */
.jm-form{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px}
.jm-form .f-wide{grid-column:1 / -1}
.jm-form label{display:block;font-size:13px;font-weight:600;letter-spacing:.02em;
  color:var(--ink);margin-bottom:7px}
.jm-form input,.jm-form select,.jm-form textarea{
  width:100%;font-family:var(--body);font-size:16px;line-height:1.4;color:var(--ink);
  background:#fff;border:1px solid var(--line);border-radius:2px;padding:13px 14px;
}
.jm-form textarea{min-height:124px;resize:vertical}
.jm-form input:focus,.jm-form select:focus,.jm-form textarea:focus{
  outline:none;border-color:var(--ink)}
.jm-form input::placeholder,.jm-form textarea::placeholder{color:#9AA2A9}
.jm-form .f-consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--dim)}
.jm-form .f-consent input{width:auto;margin-top:3px}
.jm-form .f-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.jm-form__msg{grid-column:1 / -1;font-size:15px;margin:0}
.jm-form__msg--err{color:var(--red)}

/* ---- the home page's own containers ----
   build-home.js hands back rich-text blocks and columns rather than the
   typed classes the section families use, so those need styling too. */
.jm-rich{font-size:var(--fs,18px);line-height:1.65;color:var(--dim)}
.jm-rich p{margin:0 0 16px;max-width:62ch}
.jm-rich p:last-child{margin-bottom:0}
.jm-rich--light,.jm-s--light .jm-rich{color:var(--on-ink)}
.jm-rich a{color:inherit;text-decoration:underline;text-underline-offset:3px}

.jm-col{display:flex;flex-direction:column;gap:18px;width:100%;max-width:100%}
.jm-wrap > .jm-col{flex:0 1 auto}
.jm-row{display:flex;flex-wrap:wrap;gap:36px 64px;align-items:center}
.jm-row > .jm-col{flex:1 1 var(--w,50%);max-width:var(--w,100%)}
.jm-col > .jm-display{margin:0}

.jm-pic img{width:100%;height:auto;border:1px solid rgba(255,255,255,.14)}

/* The hero with the background video. The poster shows until the first frame,
   and a phone in Low Power Mode never gets past it, which is why the poster
   has to be worth looking at on its own. */
.jm-hero-gloss{
  position:relative;min-height:88vh;display:flex;align-items:flex-end;
  padding-block:120px 80px;overflow:hidden;background:var(--ink);
}
.jm-hero-gloss__video{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center center;z-index:0;
}
.jm-hero-gloss::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(11,15,20,0) 0%,rgba(11,15,20,0) 42%,rgba(11,15,20,.30) 68%,rgba(11,15,20,.62) 100%);
}
.jm-hero-gloss > .jm-wrap,.jm-hero-gloss > div{position:relative;z-index:2}
.jm-hero-gloss .jm-display{color:#fff;text-shadow:0 1px 20px rgba(11,15,20,.45)}
.jm-hero-gloss .jm-rich{color:var(--on-ink);text-shadow:0 1px 20px rgba(11,15,20,.45)}
.jm-hero-gloss [id$="-cta"]{display:flex;flex-wrap:wrap;gap:14px;padding-top:10px}

/* The home page band is the same component, built by hand rather than by
   the family, so it needs nothing extra: the kit scrims and the rules above
   already cover it. */

.f-field{display:flex;flex-direction:column}

/* ============================================================ responsive */
@media(max-width:900px){
  .jm-row{gap:28px}
  .jm-row > .jm-col{flex:1 1 100%;max-width:100%}
}
@media(max-width:767px){
  .jm-hero-gloss{min-height:90vh;padding-block:90px 56px}
}
@media(max-width:1100px){
  .jm-aside{grid-template-columns:1fr;gap:30px}
}
@media(max-width:900px){
  :root{--gutter:28px}
  .jm-split{grid-template-columns:1fr;gap:32px}
  .jm-phero__col{max-width:80%}
  .jm-col--68,.jm-col--74{max-width:100%}
  .jm-footer__cols{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:1024px){
  .jm-nav{display:none}
  .jm-burger{display:block;order:3}
  .jm-header__in{flex-wrap:nowrap;gap:10px}
}
@media(max-width:767px){
  :root{--gutter:20px}
  body{font-size:17px}
  .jm-s{padding-block:calc(var(--padY,88px) * .62)}
  .jm-phero{padding-block:110px 44px}
  .jm-phero__col{max-width:100%}
  .jm-lead{font-size:17px}
  .jm-form{grid-template-columns:1fr}
  .jm-footer__cols{grid-template-columns:1fr;gap:28px}
  .jm-header__mail{font-size:12px}
  .jm-header__note{font-size:10px}
  .jm-logo{font-size:17px}
  .jm-faq__q{font-size:18px}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}