/** Shopify CDN: Minification failed

Line 763:0 Unexpected "<"

**/
.pmi-wrap *, .pmi-wrap *::before, .pmi-wrap *::after { box-sizing:border-box; margin:0; padding:0; }

/* ── PALETTE — Excel: black · maroon · gold ────────────────
   #1A1A1A  headings and ink      #7A1F22  maroon, the primary
   #B4884A  gold, the accent      #C62828  Excel red (required *)
   #F0E9DF  the ground colour     #DCCFBC  hairlines and dividers

   To go redder, set --ex-maroon to #C62828 and --ex-maroon-d to
   #A31E1E. To go blacker, set --ex-maroon to #1A1A1A. Nothing
   else needs touching.
──────────────────────────────────────────────────────── */
.pmi-wrap {
  --ex-cream:   #FBF8F4;   /* palest tone, for the alternating sections */
  --ex-sand:    #F0E9DF;   /* the ground colour                          */
  --ex-sand2:   #E3D8C9;   /* image wells, one step deeper               */
  --ex-line:    #DCCFBC;   /* hairlines and dividers                     */
  --ex-maroon:  #7A1F22;   /* accents — small caps, marks, button fill   */
  --ex-maroon-d:#5C1518;   /* deeper accent                              */
  --ex-gold:    #B4884A;   /* gold — rules, dots, decorative line art    */
  --ex-gold-l:  #DCC79B;   /* light gold — bars and hairline accents     */
  --ex-gold-d:  #8C6B2F;   /* deep gold — the metallic headline fallback */
  --ex-ink:     #1A1A1A;   /* headings                                   */
  --ex-body:    #4A4340;
  --ex-soft:    #6B6058;
  --ex-red:     #C62828;   /* Excel red — required-field marks only      */

  background:var(--ex-cream)!important; color:var(--ex-ink)!important;
  font-family:'DM Sans',sans-serif!important; font-size:16px!important; font-weight:300;
  overflow-x:hidden; -webkit-font-smoothing:antialiased;
}
.pmi-wrap a   { text-decoration:none; color:inherit; }
.pmi-wrap img { display:block; max-width:100%; }
.pmi-wrap button, .pmi-wrap input, .pmi-wrap textarea, .pmi-wrap select {
  font-family:'DM Sans',sans-serif; font-size:14px; font-weight:300; color:var(--ex-ink);
}
.pmi-req { color:var(--ex-red); font-weight:700; }

/* ── REVEALS ── */
.pmi-reveal { opacity:0; transform:translateY(18px);
  transition:opacity .75s cubic-bezier(.4,0,.2,1), transform .75s cubic-bezier(.4,0,.2,1); }
.pmi-reveal.pmi-vis { opacity:1; transform:translateY(0); }
.pmi-reveal-l { opacity:0; transform:translateX(-18px);
  transition:opacity .75s cubic-bezier(.4,0,.2,1), transform .75s cubic-bezier(.4,0,.2,1); }
.pmi-reveal-l.pmi-vis { opacity:1; transform:translateX(0); }
.pmi-d1{transition-delay:.08s} .pmi-d2{transition-delay:.16s} .pmi-d3{transition-delay:.24s}
.pmi-d4{transition-delay:.32s} .pmi-d5{transition-delay:.40s}

/* ══════════════════════════════════════════════════════════
   1 · HERO
   PRISM runs a photo with a dark scrim and white type. This
   page keeps the Rose Gold treatment instead — a LIGHT scrim,
   ink type with its own halo — so the page stays in the same
   tone as the rest of the site.
══════════════════════════════════════════════════════════ */
.pmi-hero {
  position:relative; min-height:66vh;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; background:var(--ex-sand);
  padding:82px 40px 118px;
}
.pmi-hero-fallback {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse 70% 60% at 50% 32%, rgba(253,251,248,.90) 0%, transparent 72%),
    radial-gradient(ellipse 52% 52% at 88% 92%, rgba(220,199,155,.44) 0%, transparent 70%),
    radial-gradient(ellipse 48% 48% at 8% 8%, rgba(220,199,155,.36) 0%, transparent 70%);
}
.pmi-hero-still {
  position:absolute; inset:0; z-index:1;
  background-size:cover; background-position:center;
  opacity:0; transition:opacity 1.2s ease;
  filter:brightness(1.14) saturate(.88) contrast(.95);
}
.pmi-hero-still.pmi-on { opacity:1; }
.pmi-hero-video {
  position:absolute; inset:0; z-index:1;
  width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity 1.5s ease;
  filter:brightness(1.16) saturate(.86) contrast(.94);
}
.pmi-hero-video.pmi-playing { opacity:1; }

