/* Jeep campaign imagery within XR Studio's dark visual identity. */
.jp-page { --jp-lime:#cfec94; }
.jp-page .pm-hero { grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr); gap:90px; padding-block:60px; }
.jp-page .pm-hero h1 { font-size:clamp(58px,6.5vw,90px); }
.jp-page .pm-hero h1 span { font-size:1em; }
.jp-page .pm-lead { max-width:26ch; font-size:clamp(23px,2.7vw,34px); }
.jp-intro { max-width:49ch; color:var(--pm-muted); margin:0 0 28px; }
.jp-film { width:100%; max-width:350px; justify-self:end; margin:0; }
.jp-film .xr-case-video-trigger { width:100%; border-radius:22px; background:#17221b; border:1px solid #cfec9440; }
.jp-film img { display:block; width:100%; height:auto; aspect-ratio:9/16; }
.jp-film figcaption { color:var(--pm-muted); font-size:11px; margin-top:12px; text-align:center; }
.jp-page .pm-meta { grid-template-columns:repeat(4,minmax(0,1fr)); }
.jp-page .pm-meta>div:last-child { grid-column:auto; }
.jp-page .pm-meta dd { font-size:15px; }
.jp-story { display:grid; grid-template-columns:1fr 1fr; gap:90px; padding-block:76px 50px; }
.jp-story>div>p:not(.pm-eyebrow) { color:var(--pm-muted); }
.jp-story .pm-steps { margin:0; }
.jp-story .pm-steps li:first-child { padding-top:0; border-top:0; }
.jp-story .pm-steps li:first-child::before { top:2px; }
.jp-story .pm-steps p { color:var(--pm-muted); }
.jp-delivery { padding:28px 32px; border:1px solid #cfec9430; border-left:3px solid var(--jp-lime); background:linear-gradient(120deg,#17221b,#101211); border-radius:0 16px 16px 0; }
.jp-delivery h3 { margin:0 0 10px; font-size:20px; }
.jp-delivery p { margin:0; color:var(--pm-muted); max-width:90ch; }
.jp-gallery { padding-block:70px; }
.jp-gallery-head { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:30px; }
.jp-gallery-head h2 { margin:0; }
.jp-gallery-head>p { color:var(--pm-muted); font-size:13px; max-width:32ch; margin:0; }
.jp-gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.jp-gallery figure { margin:0; border:1px solid #ffffff20; border-radius:18px; overflow:hidden; background:#121412; }
.jp-gallery img { display:block; width:100%; height:auto; aspect-ratio:9/16; }
.jp-gallery figcaption { padding:22px; }
.jp-gallery figcaption strong { display:block; font-size:18px; margin-bottom:7px; }
.jp-gallery figcaption span { color:var(--pm-muted); font-size:13px; }
.jp-related { margin-bottom:55px; font-size:14px; color:var(--pm-muted); }
.jp-related a { color:var(--jp-lime); text-underline-offset:4px; }
.jp-page :focus-visible { outline:2px solid #ff80bb; outline-offset:5px; }
@media (max-width:1000px) {
 .jp-page .pm-hero { gap:40px; }
 .jp-story { gap:40px; }
 .jp-page .pm-meta { grid-template-columns:1fr 1fr; }
 .jp-gallery-grid { gap:15px; } .jp-gallery figcaption { padding:16px; }
}
@media (max-width:700px) {
 .jp-page .pm-hero { grid-template-columns:minmax(0,1fr); padding-block:42px; }
 .jp-page .pm-hero h1 { font-size:clamp(55px,14vw,76px); }
 .jp-film { justify-self:center; max-width:330px; }
 .jp-story { grid-template-columns:1fr; padding-block:50px 30px; gap:30px; }
 .jp-gallery-head { display:block; } .jp-gallery-head>p { margin-top:16px; }
 .jp-gallery-grid { grid-template-columns:1fr; gap:24px; max-width:390px; margin:auto; }
 .jp-gallery { padding-block:50px; }
 .jp-delivery { padding:24px; }
 .jp-page .pm-actions { flex-direction:column; }
 .jp-page .pm-bottom { align-items:stretch; }
}
@media (prefers-reduced-motion:reduce) {
 .jp-page *, .jp-page *::before, .jp-page *::after { transition:none!important; animation:none!important; }
}