/* ── YOUTUBE CLIP LAYER ──
   For playing a segment of an existing YouTube video behind the
   headline (see PMI_MEDIA.youtube at the foot of the file). The
   iframe is sized by JS to COVER the hero box — 16:9 footage in a
   wider-than-16:9 hero would otherwise letterbox — and it is
   pointer-events:none so the whole thing stays un-clickable and
   reads as a background, not a video player. */
.pmi-hero-yt {
  position:absolute; inset:0; z-index:1;
  overflow:hidden; pointer-events:none;
  opacity:0; transition:opacity 1.4s ease;
}
.pmi-hero-yt.pmi-on { opacity:1; }
.pmi-hero-yt iframe {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  border:0; pointer-events:none;
  /* matched to the still/video layers so all three sit back
     behind the type in the same way */
  filter:brightness(1.14) saturate(.88) contrast(.95);
}

.pmi-hero-scrim {
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    radial-gradient(ellipse 54% 52% at 50% 50%, rgba(251,248,244,.86) 0%, rgba(251,248,244,.40) 100%),
    linear-gradient(180deg, rgba(251,248,244,.54) 0%, rgba(240,233,223,.28) 46%, rgba(240,233,223,.82) 100%);
}
.pmi-hero-silk {
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    radial-gradient(ellipse 34% 66% at 2% 96%, rgba(255,255,255,.52) 0%, transparent 62%),
    radial-gradient(ellipse 30% 60% at 4% 108%, rgba(198,175,132,.42) 0%, transparent 64%);
}
.pmi-hero-content { position:relative; z-index:3; text-align:center!important; max-width:1180px; }

.pmi-eyebrow-row {
  display:flex; align-items:center; justify-content:center; gap:14px; margin-bottom:20px;
}
.pmi-eyebrow-row span {
  font-family:'Syne',sans-serif!important; font-size:9.5px!important; font-weight:700;
  letter-spacing:.38em; text-transform:uppercase; color:var(--ex-maroon)!important;
  text-shadow:0 1px 14px rgba(251,248,244,.95);
}
.pmi-eyebrow-line { width:32px; height:1px; background:var(--ex-gold); opacity:.85; }

.pmi-hero-headline {
  font-family:'Cormorant Garamond',serif!important;
  font-size:clamp(38px,5.6vw,78px)!important;
  font-weight:300!important; line-height:.98!important; letter-spacing:-.026em!important;
  color:var(--ex-ink)!important; text-align:center!important; margin-bottom:20px!important;
  text-shadow:0 1px 28px rgba(251,248,244,.98), 0 1px 8px rgba(251,248,244,.9);
}
.pmi-hero-headline em {
  display:block; font-style:italic!important; font-weight:400!important;
  color:var(--ex-gold-d)!important;
}

/* ── METALLIC GOLD ──
   The italic lines are painted with a gradient rather than a flat
   colour, so the letterforms catch light the way brushed brass
   does. The solid colour above is the fallback and comes first. */
.pmi-hero-headline em,
.pmi-sec-title em,
.pmi-form-title em,
.pmi-foot-headline em {
  background:linear-gradient(96deg,
    #B8903F 0%, #7A5A1E 26%, #D9B96B 46%, #6B4E18 68%, #AD8437 88%, #7A5A1E 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent!important;
  text-shadow:none!important;
}
@supports not (background-clip:text) {
  .pmi-hero-headline em, .pmi-sec-title em,
  .pmi-form-title em, .pmi-foot-headline em {
    -webkit-text-fill-color:var(--ex-gold-d)!important; background:none;
  }
}

.pmi-hero-sub {
  font-size:14.5px!important; font-weight:300; line-height:2.0;
  color:var(--ex-body)!important; text-align:center!important;
  max-width:660px; margin:0 auto 34px;
  text-shadow:0 1px 22px rgba(251,248,244,.98);
}
.pmi-hero-btns { display:flex; align-items:center; justify-content:center; gap:13px; flex-wrap:wrap; }

.pmi-btn-rose {
  display:inline-flex; align-items:center; gap:11px;
  font-family:'Syne',sans-serif!important; font-size:10.5px!important; font-weight:700!important;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--ex-cream)!important; background:var(--ex-maroon)!important;
  padding:16px 42px; border:1px solid var(--ex-maroon); cursor:pointer;
  transition:background .35s, border-color .35s, color .35s;
}
.pmi-btn-rose:hover { background:transparent!important; color:var(--ex-maroon)!important; border-color:var(--ex-maroon); }
.pmi-btn-soft {
  display:inline-flex; align-items:center; gap:11px;
  font-family:'Syne',sans-serif!important; font-size:10.5px!important; font-weight:700!important;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--ex-ink)!important; background:transparent!important;
  border:1px solid var(--ex-line)!important; padding:16px 42px; cursor:pointer;
  transition:background .35s, border-color .35s, color .35s;
}
.pmi-btn-soft:hover { border-color:var(--ex-maroon)!important; color:var(--ex-maroon)!important; }
.pmi-btn-rose svg, .pmi-btn-soft svg { transition:transform .3s; }
.pmi-btn-rose:hover svg, .pmi-btn-soft:hover svg { transform:translateX(4px); }

.pmi-scroll-cue {
  position:absolute; bottom:30px; left:50%; transform:translateX(-50%); z-index:4;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.pmi-scroll-cue span {
  font-family:'Syne',sans-serif; font-size:8.5px; font-weight:700;
  letter-spacing:.34em; text-indent:.34em; text-transform:uppercase;
  color:var(--ex-maroon);
  text-shadow:0 1px 12px rgba(251,248,244,1), 0 0 6px rgba(251,248,244,1);
}
.pmi-scroll-line {
  width:1px; height:40px;
  background:linear-gradient(to bottom, var(--ex-maroon), transparent);
  animation:pmiScroll 2.2s ease-in-out infinite;
}
@keyframes pmiScroll {
  0%,100%{opacity:1;transform:scaleY(1);transform-origin:top}
  50%{opacity:.3;transform:scaleY(.5);transform-origin:top}
}

/* ══ MARQUEE — the kinds of partnership we take on ═════════ */
.pmi-marquee-strip {
  border-top:1px solid var(--ex-line); border-bottom:1px solid var(--ex-line);
  overflow:hidden; background:var(--ex-cream);
}
.pmi-marquee-track { display:flex; animation:pmiMarquee 38s linear infinite; white-space:nowrap; }
.pmi-marquee-track:hover { animation-play-state:paused; }
.pmi-mq-item {
  display:inline-flex; align-items:center; gap:14px;
  padding:11px 28px; border-right:1px solid var(--ex-line); flex-shrink:0;
}
.pmi-mq-item span {
  font-family:'Syne',sans-serif!important; font-size:10px!important; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--ex-soft)!important;
}
.pmi-mq-dot { width:4px; height:4px; transform:rotate(45deg); background:var(--ex-gold); flex-shrink:0; }
@keyframes pmiMarquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ══ SHARED SECTION FURNITURE ══════════════════════════════ */
.pmi-eyebrow-center {
  display:flex; align-items:center; justify-content:center; gap:14px; margin-bottom:18px;
}
.pmi-eyebrow-center span {
  font-family:'Syne',sans-serif!important; font-size:9px!important; font-weight:700;
  letter-spacing:.34em; text-transform:uppercase; color:var(--ex-maroon)!important;
}
.pmi-eyebrow-bar { width:34px; height:1px; background:var(--ex-gold-l); }
.pmi-sec-title {
  font-family:'Cormorant Garamond',serif!important;
  font-size:clamp(28px,3.4vw,48px)!important;
  font-weight:300!important; line-height:1.08!important; letter-spacing:-.012em!important;
  color:var(--ex-ink)!important; text-align:center!important;
}
.pmi-sec-sub {
  font-size:14px!important; font-weight:300!important; line-height:1.95!important;
  color:var(--ex-body)!important; text-align:center!important;
  max-width:600px; margin:16px auto 0;
}
.pmi-rule-center {
  display:flex; align-items:center; justify-content:center; gap:10px; margin:28px auto 0;
}
.pmi-rule-center i { display:block; width:36px; height:1px; background:var(--ex-gold-l); }
.pmi-rule-center b { display:block; width:5px; height:5px; transform:rotate(45deg); background:var(--ex-gold); }

/* ══════════════════════════════════════════════════════════
   WHO WE WORK WITH — three partner types
   Mirrors the three options in the enquiry form, so the page
   answers the question the form is about to ask.
══════════════════════════════════════════════════════════ */
.pmi-who { background:var(--ex-cream); padding:56px 64px 60px; border-bottom:1px solid var(--ex-line); }
.pmi-who-inner { max-width:1180px; margin:0 auto; }
.pmi-who-grid {
  margin-top:34px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:22px;
}
.pmi-who-card {
  background:var(--ex-cream); border:1px solid var(--ex-line);
  padding:32px 28px 30px;
  transition:transform .45s, border-color .45s;
}
.pmi-who-card:hover { transform:translateY(-3px); border-color:var(--ex-gold); }
.pmi-who-num {
  font-family:'Syne',sans-serif; font-size:8.5px; font-weight:700;
  letter-spacing:.30em; text-transform:uppercase;
  color:var(--ex-maroon); display:block; margin-bottom:14px;
}
.pmi-who-name {
  font-family:'Cormorant Garamond',serif!important;
  font-size:26px!important; font-weight:400!important; line-height:1.15;
  color:var(--ex-ink)!important; margin-bottom:11px;
}
.pmi-who-name em { font-style:italic!important; color:var(--ex-gold-d)!important; }
.pmi-who-card p { font-size:13.5px; font-weight:300; line-height:1.85; color:var(--ex-body); }
.pmi-who-list { list-style:none; margin-top:15px; display:flex; flex-direction:column; gap:9px; }
.pmi-who-list li {
  display:flex; align-items:flex-start; gap:11px;
  font-size:12.5px; font-weight:300; line-height:1.7; color:var(--ex-body);
}
.pmi-who-list li::before {
  content:''; flex-shrink:0; margin-top:7px;
  width:5px; height:5px; transform:rotate(45deg); background:var(--ex-gold);
}

/* ══════════════════════════════════════════════════════════
   HOW A PARTNERSHIP STARTS — four steps
══════════════════════════════════════════════════════════ */
.pmi-steps { background:var(--ex-sand); padding:56px 64px 60px; border-bottom:1px solid var(--ex-line); }
.pmi-steps-inner { max-width:1180px; margin:0 auto; }
.pmi-steps-list {
  list-style:none; margin-top:34px;
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--ex-line); border-left:1px solid var(--ex-line);
}
.pmi-step {
  border-right:1px solid var(--ex-line); border-bottom:1px solid var(--ex-line);
  background:var(--ex-cream); padding:28px 26px 30px;
  position:relative; overflow:hidden; transition:background .35s;
}
.pmi-step:hover { background:var(--ex-sand); }
.pmi-step::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:var(--ex-gold); transform:scaleX(0); transform-origin:left;
  transition:transform .55s cubic-bezier(.4,0,.2,1);
}
.pmi-step:hover::after { transform:scaleX(1); }
.pmi-step-num {
  font-family:'Cormorant Garamond',serif;
  font-size:44px; font-weight:300; font-style:italic;
  color:var(--ex-gold-l); line-height:1; display:block; margin-bottom:12px;
}
.pmi-step-name {
  font-family:'Syne',sans-serif!important; font-size:10px!important; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--ex-ink)!important; margin-bottom:9px;
}
.pmi-step p { font-size:12.5px; font-weight:300; line-height:1.8; color:var(--ex-body); }

/* ══════════════════════════════════════════════════════════
   COME AND SEE IT FIRST — the Experience Centre
══════════════════════════════════════════════════════════ */
.pmi-visit { background:var(--ex-cream); padding:56px 64px 60px; border-bottom:1px solid var(--ex-line); }
.pmi-visit-inner {
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:1.1fr .9fr; gap:52px; align-items:center;
}
.pmi-visit-body { font-size:14px; font-weight:300; line-height:1.95; color:var(--ex-body); }
.pmi-visit-body p + p { margin-top:15px; }
.pmi-visit-card { border:1px solid var(--ex-line); background:var(--ex-sand); padding:32px 34px 34px; }
.pmi-visit-card h3 {
  font-family:'Cormorant Garamond',serif!important;
  font-size:24px!important; font-weight:400!important;
  color:var(--ex-ink)!important; margin-bottom:16px;
}
.pmi-hours { list-style:none; }
.pmi-hours li {
  display:flex; justify-content:space-between; gap:18px;
  padding:9px 0; border-bottom:1px solid rgba(220,207,188,.7);
  font-size:12.5px; font-weight:300; color:var(--ex-body);
}
.pmi-hours li:last-child { border-bottom:none; }
.pmi-hours span:first-child {
  font-family:'Syne',sans-serif; font-size:8.5px; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--ex-soft);
  padding-top:2px;
}

/* ══════════════════════════════════════════════════════════
   FAQ
══════════════════════════════════════════════════════════ */
.pmi-faq { background:var(--ex-sand); padding:56px 64px 62px; border-bottom:1px solid var(--ex-line); }
.pmi-faq-inner { max-width:860px; margin:0 auto; }
.pmi-faq-list { margin-top:32px; border-top:1px solid var(--ex-line); }
.pmi-faq-item { border-bottom:1px solid var(--ex-line); background:var(--ex-cream); }
.pmi-faq-item summary {
  list-style:none; cursor:pointer;
  padding:20px 52px 20px 24px; position:relative;
  font-family:'Cormorant Garamond',serif!important;
  font-size:20px!important; font-weight:400!important; line-height:1.35;
  color:var(--ex-ink)!important;
  transition:color .3s;
}
.pmi-faq-item summary::-webkit-details-marker { display:none; }
.pmi-faq-item summary:hover { color:var(--ex-maroon)!important; }
/* the +/− is drawn rather than typed so it lines up at any size */
.pmi-faq-item summary::after,
.pmi-faq-item summary::before {
  content:''; position:absolute; right:24px; top:50%;
  background:var(--ex-maroon); transition:transform .35s, opacity .35s;
}
.pmi-faq-item summary::before { width:13px; height:1px; margin-top:-1px; }
.pmi-faq-item summary::after  { width:1px; height:13px; margin-top:-7px; right:30px; }
.pmi-faq-item[open] summary::after { transform:rotate(90deg); opacity:0; }
.pmi-faq-answer {
  padding:0 52px 22px 24px;
  font-size:13.5px; font-weight:300; line-height:1.9; color:var(--ex-body);
}
.pmi-faq-answer a { border-bottom:1px solid var(--ex-line); }
.pmi-faq-answer a:hover { color:var(--ex-maroon); border-color:var(--ex-maroon); }

/* ══════════════════════════════════════════════════════════
   2 · TRUSTED BY LEADERS LIKE...      (PRISM's logo bar)
══════════════════════════════════════════════════════════ */
.pmi-logos {
  background:var(--ex-sand)!important; padding:52px 64px 56px;
  border-bottom:1px solid var(--ex-line);
}
.pmi-logos-inner { max-width:1180px; margin:0 auto; }
.pmi-logo-grid {
  margin-top:34px;
  display:grid; grid-template-columns:repeat(6,1fr);
  border-top:1px solid var(--ex-line); border-left:1px solid var(--ex-line);
}
.pmi-logo-cell {
  border-right:1px solid var(--ex-line); border-bottom:1px solid var(--ex-line);
  background:var(--ex-cream);
  aspect-ratio:5/3;
  display:flex; align-items:center; justify-content:center;
  padding:22px 24px;
  transition:background .35s;
}
.pmi-logo-cell:hover { background:var(--ex-sand2); }
.pmi-logo-cell img {
  max-width:100%; max-height:100%; width:auto; height:auto;
  object-fit:contain;
  /* logos arrive in every colour under the sun — this settles them
     into the page's tone, and hover hands the colour back */
  filter:grayscale(1) opacity(.62) sepia(.22);
  transition:filter .4s, transform .4s;
}
.pmi-logo-cell:hover img { filter:grayscale(0) opacity(1) sepia(0); transform:scale(1.03); }
/* placeholder well, shown until you paste a logo URL */
.pmi-logo-ph {
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center; gap:9px;
  border:1px dashed rgba(220,207,188,.95);
}
.pmi-logo-ph b { display:block; width:5px; height:5px; transform:rotate(45deg); background:var(--ex-gold-l); }
.pmi-logo-ph span {
  font-family:'Syne',sans-serif; font-size:8px; font-weight:700;
  letter-spacing:.26em; text-transform:uppercase; color:var(--ex-gold-l);
}

/* ══════════════════════════════════════════════════════════
   3 · OUR PARTNERSHIPS, MEDIA, INFLUENCERS   (PRISM's slider)
   Same carousel mechanics as the Rose Gold collection strip:
   4 across, scroll-snap, arrows that disable at the ends.
══════════════════════════════════════════════════════════ */
.pmi-gallery { background:var(--ex-cream); padding:54px 64px 60px; border-bottom:1px solid var(--ex-line); }
.pmi-gallery-header { max-width:1380px; margin:0 auto; }
.pmi-car { position:relative; max-width:1380px; margin:30px auto 0; }
.pmi-car-track {
  display:flex; gap:18px; overflow-x:auto; overflow-y:hidden;
  scroll-snap-type:x mandatory; scroll-behavior:smooth;
  scrollbar-width:none; -ms-overflow-style:none; padding:8px 0 12px;
}
.pmi-car-track::-webkit-scrollbar { display:none; }
.pmi-car-track > * { flex:0 0 calc((100% - 54px) / 4); scroll-snap-align:start; }
.pmi-shot {
  position:relative; overflow:hidden;
  aspect-ratio:4/5; background:var(--ex-sand2);
  border:1px solid var(--ex-line);
  transition:border-color .5s, transform .5s;
}
.pmi-shot:hover { transform:translateY(-3px); border-color:var(--ex-gold); }
.pmi-shot img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .7s cubic-bezier(.25,.46,.45,.94);
}
.pmi-shot:hover img { transform:scale(1.05); }
.pmi-shot-num {
  position:absolute; top:12px; left:14px; z-index:2;
  font-family:'Syne',sans-serif;
  font-size:8.5px; font-weight:700; letter-spacing:.22em;
  color:var(--ex-ink); background:rgba(251,248,244,.92);
  padding:5px 10px;
}
.pmi-shot-cap {
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding:26px 16px 14px;
  background:linear-gradient(to top, rgba(251,248,244,.96) 22%, transparent 100%);
  font-family:'Syne',sans-serif; font-size:9px; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--ex-maroon);
}
/* ── VIDEO CARDS ──
   A gallery entry with a `youtube` id becomes a linked card: the
   video's own thumbnail, a play badge, and a click straight
   through to YouTube in a new tab. */
.pmi-shot-link { display:block; width:100%; height:100%; position:relative; }
/* YouTube's sd/hq thumbnails are 4:3 with the 16:9 frame letterboxed
   inside them, so a straight cover-crop would show black bands top
   and bottom. Zooming past them removes the bands. maxresdefault,
   where it exists, is already 16:9 — the JS tags those .pmi-thumb-full
   and the zoom drops back to 1. */
.pmi-shot-link img {
  --thumb-zoom:1.36;
  transform:scale(var(--thumb-zoom));
}
.pmi-shot-link img.pmi-thumb-full { --thumb-zoom:1; }
.pmi-shot:hover .pmi-shot-link img { transform:scale(calc(var(--thumb-zoom) * 1.05)); }
.pmi-shot-play {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  z-index:3; width:52px; height:52px; border-radius:50%;
  background:rgba(122,31,34,.88); border:1px solid rgba(251,248,244,.55);
  display:flex; align-items:center; justify-content:center;
  transition:transform .4s cubic-bezier(.25,.46,.45,.94), background .4s;
}
.pmi-shot-play::after {
  content:''; display:block;
  border-left:13px solid var(--ex-cream);
  border-top:8px solid transparent;
  border-bottom:8px solid transparent;
  margin-left:4px;
}
.pmi-shot:hover .pmi-shot-play { transform:translate(-50%,-50%) scale(1.09); background:var(--ex-maroon); }

/* placeholder well, shown until you paste gallery URLs */
.pmi-shot-ph {
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:11px;
  background:var(--ex-sand2);
}
.pmi-shot-ph b { display:block; width:7px; height:7px; transform:rotate(45deg); background:var(--ex-gold-l); }
.pmi-shot-ph span {
  font-family:'Syne',sans-serif; font-size:8px; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:var(--ex-gold-d);
}
.pmi-car-btn {
  position:absolute; top:46%; transform:translateY(-50%); z-index:5;
  width:46px; height:46px;
  background:var(--ex-cream); border:1px solid var(--ex-line);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background .25s, border-color .25s, opacity .25s;
}
.pmi-car-btn:hover { background:var(--ex-maroon); border-color:var(--ex-maroon); }
.pmi-car-btn:hover svg path { stroke:#fff; }
.pmi-car-btn[disabled] { opacity:.26; cursor:default; }
.pmi-car-btn[disabled]:hover { background:var(--ex-cream); border-color:var(--ex-line); }
.pmi-car-btn[disabled]:hover svg path { stroke:var(--ex-ink); }
.pmi-car-prev { left:-23px; }
.pmi-car-next { right:-23px; }
@media (max-width:1480px) { .pmi-car-prev { left:-8px; } .pmi-car-next { right:-8px; } }

/* ══════════════════════════════════════════════════════════
   4 · REACH OUT — enquiry form + contact details
   PRISM runs the form on one side and a photo with phone and
   address on the other. Same split, built natively instead of
   in an iframe so it inherits the page's type.
══════════════════════════════════════════════════════════ */
.pmi-enquiry { background:var(--ex-sand)!important; padding:56px 64px 62px; }
.pmi-enquiry-inner {
  max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:1.05fr .95fr; gap:0;
  border:1px solid var(--ex-line); background:var(--ex-cream);
}

/* left — the form */
.pmi-form-col { padding:44px 44px 46px; }
.pmi-form-eyebrow { display:flex; align-items:center; gap:12px; margin-bottom:13px; }
.pmi-form-eyebrow i { display:block; width:22px; height:1px; background:var(--ex-gold); }
.pmi-form-eyebrow span {
  font-family:'Syne',sans-serif!important; font-size:9px!important; font-weight:700;
  letter-spacing:.34em; text-transform:uppercase; color:var(--ex-maroon)!important;
}
.pmi-form-title {
  font-family:'Cormorant Garamond',serif!important;
  font-size:clamp(26px,2.7vw,40px)!important;
  font-weight:300!important; line-height:1.08!important;
  color:var(--ex-ink)!important; margin-bottom:12px;
}
.pmi-form-lede {
  font-size:13.5px!important; font-weight:300; line-height:1.85;
  color:var(--ex-body)!important; margin-bottom:28px; max-width:440px;
}
.pmi-field { margin-bottom:17px; }
.pmi-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.pmi-field label {
  display:block; margin-bottom:7px;
  font-family:'Syne',sans-serif!important; font-size:8.5px!important; font-weight:700;
  letter-spacing:.24em; text-transform:uppercase; color:var(--ex-soft)!important;
}
.pmi-field input,
.pmi-field select,
.pmi-field textarea {
  width:100%; padding:13px 15px;
  background:var(--ex-cream);
  border:1px solid var(--ex-line); border-radius:0;
  font-size:14px; font-weight:300; color:var(--ex-ink);
  transition:border-color .3s, background .3s;
  -webkit-appearance:none; appearance:none;
}
.pmi-field textarea { min-height:108px; resize:vertical; line-height:1.7; }
.pmi-field select {
  /* the native arrow is drawn in the browser's blue — replaced with
     a maroon chevron so the control matches everything around it */
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7' fill='none'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%237A1F22' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 15px center;
  padding-right:38px;
}
.pmi-field input:focus,
.pmi-field select:focus,
.pmi-field textarea:focus {
  outline:none; border-color:var(--ex-maroon); background:var(--ex-cream);
}
.pmi-field input::placeholder, .pmi-field textarea::placeholder { color:rgba(107,96,88,.55); }
.pmi-hint { margin-top:6px; font-size:11.5px; font-weight:300; line-height:1.6; color:var(--ex-soft); }

.pmi-check {
  display:flex; align-items:flex-start; gap:11px;
  margin:22px 0 26px;
  font-size:12px; font-weight:300; line-height:1.75; color:var(--ex-body);
}
.pmi-check input { width:15px; height:15px; margin-top:3px; flex-shrink:0; accent-color:var(--ex-maroon); }
.pmi-check a { border-bottom:1px solid var(--ex-line); }
.pmi-check a:hover { color:var(--ex-maroon); border-color:var(--ex-maroon); }

.pmi-submit { width:100%; justify-content:center; }

/* success state */
.pmi-sent { display:none; text-align:center; padding:34px 8px; }
.pmi-sent.pmi-show { display:block; }
.pmi-sent-mark {
  width:44px; height:44px; margin:0 auto 20px;
  border:1px solid var(--ex-gold); transform:rotate(45deg);
  display:flex; align-items:center; justify-content:center;
}
.pmi-sent-mark svg { transform:rotate(-45deg); }
.pmi-sent h3 {
  font-family:'Cormorant Garamond',serif!important;
  font-size:30px!important; font-weight:300!important;
  color:var(--ex-ink)!important; margin-bottom:11px;
}
.pmi-sent p {
  font-size:13.5px; font-weight:300; line-height:1.9;
  color:var(--ex-body); max-width:380px; margin:0 auto;
}

/* right — photo + contact details */
.pmi-contact-col {
  border-left:1px solid var(--ex-line);
  display:flex; flex-direction:column;
  background:var(--ex-cream);
}
.pmi-contact-img {
  position:relative; flex:1 1 auto; min-height:300px;
  background:var(--ex-sand2); background-size:cover; background-position:center;
  overflow:hidden;
}
.pmi-contact-img::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to bottom, rgba(251,248,244,.04) 62%, rgba(251,248,244,.55) 100%);
}
/* the Brand Experience Centre clip, if one is set */
.pmi-contact-vid {
  position:absolute; inset:0; z-index:1;
  width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity 1.2s ease;
}
.pmi-contact-vid.pmi-playing { opacity:1; }
.pmi-contact-ph {
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
}
.pmi-contact-ph b { display:block; width:7px; height:7px; transform:rotate(45deg); background:var(--ex-gold-l); }
.pmi-contact-ph span {
  font-family:'Syne',sans-serif; font-size:8px; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:var(--ex-gold-d);
}
.pmi-contact-list { padding:30px 40px 34px; border-top:1px solid var(--ex-line); }
.pmi-contact-row {
  display:flex; align-items:flex-start; gap:15px;
  padding:14px 0; border-bottom:1px solid rgba(220,207,188,.6);
}
.pmi-contact-row:last-child { border-bottom:none; padding-bottom:0; }
.pmi-contact-row:first-child { padding-top:0; }
.pmi-contact-row svg { flex-shrink:0; margin-top:2px; }
.pmi-contact-label {
  font-family:'Syne',sans-serif!important; font-size:8px!important; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:var(--ex-soft)!important;
  display:block; margin-bottom:5px;
}
.pmi-contact-val {
  font-family:'Cormorant Garamond',serif!important;
  font-size:20px!important; font-weight:300!important; line-height:1.35;
  color:var(--ex-ink)!important;
}
.pmi-contact-val a { transition:color .3s; }
.pmi-contact-val a:hover { color:var(--ex-maroon); }
/* the street lines under the Experience Centre name — set in the
   body face so three lines of serif don't crowd the panel */
.pmi-contact-sub {
  font-size:12.5px; font-weight:300; line-height:1.7;
  color:var(--ex-body); margin-top:5px;
}

/* ══ FOOT ══════════════════════════════════════════════════ */
.pmi-foot {
  background:var(--ex-cream)!important; padding:58px 64px 64px;
  text-align:center; position:relative; overflow:hidden;
  border-top:1px solid var(--ex-line);
}
.pmi-foot-bg-word {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(54px,11vw,150px); font-weight:300; font-style:italic;
  color:rgba(122,31,34,.055); white-space:nowrap; pointer-events:none;
  letter-spacing:-.03em; line-height:1; user-select:none;
}
.pmi-foot-inner { position:relative; z-index:2; max-width:620px; margin:0 auto; }
.pmi-foot-headline {
  font-family:'Cormorant Garamond',serif!important;
  font-size:clamp(27px,3.6vw,50px)!important;
  font-weight:300!important; line-height:1.06!important; letter-spacing:-.02em!important;
  color:var(--ex-ink)!important; margin-bottom:15px;
}
.pmi-foot-sub {
  font-size:14px!important; font-weight:300; line-height:1.95;
  color:var(--ex-body)!important; margin:0 auto 30px; max-width:480px;
}
.pmi-foot-note {
  margin-top:34px; padding-top:24px; border-top:1px solid var(--ex-line);
  font-size:12px; font-weight:300; line-height:1.9; color:var(--ex-soft);
}
.pmi-foot-note a { border-bottom:1px solid var(--ex-line); }
.pmi-foot-note a:hover { color:var(--ex-maroon); border-color:var(--ex-maroon); }

/* ══ RESPONSIVE ════════════════════════════════════════════ */
@media (max-width:1100px) {
  .pmi-car-track > * { flex:0 0 calc((100% - 36px) / 3); }
  .pmi-logo-grid    { grid-template-columns:repeat(4,1fr); }
  .pmi-who-grid     { grid-template-columns:1fr; }
  .pmi-steps-list   { grid-template-columns:repeat(2,1fr); }
  .pmi-visit-inner  { grid-template-columns:1fr; gap:34px; }
  .pmi-who, .pmi-steps, .pmi-visit, .pmi-faq {
    padding-left:36px; padding-right:36px;
  }
  .pmi-enquiry-inner{ grid-template-columns:1fr; }
  .pmi-contact-col  { border-left:none; border-top:1px solid var(--ex-line); }
  .pmi-contact-img  { min-height:260px; }
  .pmi-hero, .pmi-logos, .pmi-gallery, .pmi-enquiry, .pmi-foot {
    padding-left:36px; padding-right:36px;
  }
  .pmi-form-col     { padding:40px 36px 42px; }
  .pmi-contact-list { padding:28px 36px 32px; }
  .pmi-hero         { padding-top:78px; padding-bottom:112px; }
}
@media (max-width:700px) {
  .pmi-car-track > * { flex:0 0 calc((100% - 18px) / 2); }
  .pmi-car-btn      { width:40px; height:40px; }
  .pmi-logo-grid    { grid-template-columns:repeat(2,1fr); }
  .pmi-steps-list   { grid-template-columns:1fr; }
  .pmi-who, .pmi-steps, .pmi-visit, .pmi-faq {
    padding-left:20px; padding-right:20px;
  }
  .pmi-visit-card   { padding:26px 22px 28px; }
  .pmi-faq-item summary   { padding:18px 46px 18px 18px; font-size:18px!important; }
  .pmi-faq-answer         { padding:0 46px 20px 18px; }
  .pmi-grid-2       { grid-template-columns:1fr; }
  .pmi-hero, .pmi-logos, .pmi-gallery, .pmi-enquiry, .pmi-foot {
    padding-left:20px; padding-right:20px;
  }
  .pmi-form-col     { padding:34px 24px 36px; }
  .pmi-contact-list { padding:26px 24px 30px; }
  .pmi-hero-btns    { flex-direction:column; align-items:stretch; }
  .pmi-btn-rose, .pmi-btn-soft { justify-content:center; }
  .pmi-hero         { min-height:70vh; padding-top:64px; padding-bottom:100px; }
  .pmi-hero-headline{ font-size:clamp(34px,9vw,54px)!important; }
}
</style>

.shopify-section.section-pmi { margin:0; padding:0; max-width:none; }
noscript .pmi-wrap .pmi-reveal, .pmi-wrap .pmi-reveal-l, .pmi-wrap .pmi-word { opacity:1!important; transform:none!important; }
.pmi-form-app-placeholder { padding:28px 24px; border:1px dashed var(--ex-line); background:var(--ex-sand); color:var(--ex-soft); font-size:14px; text-align:center; }